記事の詳細

ホームページの基本構成を確認しましょう。制作を進めていく上で、どのような形で作られているかをおさえておくことは大切です。

お料理をするときど同じで、基本的な作り方を知っておくことは本当に重要です。またそれはHTMLの構成にも反映します。HTMLはプログラムですから、そこにはルールが存在します。きちんとしたルールの上でホームページを構成します。

ページの構成

ホームページは単一の1ページのみ、もしくは複数ページで構成されています。ホームページの基本的なページの構成をチェックしてみましょう。

トップページ

必ず存在をするのがトップページになります。このトップページを中心に各ページが配置をされます。

またこのトップページはホームページのメインキーワードで検索されやすいようにするとよいでしょう。

このトップを三角形の頂点にして、各ページが配下に置かれます。トップページ直下にはコンテンツをまとめたカテゴリが配置され、その下にコンテンツ記事ページが配置されます。

商品を紹介する場合など、このトップ一枚で構成されるセールスページ的な作り方もあります。先頭から順に読んでいき、最後に商品やサービスのオファーや資料請求というような作る方です。この作り方だと、他へ飛ぶリンクが存在をしないので、アクセスした方を迷わす心配がありません。

下まで読み進めれば、このページの使命を果たせます。ページから離脱をしないようにするには非常に有効な反面、たくさんの情報量は複数の情報、商品を配置することは難しいでしょう。

通常のHTMLで作る場合、ファイル名は「index.html」となる場合が多いです。

カテゴリページ

トップの下に配置され、コンテンツや記事ページをまとめるためのフォルダと思っていただければいいでしょう。各記事というのはその内容によって適切なカテゴリ下に配置される形は望ましいでしょう。

またそのカテゴリは、配置されている記事のリストや解説、そのカテゴリの解説などが表示されるとわかりやすくなります。

記事ページ

ホームページのコンテンツ記事となります。

ホームページの構成を考える

ホームページを制作する場合、最初にトップやタイトルを考えます。そして、その下に設置されるカテゴリをリストします。カテゴリに適した記事を揃えていくという構成になります。

その形はトップを頂点として、裾広がりのような構成になると思っていいでしょう。

ホームページをアクセスする人にとって、記事ページがあまり深い階層にあるとわかりにくくなります。

できるだけ階層は深くしないほうが良いでしょう。トップの下にカテゴリを配置して、その下にサブカテ、またその下にサブカテという深い階層を構成することは管理者自身も迷子になりそうです。

わかりやすくシンプルに浅めの階層で、まずは全体を構成するようにしていきましょう。

「トップページ」-「カテゴリページ」-「記事コンテンツページ」という2階層程度で組んでいくことをまずは考えると良いと思います。

なぜ構成を考えるか

はじめに構成を考えるのはホームページを作る上で非常に大切です。なぜなら検索エンジンやユーザーのことを考える場合非常に重要だからです。

「トップページ」-「カテゴリページ」-「記事コンテンツページ」という構成を組んでいる場合を考えてみましょう。

記事ページはカテゴリの下に配置をされています。たとえば、あなたの見ているこのページを考えてみましょう。

URLの変更

今見ているこのページのカテゴリを変更をしたとします。そうなると、そのURLで登録をしているブックマークでアクセスができなくなります。

また、そのURLで検索エンジンが評価している場合、URLを変更した時点で反映されなくなります。それはそのページのアクセスがなくなってしまう可能性が高くなります。

このようにホームページを作り上げていく上で、最初に構成を考えることはとても大切なこととなります。

ブログの出現で構成を考慮に入れなくなった

あなたも書いているかもしれないブログ。そのブログの出現で上記のような構成を先に考える必要が非常に少なくなりました。

最近はブログのみでホームページを作り上げる方も多くなりました。その場合の流れは先に記事を書き、書きためた記事を整理するためカテゴリを後から作るという流れになっています。

なぜこのような流れが可能になったかというと、その理由はブログの出力するURLにあります。通常ブログの記事は「月別アーカイブ」という年月日の数字がついがフォルダの下に位置をします。

