サイトやブログのパーツ名や設置する目的まとめ【初心者向け】

こんにちは、きゃぷてんです。

ブログの運営を始めると、テンプレートをそのまま使っているだけでは物足りなくなって色々とカスタマイズしたくなるものですよね。

自分のブログやサイトの足りない部分を改善しようとする向上心はとても素晴らしいことなのですが、いざカスタマイズを始めようとした時にこんなことを思うはずです。

• あの部分の名前って何だろう？
• なんであのパーツが必要なんだろう？

名前がわからないと調べることもできませんからね。ですので、 今回はサイトやブログのパーツ名や設置する目的をまとめてご紹介します。

カラム

まずはじめに覚えておきたいのが、パーツ名云々ではなく、レイアウトそのものですね。

レイアウトのことをwebデザインでは「 カラム（colmun） 」と呼びます。ちなみにカラム（colmun）には「柱」と言う意味があります。

あなたが普段見ているwebサイトの多くが、上記のどちらかになっていると思いますが、この他にもサイドバーが無い「１カラム」や、「２カラムでサイドバーが左側にあるもの」があります。

各カラムにはそれぞれ目的があり、１カラムや２カラム（サイドバー右）の場合は、本文に集中してもらいたい場合（販売ページやブログ記事）に用いることが多いです。

２カラム（サイドバー左）であれば、業務系システムであったり、比較サイトのように、カテゴリが重要なもので用いられることが多いです。

３カラムについてですが、一度にたくさんの情報を表示できることから訪問者の回遊を狙って２０１０年代前半まではブログのレイアウトとして主流でしたが、最近ではユーザビリティの視点から（より見やすく、より分かりやすく）、２カラム（サイドバー右）が人気ですね。

なぜカラムによって目的が異なるかですが、それは訪問者の目線の動きを研究した「Fの法則（目線が画面をFの字のように動く）」や「Zの法則（目線が画面をZの字のように動く）」を学ぶと、より深く理解することができます。

ちなみに僕のサイトでは、２カラム（サイドバー右）を採用することが多いです。

各パーツの名称

さてさて、カラムについて理解することができましたので、本題の各パーツ名について説明していきますね。

ヘッダー

ヘッダーは、サイトに訪れた人が一番最初に目にする部分になりますので「 サイトの顔 」と言うことができますね。

あなたのサイトの第一印象を決める部分になりますので、このサイトはどのようなサイトなのかを意識して、分かりやすく、見栄えが良いものになるよう工夫することが重要になります。

訪問者はサイトを開いて２秒以内に離脱するか判断すると言われているように、ヘッダー部分に力を入れていないと、せっかく訪れた訪問者は逃してしまいますので非常にもったいないです。

また、クリックするとトップページに移動できるようにしておくと、ユーザビリティが向上してあなたのサイトを回遊してもらいやすくなります。

グローバルメニュー

グローバルメニューとは「 どのページにも表示されているメニュー 」のことですね。

通常はカテゴリーをグローバルメニューに設置しますが、訪問者に見せたいページ（キーラーコンテンツ）を忍ばせておくと、スムーズに訪問者を誘導することができます。

パンくずリスト

パンくずリストは、 現在自分が見ているページを階層で表示しています。

webサイトは一般的に「トップページ」の下に「カテゴリー」があり、その下に「記事ページ」といったように階層構造になっていますので、記事ページだけに目を当てると自分が今どこの階層に居るのかわからなくなりやすいです。

＜トップページ＞→＜カテゴリ＞→＜記事ページ＞

そんな時に、自分の居場所を分かりやすく教えてくれるのがパンくずリストになります。

ちなみに「パンくず」と言う名前の由来ですが、童話ヘンゼルとグレーテルで「主人公達が森で道に迷わないようにパンくずを置いていった」と言うエピソードが由来となっています。

アイキャッチ・サムネイル

アイキャッチとは、記事ページを開いた時に一番最初に表示される画像のことで、サムネイルはアイキャッチを小さくしたものと覚えて置いてください。

どちらも目的は、 訪問者の目を引くこと（Eye-catch） ですので、記事の内容を連想できるような画像が良いですね。

コンテンツによっては、派手な画像を使ってとにかく目立たせるという場合もありますが、訪問者からすると鬱陶しいので僕は好きではありません。

ページャー

ページャーはその名の通り「 ページ数を表しているもの 」です。

これがないと訪問者が過去記事を読むのが大変ですね。

フッター

フッターは「 ブログの一番下の部分 」のことです。

訪問者が最後に確認する部分ですので、本の索引のようにカテゴリを記載するのが一般的ですね。また、最新情報などを記載しておくと訪問者の離脱を防ぐ効果があります。

最後に

簡単ではありますが、以上がwebページのパーツ名と目的の説明でした。

各パーツの目的を理解すれば「どこに何を設置すべきなのか」が分かってきますし、 あなたのサイトの改善点が見えてくるはずです。

あなたのサイトをより良いものにするためにも、まずは各パーツの名前から覚えて、目的を理解していきましょうね。