CSSを使った階層メニューのテンプレートに
「Multi-level menu CSS generator」
![]() |
|---|
| 「Multi-level menu CSS generator」では2階層のドロップダウン・メニューを作成できる |
2階層までのドロップダウン・メニューを作成するジェネレーター。デザインはカラーバリエーションを含めて12種類用意されており、背景やテキストカラー、フォント名などがカスタマイズ可能。自動で生成されるのはCSSだけなので、HTMLは自分で書く必要があるが、<ul><li>タグにスタイルを適用するだけで簡単に実装できる。
■URL= http://pixopoint.com/suckerfish_css/
![]() |
|---|
| パラメーターを設定すると、ページの下部にCSSが生成される。「Multi-level menu CSS generator」でできるのはここまで。このあとは、このCSSをベースにして自分のサイトに組み込む |
ブラウザー上でページ丸ごとカスタマイズ
「dotemplate」
![]() |
|---|
| 「dotemplate」のメイン画面。右側のパネルで各種設定を変更し、変更点をプレビューしながらページを完成させる |
![]() |
|---|
| dotemplateで選べるテンプレートの一部。商業デザイナーが作成しているだけに質の高いデザインが多い |
![]() |
|---|
| 画面のように、メニュー画像のデザインも複数の中化から選べる |
ここまで紹介したのはページ内の“パーツ”を作るものばかりだが、「dotemplate」はWebページの要素すべてを生成してくれるジェネレーターだ。商業デザイナーが作った(X)HTML+CSSのテンプレートをベースにWebブラウザー上でCSSをカスタマイズして、最終的にZIPファイルでまとめてデータをダウンロードできる。
現在用意されているデザインテンプレートは17種類だが、タイトル周りの画像やナビゲーション部分のデザインなど、dotemplate上だけで変更できる項目も多く、ダウンロードしたファイルを少し手直しするだけで、ちょっとしたWebページなら完成してしまう。いろいろと項目を変更してプレビューしてみるだけでもデザインパターンを考える上で参考になるし、かなり楽しめるサービスだ。
■URL= http://www.dotemplate.com/index.jsp



























