普段私たちが何気なく見ているWEBサイトは、複数のパーツによって構成されています。 「トップページ」や「ヘッダー」という呼び方なら聞いたことある方は多いと思いますが、どんな役割を果たしているか正しく認識していますでしょうか。
WEBサイトの制作をする際や、更新のご依頼を頂く際は、各パーツへのお互いの認識を合わせることはとても重要です。 なぜなら、認識に違いがあれば、ご要望とは異なった内容の成果物が出来かねないからです。
この記事では、各パーツの概要や役割を紹介させていただき、WEBサイト制作や日々の更新業務、またお互いのコミュニケーションをスムーズに進めることにお役に立てれば幸いです。
目次
パソコン特有のパーツ
グローバルナビ
WEBサイトの全体的なナビゲーションを提供するためのメニューバーであり、主要なコンテンツへのリンクがまとめられています。 全ページ内に共通して配置され、スマートフォンの画面だと、この部分が「ハンバーガーメニュー」と呼ばれる3本線のアイコンに置き換わることが多いです。
メインビジュアル
WEBサイトを表示した際、一番最初にユーザーの目に入る主要なビジュアルのことです。「WEBサイトの顔」と言われる部分になり、ここが変わるだけで訪問したユーザーに全く違う印象を与え、WEBサイトに留まることを促すための重要な役割を果たします。 また、メインビジュアルはブランディングにも有効です。例えば、ロゴやスローガンを含めることで、WEBサイトのブランドイメージを訪問者に伝えることができます。
ヘッダー
通常、WEBサイトの上部エリアに設定され、全ページ共通で表示されます。役割として、グローバルナビや検索バーなどが配置されることで、サイトのユーザビリティを向上させたり、ロゴやキャッチコピーが表示されることで、WEBサイトのコンセプトや主旨を伝えたりすることができます。
スマートフォン特有のパーツ
ハンバーガーメニュー
スマートフォンやタブレットなどのモバイルデバイス用のメニューアイコンであり、タップするとメニューコンテンツが展開されます。元々はスマートフォンの画面サイズの制限に対応するために開発されたもので、メニュー項目を省略することで、WEBサイトのナビゲーションをよりスマートに操作できます。
ヘッダー
スマートフォンの場合でも、ほとんどのWEBサイトにヘッダーがあります。ロゴやハンバーガーメニューを置くケースが多いです。
メインビジュアル
スマートフォンの場合、ディスプレイの解像度の関係で、メインビジュアルには表示したいサイズより大きめの画像を使用するのがオススメです。
アイキャッチ
WEBサイトのアイキャッチとは、記事やコンテンツのタイトルの横に表示される目を引く画像や記事のメイン画像のことを指します。アイキャッチは、訪問者にコンテンツの内容を理解しやすくするために使用され、WEBサイトの魅力的な外観を演出することができます。主にブログページで使用されることが多いです。
ページトップボタン
WEBサイトの下部に配置されるボタンであり、訪問したユーザーが長いページをスクロールしているときに、1クリックで簡単にページのトップへ戻ることができる機能です。スクロールして追従して動く場合もあれば、ページの下に固定して配置される場合もあります。 アクセスして欲しいページの導線の確保に繋がります。
フッター
ページの最下部に表示され、WEBサイトの重要な情報やリンク、コンテンツの一覧を表示するために使用されます。サイトマップの役割を果たし、サイト全体の情報を見やすく整理することで、訪れたユーザの信頼を獲得します。 一般的に、WEBサイトのロゴや企業名、連絡先情報、サイトマップ、利用規約、プライバシーポリシー、著作権情報などの情報を表示します。
カテゴリー
WEBページの主要な分類であり、一般的には大きなテーマやトピックに関連するコンテンツをグループ化します。例えば、ニュースサイトの場合、カテゴリーはスポーツ、政治、エンターテインメントなどのテーマ別に分類されます。
大まかなテーマごとにカテゴリーを分類することで、読者はブログが扱っているトピックを把握し、興味のあるコンテンツに簡単にアクセスできるようになります。 カテゴリーは、目次のようなものだと考えると分かりやすいです。
カテゴリーと比べてタグは、より細かく補足的な分類になるので、一つの記事に複数つけられます。
アコーディオンメニュー
アコーディオンメニューとは、コンパクトなスペースにおいても多くの情報を収容するために使用されるメニュースタイルの一つです。ユーザーが必要な情報にアクセスするために、項目をクリックすることに応じて、詳細を表示させることができます。
そのため、特にモバイルデバイスに最適と言われています。クリックすると展開し、再度クリックすると閉じる動作をすることから、楽器のアコーディオンになぞられています。
ファビコン
ファビコンは、ブラウザのタブや、ブックマークのタイトルの左に表示されるアイコンのことを指し、ロゴやデザインの一部を反映したものが使用されることが多いです。WEBサイトの顔と言われており、WEBサイトのブランディングを強化します。また、細部までこだわった安心感がユーザーに伝わり、WEBサイトに対する信頼性が高まります。
ソーシャルボタン
ソーシャルボタンとは、各SNSアカウントとWEBサイトの、主に記事などのコンテンツを連携し共有するためのボタンです。様々な機能のソーシャルボタンがあり、コンテンツを気に入ったことを示す「いいね！ボタン」や、ユーザーのコメントと一緒に自身のSNSで拡散できる「シェアボタン」などあります。 また、WEBサイトのSEO（検索エンジン最適化）にも役立ちます。共有されたコンテンツがソーシャルメディア上で広まり、トラフィックを増やすことができます。
カラム
WEBページ上のコンテンツを整理するために使用される垂直の列のことです。通常、2つから3つのカラムが、WEBページの幅いっぱいに広がるように配置され、コンテンツを均等に分割しています。WEBページを見やすくすることを役割として、ユーザーが必要な情報をすばやく見つけることができるようになります。
1カラムはサイドバーのないメインコンテンツのみの表示形式になります。スマートフォンが主流になり、多用されるデザインになりました。
2カラムはメインコンテンツとサイドメニューが付いた形式で、コンテンツとメニューを分けて表示します。
コピーライト
WEBサイト上のコンテンツやデザインなどの著作権を守るための表示のことです。コピーライト表示には、著作権者の名前や商標、年号などが含まれます。ユーザーにWEBサイトのコンテンツやデザインが著作権保護されていることを知らせ、著作権侵害を防止するために使用されます。
一般的には、WEBサイトのフッターに表示されます。主に©と(c)の2種類ありますが、©で示しているWEBサイトが多いです。
まとめ
今回は基本的なWEBサイトのパーツを紹介させて頂きました。
各パーツの名前や役割を理解していると、サイト制作時にご要望を伝えやすくなりますし、WEBサイトの更新作業もスムーズになるかと思います。
弊社では既存サイトの更新を承るサービスも展開しております。更新業務でお困りの際は、是非お問い合わせ下さい。