構成図の作成は、ホームページを作るときに重要な第一歩です。
手書きでも良いですし、エクセルなどのオフィスソフトを使うのも良いです。ご自分のやりやすい方を選んで下さい。
1 掲載したいコンテンツを書き出し、ジャンル分けする
そのサイトに掲載したいコンテンツを出し、ジャンルごとに分けていきます。
ジャンルには適切な名前を付け、見る人が下層のコンテンツを探しやすいよう留意しましょう。
場合によってはジャンルを細分化する必要が出てくるとは思いますが、階層が深くなりすぎると
利用者がコンテンツを探し出すのが難しくなってしまいます。
2 ページの優劣を決める。
どのページが最も重要なのかを考えてみて下さい。
「提供したい内容」「利用者が求めていると考えられる内容」
逆に、「あまり見られないであろう内容」
この優劣を決めることで、サイトのメニューの順位やデザインを考える際に役立ちます。
ホームページの構図は、大きく分けて【サイドメニューがある】か【ない】かの2種類です。
サイトの目的によって適した構図を選びましょう。
1 1つのページをじっくり見て欲しい → <サイドメニュー無し>
例)利用者の目的がはっきりしている・興味のある人にじっくり読んで欲しい
2 都度、利用者が求める情報を見て欲しい → <サイドメニューあり>
例)利用者の見たいものが複数ある・別々の内容を比較して欲しい
→もっと細かなレイアウトの説明はこちらから
https://honmaru.red/dt/layout/
特殊な構成でない限り、ホームページに掲載する要素は概ね決まっています。
以下に代表的な物を挙げていきます。
<全てのページに掲載>
・ロゴ/サイト名
→サイトの上部に掲載します。左に寄せるのが一般的です。
・各ページへのリンクメニュー(ヘッダーメニュー/サイドメニュー)
→ロゴ/サイト名の下(ヘッダーメニュー)やサイドエリア(サイドメニュー)に掲載します。
ヘッダーメニューにはそのサイトの主だったコンテンツへのリンクを付けましょう。
ヘッダーメニューがある場合のサイドメニューは、第2階層以下のページへのリンクや
外部サイトや「キャンペーン」等の一時的に目立たせたいページへのリンクを掲載します。
・ホームページ運営者の連絡先
→利用者が問い合わせやすいよう、全てのページに掲載するのが好ましいです。
一般的にはページの最上部右上(ヘッダー)と最下部(フッター)に載せます。
連絡先の情報を別ページに持たせ、リンクのみを掲載するケースも多いです。
<トップページ>
・メインビジュアル
→ホームページのアイキャッチとなる部分です。
代表的なサービスや商品のビジュアルを載せると、何のサイトか印象づけられます。
・主なコンテンツのアピールエリア
→主だったコンテンツ、よりアピールしたいコンテンツを、
簡潔な文章とビジュアルなどを使って表現します。
コンテンツの詳細を載せたページがあれば、そこへのリンクも忘れずに。
・新商品、キャンペーン、イベント等のバナー
→一時的にアピールしたい事をビジュアルバナーにして掲載します。
そのサイトの「売り」がひと目で分かる他、
常時バナーを入れ替えることでホームページに新鮮味を持たせられます。
・ニュース一覧
→上と同じくホームページに新鮮味を持たせ、最新情報を見てもらいやすくなります。
ここを常々更新することで、リピーターに定着してもらう事も期待できます。
<サイトマップ>
サイトの全ページへのリンクを一覧にした物をサイトマップと呼びます。
このページがあると、メニューに掲載しきれなかった全コンテンツを見ることが出来、
利用者がサイト検索をする際に役立ちます。
<コンテンツページ>
オリジナルのコンテンツを分かりやすくまとめて掲載しましょう!
→もっと細かなサイト構成はこちら
https://honmaru.red/dt/page-configuration/
そのページに何を入れるのか、何を目立たせるのか、使用者に【分かりやすい】ホームページを意識して、要素を構成していきましょう。