ホームページでよく使われるパーツの名称を徹底解説！基本から応用まで

ホームページにはさまざまなパーツが用いられており、それぞれのパーツには名称があります。パーツの名称がよく分からないという人もいるでしょう。しかし、正しいパーツの名称や意味を知っておくことは重要です。この記事では、パーツの名称を知っておくべき理由や、ホームページでよく使われるパーツの名称などを解説します。ぜひ参考にしてください。

1.ホームページのパーツ名称を知っておくべき理由

ホームページの制作を依頼したいと考えている場合、正式なパーツ名称を知っておくことでイメージを明確に伝えやすくなります。パーツの名称が分からない場合、自分がイメージしているものでも、間違った情報を相手に伝える可能性もあります。
 
誤った名称やイメージで伝えてしまうと、思ったようなデザイン・機能にならず、完成品の修正などを再度依頼しなければならない事態も発生するでしょう。Webデザインの具体的なイメージを共有して認識齟齬を防ぐためにも、パーツ名称の把握は重要です。

2.基本的なホームページのパーツ名称

ホームページのパーツは数多くあります。ここでは、基本的なホームページのパーツ名称と特徴について解説します。

2-1.トップページ

トップページとは、Webサイトの主な入り口となるページです。基本的にはユーザーが最初に閲覧するページとなるため、全体の要約や抜粋を掲載し、ユーザーにどのようなホームページなのか記載されている必要があります。

2-2.下層ページ

下層ページとは、トップページから派生するページのことです。たとえば、「会社概要」や「商品紹介」「問合せ」などが下層ページにあたります。トップページで全体の要約を掲載し、下層ページで詳細について伝えるケースが一般的です。

2-3.メインコンテンツ

メインコンテンツとは、ユーザーに一番見てもらいたい主要コンテンツです。表示する内容は商品紹介やサービス紹介など、企業によってさまざまです。ユーザーにもっとも届けたい情報を掲載するため、更新頻度が高くなります。

3.ホームページによく使われるパーツの名称

ここでは、ホームページによく使われるパーツの名称と特徴について解説します。

3-1.ヘッダー

ヘッダーとはホームページ上部のことを指します。ヘッダーはどのページでも基本的に同じ位置にあり、一番はじめにユーザーの目に留まる部分のため、注意を引きつける、興味を持たれるような工夫が必要です。ヘッダーに含まれる内容としてはロゴやサイト名、問合せボタンなどが挙げられますが、表示内容は企業や目的によって異なります。

3-2.サイト内検索窓

サイト内検索窓とは、サイト内のコンテンツやページを検索できる機能です。ユーザーが任意のキーワードでサイト内を簡単に検索できるようになるため、コンテンツ量が多い場合に向いています。

3-3.ファビコン

ファビコンとは、ホームページを立ち上げた際にブラウザのタブに表示される画像のことです。ユーザーのなかには、よく閲覧するホームページをブックマークするケースもあるでしょう。ブラウザのブックマークに表示される画像もファビコンです。ブランディング効果が期待できるだけでなく、ブックマークのなかからWebサイトを探しやすくなります。

3-4.グローバルナビ

グローバルナビとは、ホームページの主要なページへ案内するためのメニューのようなものです。グローバルナビを設置することで、ユーザーが目的の下層ページを見つけやすくなるため、ホームページには欠かせないパーツです。

3-5.アイキャッチ

アイキャッチとは、トップイメージとも呼ばれるパーツです。トップページや下層ページで最初に目に入る画像のことで、ユーザーの目に最初に触れます。人の印象は3秒で決まるとも言われており、ホームページの第一印象となるため重要です。ホームページや記事に興味を持ってもらうためにも、アイキャッチ選びは慎重に行いましょう。

3-6.パンくずリスト

パンくずリストとは、現在閲覧しているページを簡易的に表示したリンクリストです。パンくずリストが設置されていることで、ユーザーが今どのページにいるのか、どこのページと繋がっているのかなどを視覚的に理解できるため、ユーザビリティの向上に期待できます。また、SEO対策としても有効です。

3-7.CTAボタン

CTAボタンとは、サイトの目的を達成するためのボタンです。ホームページによって目的は異なり、「予約」や「カート追加」「購入」「問合せ」などのように目的に合わせてテキスト内容が変わります。

3-8.サイドバー

サイドバーとは、その名のとおりホームページのサイドにある縦列（カラム）のことです。サイドバーは固定することができ、スクロールしてもサイドバーを表示したままにできるため、離脱率の軽減が期待できます。ただし、サイドバーを設置するとメインコンテンツの表示幅が狭くなり、情報量が少なくなってしまうデメリットはあります。

3-9.コピーライト