そのため、カテゴリを後から追加して記事をカテゴリに属させても、そのカテゴリ下には移動をしません。カテゴリはあくまで記事を整理するためのフォルダという考え方でしかありません。

ブログの作り方は、はじめに記事ありき。カテゴリなどはその後に続くという逆の流れで構成をされていきます。全体構成をあまり考える必要がないので、すぐに着手することができ、また公開に関しても早くできます。

ただ、全体構成が最初にないため、ホームページの趣旨と外れる可能性もあります。その辺りも注意して進めるとよいでしょう。

ブログのメリットをいかすことにより、早くスタートでき、形になるのも早い。またカテゴリを追加しても記事のURLが変わることが無いため検索エンジンに有利に作用することが多いです。ぜひこのメリットは取り入れるとよいでしょう。

ちなみに当サイトもブログソフトである「Movabletype」を使用して構築されています。

各ページの構成

ページの構成を確認してみましょう。

ヘッダー部

ページの一番上、アクセスをしてブラウザに一番最初に表示される部分です。基本的にヘッダー部は全ページ共通の内容になることが多いです。

そのため、そのホームページのロゴやタイトルはもちろん、色合いなども同じようにするべきでしょう。

HTML的にもタイトルやキーワード、そして記事の書き出しなど非常に重要な役目を果たします。

企業サイトやネットショップであれば、店名や企業名、住所や電話番号、問い合わせ先、営業時間なども表示する必要があるでしょう。

ロゴ

基本的にホームページの左隅一番上部に表示をします。ヘッダー内の一番いい場所、アクセスをしてすぐに目につく場所にロゴは来るべきです。

もちろんすべてのページに表示、統一をするようにします。

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

メニュー、メインナビゲーションとなるヘッダーやロゴ下に配置をするナビゲーションです。

どのページにいても、たとえばトップページ、たとえば問い合わせなど、すぐにアクセスできるようにするナビゲーション(リンク)となります。

項目はあまり多くすることはやめましょう。個数的には7つ程度を上限にするとよいでしょう。

メインバナー

当サイトではトップページのみにメインバナーとして大きな画像を表示しています。大きいので、トップのみにする、もしくは高さを低くする方法もよいでしょう。

トップページは、このホームページはどのようなホームページかを画像で表示することにより、訪問者に理解させることが目的です。画像を用いることにより、すぐに理解ができることがメリットです。

フラッシュなど用いる場合もありますが、読み込みに時間がかかったり、環境により表示されない場合もありますので、使用する場合は気をつけましょう。

新着情報

ホームページに新しい記事が追加された場合など、タイトルやリンクを表示します。これは訪問者に対しての案内という目的もありますが、検索エンジン的にも非常に重要です。

新しい有用なページの追加は検索エンジン的に非常にいいことです。またどのページが新しく追加されたのかがわかるよう、また検索のロボットがすぐに辿れるようトップに新着のリンクを置くことは大切です。

新しいページが加わりトップページが更新されると、トップの内容が変わり、タイムスタンプも更新されます。更新が頻繁に行われるホームページは検索のロボットもひんぱんに訪れるでしょう。

サイドメニュー

ホームページのどこにいても、目的のページヘ移動できるようサイドメニューは有効です。ページ数が多いサイトほどこのサイドメニューは必要になる場合が多いです。

ただ、あまりに多いメニューだと、一体どこにいるのか、またメニューの多さより一体どこから見ればいいのか迷う場合もあります。

しかし、ホームページにはとても必要なナビゲーションとなります。

パンくずリスト

各ページのタイトル下などに表示される、そのページの位置です。どのカテゴリの配下なのかをリンクとともに表示することにより、迷子になることを防ぎます。

トップからの階層を表示することにより、戻るべき場所や次に見るべきところがわかりやすくなります。

フッター

各ページ最下部に配置されている部分です。ヘッダー同様全ページ共通のデザインとなります。

コピーライト表記や運営年月、トップページへの戻りリンクや問い合わせなどの表示が必要です。

またページの一番上まで戻るリンクや、ページを最後まで読んだ後に行ってほしいこと(資料請求など)を配置する場合もあります。

関連記事

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

ページ上部へ戻る