まずホームページの基本的な考え方は以下の二つです。

①ホームページ全体の構成
②ページごとの構成

全体の構成を決めてから、各ページごとにどのような情報を入れるのか、デザインにするのかなどを決めていきます。

次にホームページは「トップページ」と「下層ページ」に分けられ、多くのユーザーがまず最初に目にし、この会社や個人のことをもっと知ってみたいと思わせることが重要になるトップページ。

そこからより詳しく会社を知るための要素を詳しく書いた下層ページで分けられています。

サイトマップの作り方

細かくホームページの内容を決めていくためにまずは「ホームページの構成図（サイトマップ）」を作成していきます。

まず最初にクライアントの要望をしっかりヒアリングし、そこからホームページにはどのような情報が必要か、目的は何かなどを具体的に決めていきます。

次に情報をカテゴリーごとに分けていきます。

例えば動物病院では「病院情報」「スタッフはどのような人がいるのか」「院長はどのような人か」「何の診療をしてくれるのか」「料金はいくらくらいなのか」「予約はどうすればいいのか」「診療時間はいつか」「どのように病院まで行ったらいいのか」などたくさんの情報がある中で

どれとどれの情報を組み合わせれば見やすいページになるかをまとめます。

このまとめた情報から各ページを決めていきます。

このサイトにはどんなページがあって、どうつながっているか？を視覚で分かりやすくまとめたものをサイトマップ（Sitemap）と言います。

ホームページの構成

次にホームページの構成を見ていきます。

ホームページは主に「ファーストビュー」「メインコンテンツ」「クロージング・CTA」の三つの要素で構成されています。

「ファーストビュー」にはヘッダー・メインビジュアル・企業のキャッチコピーなどがあります。

「メインコンテンツ」には各コンテンツの見出し文章、写真などが入ります。

「クロージング・CTA」にはフッターやお問合せへの誘導などが入ります。

ここからさらに詳しく分けていきます。

ファーストビュー

ファーストビューとは、ユーザーがページを開いたときに一番最初に目に入る場所です。スクロールせずに見えるエリアで、ここが「企業のイメージ」や「先の内容も見てみたい」と思わせる重要なところです。

ヘッダー

ヘッダーにはロゴ、メニュー、問い合わせボタンなど、サイト全体で共通して使われるものが配置されます。

• 直感的に操作できること
• 情報量を詰め込みすぎないこと
• ブランドの印象を崩さないデザインにすること

がポイントです。

メインビジュアル

メインビジュアルは企業のイメージを決める重要な要素です。大きな写真や動画、イラストなどが使われ、強い印象を与えます。

• 何を提供しているサイトなのか
• 誰に向けたサービスなのか

が視覚的に伝わることがポイントです。

メインコンテンツ

メインコンテンツは、ユーザーが求める情報を提供する場所です。ここに「価値のある企業の情報」を載せることで、さらにユーザーに企業の事業内容を理解してもらえる場です。

見出し

コンテンツの内容を分かりやすく示す重要な役割をです。SEO対策としても効果があり、

• H1はページ全体のテーマ
• H2・H3は内容ごとに整理

といった階層（文字のサイズ）を意識するとさらに読みやすくなります。

写真・イラスト

文章だけでは伝わりにくいポイントを補足したり、イメージを具体に想像できるようにしたりするために使われます。

• 内容にあった写真
• 図解・チャート
• Before/Afterのある症例などの写真

などを入れると理解が深まります。

本文

最も情報量の多い部分です。ユーザーが知りたい疑問に答える内容を中心に、価値のある情報を読みやすくまとめます。

• イラストや写真だけでは伝わらない内容
• 適度な改行と余白
• 専門用語の補足

などを書くことでさらに企業の理解が向上します。

クロージング・CTA

ホームページを最後まで見たユーザーに、「次の行動」を促す部分です。お問合せを重視している企業などはこの部分が抜けてしまうと、せっかく興味を持ったユーザーも離脱してしまう可能性があります。

お問い合わせの誘導（CTA）

CTA（Call To Action）は、ユーザーにアクションを起こしてもらうための導線です。

• お問い合わせフォーム
• 資料請求
• 無料相談
• 商品購入ボタン

ユーザーが迷わず行動できるように、シンプルで目立つデザインが最適です。

フッター

ページ最下部にある情報で、サイト全体の補足情報をまとめる役割があります。

• 会社情報
• 利用規約・プライバシーポリシー
• SNSリンク
• サイトマップ

ユーザーがページから離れる前に「もう一度確認したい情報」にアクセスしやすいよう、整理しておくと企業の信頼性が高まります。

また、上記で説明した「ヘッダー」と「フッター」は基本的に各ページ共通のデザインになります。

デザイン以外にホームページ制作に必要なもの

サーバー

Webサイトのデータ（文章・画像・プログラムなど）を保管し、ユーザーがアクセスしたときにその情報を送り返す「保管庫兼配信装置」です。サイトを“置く場所”を決める必要があります。

ドメイン

Webサイトの住所となるものです。

例：example.com

ユーザーがサイトにアクセスするための「わかりやすい住所」を設定する必要があります。

SEO（検索エンジン最適化）

検索エンジン（Googleなど）で上位に表示されやすくするための取り組み。コンテンツ内容の質を密にしたり、サイトの構成を整えたりすることでアクセスの増加を狙うものです。

WEBサイト制作の手順

Webサイト制作がどのような流れで進んでいくのか、初めてだとイメージしにくい方も多いと思います。

大まかな流れは下記の６つです。

1. 営業・お問合せ
2. ヒアリングと打ち合わせ
3. 構成案と見積作成
4. 受注
5. 制作
6. 納品

上記の流れを意識して全体の制作を進めることをお勧めします。

まとめ

以上ホームページを構成する要素についてご紹介しましたがいかがでしたでしょうか？

今回ご紹介した流れや基本知識が、これからサイトづくりを考えている方のお役に立てればと思います。

Anilaboでもお問合せから納品までWebサイト制作を承っております。

初めてWebサイト制作を依頼される方でも、しっかりと説明しながら進行いたしますので、不明点や不安な点があればいつでもお声がけください。

お客様の目的に合った最適なサイトを、一緒に形にしていければ幸いです。

最後まで読んでくださりありがとうございました。