ナビゲーション・メニューまとめ

admin — Wed, 25 Jun 2008 04:43:53 +0000

IT-PLUSさんに、隔週で連載させていただいている、『ウェブデザインの力』

連載３回目の今回は、『アマゾンのリニューアルで考える効果的なナビゲーションの見せ方』というお題で、サイトのナビゲーション・メニューについて、すこし書かせていただきました。

今回の記事を書かせていただくにあたって、いろいろとサイトのナビゲーション・メニューについて調べたのですが、今回の記事に収まりきらなかったサイトを、せっかくなのでまとめてみました。

サイトのナビゲーション・メニューをデザインするのに、ちょっと参考になりそうな、ショーケース的なサイトをいくつか。

サイトのナビゲーション部分に特化したショーケースサイト。とってもきれいなナビゲーションがたくさん紹介されています。

コードや画像も公開されているので、初心者の方にも分かりやすい、CSSライブラリ。

コードや画像も公開されていて、さらにまとめてZipファイルで、ダウンロードできるCSSメニュー。

少し前の記事ですが、とにかく大量にシンプルなタブ型のメニューがまとめられています。

こちらは、13種類のスクリプトとCSSを使ったメニューのサンプル。

シンプルな、タブ型メニューのサンプルです。

Amazonのサイトデザインの歴史が一目でわかるサイト。

丁寧な解説付きのメニューのチュートリアルです。

とってもきれいな、タブ型のメニューがいっぱいまとめられています。

こちらは、Photoshopで作るメニューのチュートリアルがいっぱいです。

とにかく大量のCSSサンプルがあります。

お手軽にナビゲーション・メニューが作れるメニュー・ジェネレータをいくつか

デザインを選んで、メニューの数、リンク先などを入力するだけで、コードと画像がダウンロードできるジェネレータ。

左側のパネルでメニューを作っていくと、右側にプレビューが表示されるメニュージェネレータです。

こちらは、PCにインストールするタイプのメニュージェネレータです。

左側のパネルから、デザインを選ぶと、右側にプレビューとコードが表示されます。

かわいいタブを作ってくれるジェネレータです。

DesignWalker » navigation