【知らないと損!?】ホームページ上の機能と名称

はじめに

こんにちは、内定者の篠原です。

日々、自社のホームページの運用をしている方でも、ホームページの機能やその名称まで熟知しているという方は少ないのではないでしょうか。

例えば、自分以外の誰かに修正を依頼するとき、「機能の名称を知っていればスムーズに伝えられるのに・・」ということはありませんか?

「グローバルナビゲーション」と言えば一言で伝えられるのに、「ページの上のほうにあるメニュー」などとだらだらした伝え方になってしまったり・・

今回は、そんな方に向けて、ホームページ上に設置されている主要な機能とその名称をご紹介します!

 

トップページ

ホームページの玄関口といえるページです。

そのホームページが、誰のための、どのような目的のサイトであるかを伝える役割をしています。

弊社ミスターフュージョンでは、トップページを見て「3秒以内で何屋か(何をしてくれるのか・どんな価値を与えてくれるのか)がわかる」ことを大切にしています。

また、各ページへの案内や新着情報など、受付のような役割も果たしています。

 

下層ページ

トップページ以外のページのことを指します。

ホームページは基本的にツリー構造となっており、頂点にトップページがあり、そこから下層ページが枝分かれするように存在しています。

基本的に、下層ページのデザインはひとつのパターン、あるいはいくつかのパターンをテンプレート化して共通のものを用いたほうが良いでしょう。

バラバラのデザインにしてしまうと、ユーザーが別のサイトに移動してしまったと錯覚する場合があるからです。

 

カラム

ホームページのデザインにおけるカラムは縦の区切りのことを指します。

当サイトは、横にサイドバーのある2カラムの構造になっていて、人気の記事ランキングや検索など、情報量を多くできることがメリットです。

あまり分割しすぎると1つ1つのカラムが見づらくなってしまうため、バランスに注意しましょう。

 

ヘッダー

Webページの上部に位置し、どのページが開かれても常に共通して表示される部分のことを指します。

グローバルナビゲーションをヘッダーに組み込んだものも多く見受けられます。

また、ホームページ全体のイメージを決める要素であるため、ブランドに相応しいグラフィックが使われます。

そのため、ブランドイメージ形成の大きな要素である会社のロゴも、ヘッダーに配置されます。

 

グローバルナビゲーション

ページの上部に設置されるメニューで、全ページに共通して表示されます。

ホームページ内の主要なコンテンツへのリンクがまとめられているので、ユーザーにとってホームページの全体像が把握しやすくなります。

 

フッター

ページ下部に表示される共通パーツです。ヘッダーと同様に全ページ、もしくはトップページを除いた下層ページに共通でつけるのが一般的です。

運営会社の案内や個人情報保護ページなど、主要コンテンツ以外のページへのリンクが貼ってあることが多いです。

また、当サイトのようにフッターにサイトマップを載せている例もあります。

 

サイトマップ

ホームページ内のすべてのページにアクセスできる、目次のようなページのことを指します。

当サイトのように、フッターにサイトマップを表示しているホームページも多く見受けられます。

ユーザーが探しているコンテンツを見つけやすいように、コンテンツをリスト形式などで整理して表示しています。

 

パンくずリスト

閲覧しているページが、ホームページ全体のどの階層、どの位置にあるのかが提示されているリンクのことを指します。

グリム童話の「ヘンゼルとグレーテル」で、森で迷子にならないように、主人公がパンくずを置いていった話が名前の由来になっています。

パンくずリストは、内部リンクとなるため、適切に設置すれば内部のSEO対策にも効果的です。

 

アコーディオンメニュー

クリックしたり、マウスのカーソルを合わせたりすると、アコーディオンのように開くメニューのことを指します。

 

バナー

ホームページ上に表示されるリンク付きの画像のことを指します。

ホームページの両端や上部など、メインコンテンツを取り囲むように設置されます。

広告用のバナーには、他のWebサイトへ誘導するリンクが貼られており、クリックされるごとに課金が発生する仕組みになっています。

 

ソーシャルボタン

Twitterであれば「ツイート」、Facebookであれば「いいね!」や「シェア」などのボタンをホームページ内に設置することができるツールのことを指します。

ソーシャルボタンを導入することで、ユーザーが簡単にホームページ内の記事などの情報を外部に共有・拡散することができるようになります。

 

テキストリンク

HTML文書でリンクが設定された文字列のことを指します。

テキストリンクは、文字列と設定した URLが リンクしているため、どのような ページの URLなのかを ユーザーにわかりやすく表示するメリットがあります。

 

マウスオーバー

ホームページ内の画像やテキストにカーソルをあわせた時に、色や画像が変わる仕様のことを指します。

マウスオーバー効果によって、ユーザーが「クリックできる」と認識してもらいやすくなれば、クリック率向上にも繋がります!

 

アイコン

機能やコンテンツ内容を図形で表したもののことを指し、一般的にはメニュー表示に使われます。

 

ファビコン

Webブラウザでホームページを開いた時に、タブ部分に表示されるアイコンのことを指します。

タブブラウザ(Google Chromeのような1つの画面で複数のページが開けるブラウザ)で複数のタブを開いた時に、ページを判別する目印の役割にもなります。

 

カルーセル

(引用:http://programming-study.com/kids/

画像が横にスライドする機能のことを指します。

トップページに利用されることが多く、特にユーザーが必ず見るであろうページ上部に、強調したい複数のコンテンツを表示させられることが、カルーセルの大きなメリットです。

 

サムネイル

一覧表示用に縮小された画像のことを指します。

記事への誘導を目的としているため、ほとんどの場合、画像にリンクが付けられており、サムネイルをクリックするとリンク先に遷移する仕様になっています。

 

おわりに

いかがでしたでしょうか。

今回は、ホームページの主要な機能と名称についてご紹介しました。

「機能は知っていたけど、こんな名前がついていたの!?」と初めて知るものも多かったのではないでしょうか。

明日から早速使ってみてくださいね!

参考になったらシェアをお願いします!