わかりにくい横文字が飛び交うWeb業界の専門用語をそっとお教えするWeb用語シリーズ。

今回は、Web制作用語（ページ構成編）です。
Webページを構成する様々な要素には、独特の名前がついていたりするんですよね...

これを読めば、Webデザイナーの説明を「何言ってんだコイツ・・・」と思いながら聞かなくて済むようになるかもしれません。

一般的なWebページの構成

まずは下の画像をご覧ください。

もちろん例外は多々ありますが、一般的なWebページは、このような構成になっているますよね？
図中、ピンクで囲ってある部分が今回説明させていただく要素です。
まずは位置を確認し、だいたいのイメージをつかんでください。
これ以外に、「パララックス」「カルーセル」「マージン」といったクセのある言葉も紹介します。

ヘッダー

ヘッダー（Header）は、ページのヘッド、つまり一番上の位置にあるエリアです。
多くの場合、サイト内の全ページに共通で配置されます。
ヘッダーには、主にロゴやサイト内検索、文字サイズの切り替えボタンなど、ユーザーに常に意識してほしい要素を置きます。
後述するグローバルナビゲーションやパンくずも、ヘッダーに含まれます。

フッター

フッター（Footer）は、ページのフット、つまり一番下の位置にあるエリアです。
ヘッダー同様、多くの場合、サイト内の全ページに共通で配置されます。
フッターには、会社住所やプライバシーポリシー等のサブリンク、copyright表記など、補足的な情報を入れます。
ユーザーの利便性向上に配慮し、サイト全ページのリンク（サイトマップ）を配置するケースも多くみられます。

パンくず

パンくず、またはパンくずリストは、例えば「トップページ ＞ 会社案内 ＞ 沿革」のように、現在のページがサイトの階層のどこに位置するのかを示すものです。
ユーザーが迷子にならないように配慮されているのと同時に、検索エンジンにもサイト構造を伝える、重要な要素です。
「来た道がわかるようにパンくずを少しずつ落としながら歩く」という昔話のエピソードから、この名称が名づけられたそうで、Web用語の中でも最も詩的な言葉のひとつです。

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

グローバルナビゲーションは、Webサイトの主要なコンテンツへのリンクをまとめたメニューのことです。
Webサイト全体に共通して表示される必要があるため、多くの場合ヘッダーに含まれ、ユーザーがいつでもアクセスできるような配置になります。
グローバルナビゲーションは、そのままWebサイトのアウトラインにもなるため、ユーザーは経験的にここを見て、Webサイトの概要を判断できます。

ローカルナビゲーション

ローカルナビゲーションは、グローバルナビゲーションの下位概念です。
グローバルナビゲーションによって区分された各コンテンツ内を行き来するためのリンクがまとめられたメニューです。
具体的には、例えば「会社案内」という大分類の中の「ごあいさつ／概要／沿革／アクセス」などの中分類の部分ですね。

パララックス

急速に普及した、縦長のスクロールメインのWebページによく使われる表現手法で、日本語では「視差効果」といいます。
画面に奥行きをもたせ、擬似的にいくつかの層をつくります。
これらの層を、スクロールに応じて別々に動かすことで、視覚的におもしろい効果を生みます。

カルーセル

一定のスペースに画像などを配置し、時間単位やユーザーのアクションによってスライドさせる表現手法です。
キービジュアル部分などでよく使われます。
動きがついてダイナミックな表現になり、限られたスペースに多くの情報を載せられるという利点があります。
反面、表に出ているコンテンツ以外は、言わば「スライドの順番待ち」ということになり、ユーザーに認識されづらいという側面もあります。

マージン

マージンとは配置された要素間の余白のことです。
Webページをレイアウトするときには、CSSという言語で、このマージンなどを細かく設定していきます。

まとめ

以上、Webページを構成する様々な用語を解説いたしました。
とにかくカタカナばかりで苦手な方も多いとは思いますが、慣れれば身につくはずですので、仕事で使う方はぜひチャレンジしてみてください。