コピーライトとはホームページ上の著作権を指し、コピーライトを表示することで著作権の保有を警告できます。「著作権マーク、所有者の名前、ホームページ開設日」という内容で構成されており、無断転載や無断コピーを防げます。

3-10.バナー

バナーとは、他ページへのリンクを画像にしたもののことです。店頭に設置されるのぼりなどのようなもので、バナーは宣伝などに利用されるケースが多くなっています。バナーをクリックすることで、他ページや他のWebサイトに移動できます。画像を用いて注意を集められるため、テキストリンクよりもユーザーを他ページへ誘導しやすいでしょう。

3-11.SNSシェアボタン

SNSシェアボタンとは、ホームページのリンクをSNSに投稿できるボタンです。ユーザーがSNSシェアボタンをクリックすることで、ユーザーのSNSアカウントからコンテンツが拡散されます。

3-12.RSS

RSSとは、ブログやニュースなどの一覧を表示しているパーツです。新規の記事や更新情報などを配信することができるため、ユーザーにホームページ上の新しい情報を効率的に伝えることができます。

3-13.フッター

フッターとは、ホームページ下部のことです。ヘッダーと同様に、どのページでも基本的に同じ位置に表示されています。フッターに表示する内容は、ホームページによって異なります。コピーライトのみ表示しているホームページもありますが、メインコンテンツの補助的な役割を果たすため、主要なリンクを掲載しているケースが多いでしょう。
 
記載内容の例をあげると、企業情報の紹介やSNSボタン、コピーライトなどが代表的ですが、なかにはサイトマップを掲載するケースもあります。

4.ホームページによく使われる動的なパーツの名称

ここでは、ホームページによく使われている動的なパーツの名称と特徴について解説します。

4-1.スライダー

スライダーとは、ホームページ上で複数の画像を切り替えて表示するための機能です。画像の切換え方にも左右にスライドするタイプやクロスフェードタイプなど種類があるため、ホームページのイメージなどに合わせて設定します。スライダーは複数の画像を切り替えて表示できるため、省スペースで画像コンテンツの紹介が可能です。

4-2.ポップアップウィンドウ

ポップアップウィンドウとは、ホームページの閲覧中に画面に自動的に表示されるウィンドウのことです。セール情報やWebサイトを離れる際のアラートなど、ユーザーに重要なメッセージを伝える際に使います。

4-3.ハンバーガーメニュー

ハンバーガーメニューとは、三本線のグローバルナビの名称です。三本並んだ線がハンバーガーのように見えることからつけられた名称です。クリックすることでメニューが表示されます。スマホやタブレットなどの、表示されるスペースが限られているサイトのグローバルナビとして採用されるケースが多いようです。

4-4.ドロップダウンメニュー

ドロップダウンメニューとは、メニュー項目をクリックすることで直下にサブメニューが表示されるナビです。もっとも一般的なグローバルナビとして知られており、ホームページだけでなくソフトウェアなどにもよく使われています。

4-5.アコーディオン

アコーディオンとは、コンテンツを開閉するブロックのことで、楽器のアコーディオンから連想してつけられた名称です。テキストをクリックすると、コンテンツが閉じたり開いたりします。「+」「-」などのアイコンが表示されるケースが一般的です。情報量の多いコンテンツをすっきりと見せる効果があります。

4-6.タブメニュー

タブメニューとは、タブをクリックすることでコンテンツが切り替わるメニューのことです。タブを選択することで異なるコンテンツを表示できるため、Webページの移動が発生しません。瞬時に表示される情報やコンテンツが切り替わるため、並列情報を表示したい、カテゴリーや分野別に比較が必要な情報の表示などに向いています。

4-7.ページネーション

ページネーションとは、ページ内でコンテンツを分割する機能です。コンテンツの情報が多くなりすぎたページを分割することで、情報を読み取りやすくします。ECサイトの商品一覧やテイストが長いページなどで使われます。

4-8.パララックス

パララックスとは、ホームページに奥行やスピード感などをプラスするために用いる表現手法です。二地点での観測地点の位置の違いによって、対象点の見える方向が異なり遠近感を与えられる、動きのあるサイトを演出できます。おしゃれなページになる、強調したい部分をピンポイントで目立たせられるなどの効果が期待できます。

5. まとめ

ホームページはさまざまなパーツがあり、名称あります。Web制作会社などへホームページ制作を依頼する場合は、パーツの名称を正しく理解しておきましょう。しかし、CMSを使ってホームページを自作する場合は、パーツの名称を正確に覚えていなくても問題ないケースも多いです。
 
BiNDupは、国産CMSで手軽にホームページ制作が可能です。有料コースのみですが専用サポートもあり、カスタマイズ性も高くなっています。ホームページ制作をお考えなら、ぜひお申込みください。