サイトナビゲーション

サイトナビゲーション機能で、閲覧が便利になります。

ホームページは、内容が良いものであることはもちろんですが、ユーザーが閲覧しやすいサイトにするのが大事ですね。 そのための便利な機能に、サイトナビゲーションがあります。 ここではサイトナビゲーションについて解説します。

このページの作成にあたり、Opera 7に於るlink要素link 要素とサイトナビゲーションバーを参考にさせていただきました。

サイトナビゲーションとは

サイトナビゲーションとは、サイトの各コンテンツ間の関係を示したもので、日本語では道案内、といった意味になります。 今見ているページから上位階層へ移動したり、同一階層間で行き来したり、トップページへ移動したり、といったことができます。

OperaMozillaの場合のキャプチャー画面をのせておきます。赤い丸で囲った部分がサイトナビゲーションです。

サイトナビゲーションを作るには

サイトナビゲーションを作るには、<head> タグ内部に、 以下のように記述してください。 サンプルでは相対参照にしていますが、 もちろん絶対参照(http:// で始まる形式)でもOKです。

<link rel="start" href="../" title="人気ホームページ製作法">
<link rel="index" href="./" title="ホームページを持つ全ての方に">
<link rel="begin" href="./" title="ホームページを持つ全ての方に">
<link rel="prev" href="./usability.html" title="ユーザビリティ">
<link rel="next" href="./kyoyu.html" title="メニューの共有">

全てではありませんが、簡単に解説しておきます。 startupprevnextなどを書いておくと、サイト閲覧が便利になると思います。

start
トップページを示す。
up
1つ上の階層を示す。
begin first
同一階層内の最初のページを示す。
prev
同一階層内の1つ前のページを示す。
next
同一階層内の1つ後のページを示す。
end last
同一階層内の最後のページを示す。
index
索引を示す。
contents
目次を示す。
copyright
著作権表記を示す。

この他にも、chaptersection等があります。 小説をホームページで公開される方は利用されると良いでしょう。

サイトナビゲーションの利点

サイトナビゲーションには、画面内に表示されるメニューと比べると、以下のような利点があります。

ブラウザ上に常に表示される。
画面内のメニューは、スクロールすると消えてしまうことが多いですが、サイトナビゲーションならブラウザの決まった位置に常に表示されます。
リンク先との関係がわかる。
階層関係、前後関係が記述されているので、移動しやすくなります。
どのサイトでも同じ表示になる。
画面内のメニューは、サイトごとに位置や配置方法などが異なりますが、サイトナビゲーションは、サイトにかかわらず常に表示方法が同じなので、新規訪問でもとまどうことがありません。
ショートカット機能が使える。
ブラウザの設定で「前へ」「次へ」などにショートカットを割り当てておくとサイト閲覧がしやすくなります。
サイト表示が速くなる。
先読みブラウザだと、ブラウザが先読みしてくれるので、次ページ表示が速くなります。

サイトナビゲーションを使用しているホームページ

ホームページ作成ソフトは多くありますが、標準でサイトナビゲーションをヘッダに出力するものは少ないようです。 このため、普通のホームページではほとんどサイトナビゲーション機能は使われていません。

CMS ツールを使用すると、多くの場合、link rel 属性をヘッダーに追加してくれます。

新着記事
人気記事ベスト3
全てのホームページ製作者に
アフィリエイトで稼ぐ方法
サーチエンジン最適化
携帯サイトの作り方
レンタルサーバの選び方
ホームページ作成ソフト
python入門
パソコン便利グッズ