トップページには、各ページへの案内としてナビゲーションメニューを設置します。
簡単に、文字やアイコンで表したものから、デザインタブを作成して目を引かせるナビゲーションなどあります。
優れたナビゲーションほど、ホームページへの閲覧回数が多いように思えます。
扱いやすく、リンク先の内容がわかる、またホームページの画面の邪魔にならない
そんなナビゲーションのサンプルを集めて見ましたしました。

Collapsing Site Navigation with jQuery
かなりおしゃれなナビゲーションに仕上げたい時におすすめですね。
アニメーションが面白くインパクトがあります。

デモサイトはこちら
Expanding Image Menu with jQuery
イメージを縦長に表現できたら、これをナビゲーションに使えば目を引きます
開いたアコーディオン画面がキャプションになります。

デモサイトはこちら
Circular Content Carousel with jQuer
パネル詳細をクリックすることで詳細画面開き、リンクナビを設置することができます。
商品説明などのナビゲーションに応用できます

デモサイトはこちら
Sliding Boxes and Captions with JQuery
トップ画面全体がナビゲーションになります。マウスオーバーでメニューが出現します
デザイン重視の、かなりインパクトのあるトップページが制作できますね。

デモサイトはこちら
Vertical Sliding Accordion with jQuery
縦に配列されたボックスがマウスクリックで広がり、詳細画面とリンクナビを設置できます。
表示ボックスも複数設定できるようになっています。
デモサイトはこちら
Awesome Bubble Navigation with jQuery
シンプルなデザインの中、リンクナビのバッブルズームが際立つナビです。
画面を派手にせず、スマートなナビゲーションを考えた時、おすすめのナビゲーションです

デモサイトはこちら
Animated Text and Icon Menu with jQuery
よくアイコンをナビ下ショーンに使いますが、これはアイコンを大胆にアニメーション化しました。
見た目地味ですが、色使いを大胆にすれば、結構派手なナビゲーションです。

デモサイトはこちら
Top Bar Menu
TwitterやFaceBookのトップバーのメニュ風
▽でメニューバーが開く部分のナビゲーションです。

デモサイトはこちら
Top Bar Menu
これもトップバーやフッターバーの中に、メニュータグを配置してみました。
全画面を多用したページが増えてきた今、このように邪魔にならないナビゲーションも必要です。

デモサイトはこちら
PrettySimpleContentSlider
サイドバータブの動きと、パネルスライドがまっちしたナビゲーションパネルです。
コンテンツ部分も充実しているので、応用しやすいナビパネルです。

デモサイトはこちら
Animated Buttons with CSS3
アニメーションをつけたメニューバー、目立ちますね。
タブに説明やイメージをつければ、リンク先が見えますね。

デモサイトはこちら
How to spice up your menu with CSS3
メニュータブをマウスオーバーすれば、イメージが浮かび上がります。
使い方次第では、面白いナビゲーションになります。

デモサイトはこちら