ホームページの構成の決め方。初めてなら「5ページ」から始める

先に結論：初めて作る会社・お店のホームページは、「トップ」「サービス・料金」「会社案内（店舗案内）」「よくある質問」「お問い合わせ」の5ページ構成から始めるのが決めやすい形です。足りないページは公開してから足せます。最初に全部を決めようとしないことが、いちばんの近道です。

この記事で分かること

• 迷わない基本の5ページ構成と、各ページに書くこと
• 業種別に「足すと効くページ」
• サイトマップ・ワイヤーフレームなど、打ち合わせで出てくる用語の意味

迷ったら「5ページ構成」から始める

ホームページの構成を調べると、サイトマップの書き方やワイヤーフレームの作り方など、制作する側の手順が多く出てきます。ただ、これから初めて作る立場で本当に決めたいことは、もっと手前にあります。「うちのサイトは、何ページ用意して、それぞれに何を書くのか」です。

その答えとして、まず基準にしやすいのが5ページ構成です。クリートークに掲載しているWeb制作会社のうち、ページ数を明示したプランを公開しているのは83社で、そのうち59社が「5ページ」を区切りにしたプランを出しています（2026年7月時点の掲載データ集計）。少なくともクリートークの掲載プランを見る限り、「最初の1本」の目安として広く使われているページ数です。

5ページの内訳は次の形です。

• トップ：どこの、何のお店・会社で、誰に向けたサービスか
• サービス・料金：提供しているものと、費用のめやす
• 会社案内（店舗案内）：場所、営業時間、人、写真
• よくある質問：問い合わせる前に気になること
• お問い合わせ：フォームと電話番号

各ページに書くことを決める

ページ名だけ決めても、中身が白紙だと先に進みません。各ページで「これだけは書く」というものを挙げます。

トップ

開いて数秒で「どこの、何屋さんか」が伝わることが最優先です。屋号・地域・業種を含んだひとことと、連絡先への導線があれば成立します。たとえば「豊中市の税理士事務所です。個人事業とひとり社長の会社が専門です」のように、地域と相手まで入ると、開いた人が自分ごとにできます。キャッチコピーに時間をかけて止まってしまうくらいなら、まず事実を書いて公開する方が先です。

サービス・料金

メニューや料金は、見る人がいちばん知りたい情報です。すべての金額を出せない事情がある場合も、「初回相談は無料」「カット4,400円から」「1件ごとに個別見積」のような、めやすになる一行があるだけで問い合わせのしやすさが変わります。

会社案内・店舗案内

住所、地図、営業時間、代表やスタッフの名前と顔写真。とくに店舗や士業のように「人」で選ばれる業種では、顔の見えるページが安心材料になります。

よくある質問

電話でよく聞かれることを、そのまま3〜5個書き出せば最初は十分です。「駐車場はありますか」「予約は必要ですか」のような素朴な質問ほど役に立ちます。

お問い合わせ

フォームと電話番号の両方を載せます。フォームだけにすると急ぎの人を逃し、電話だけにすると営業時間外の人を逃します。

トップページの中身は「上から4つ」の順で置く

ページの一覧が決まったら、次に迷うのが「トップページの中に、何をどの順で並べるか」です。これも凝った設計は要りません。上から次の順に置くのが、初めてでも破綻しない並びです。

• 1. 最初の画面（ファーストビュー）：屋号、地域、何のお店・会社かのひとこと、電話かご予約ボタン。開いた瞬間に見える範囲にこの4つが収まっていれば十分です
• 2. サービスの概要：提供しているものを2〜4個、写真つきで。詳しくは各ページに任せ、ここは入り口だけにします
• 3. 選ばれる理由・実績：他ではなくここに頼む理由を1〜3個。実績写真やお客様の声があれば、この位置に置きます
• 4. 案内と問い合わせ：地図、営業時間、そして問い合わせへのボタンで締めます

「ファーストビュー」は打ち合わせにもよく出る言葉で、意味は「スクロールせずに最初に見える範囲」です。ここで何屋か伝わらないと、その先は読まれません。逆に、この4ブロックの順番さえ守れば、写真や文章があとから変わっても骨組みは崩れません。

業種別に「足すと効く」ページ

5ページで公開したあと、業種によって足すと効果が出やすいページがあります。

• 飲食店：メニューの写真ページ、ネット予約への導線
• 美容室・サロン：スタッフ紹介、施術メニューごとの料金
• 士業（税理士・行政書士など）：料金表、解決事例
• 工務店・リフォーム：施工事例の写真ギャラリー
• 教室・スクール：体験申し込みの案内、コース別の紹介

共通しているのは、「依頼する前に確かめたいこと」を先回りして見せるページだという点です。最初から全部そろえる必要はなく、公開後の反応を見ながら1ページずつ足していけます。

打ち合わせで出てくる用語を、日常の言葉にすると

制作会社に相談すると、構成まわりの専門用語がいくつか出てきます。意味が分かれば身構える必要のない言葉です。

• サイトマップ：ページの一覧表のこと。「どんなページを作るかのリスト」と言い換えられます
• ワイヤーフレーム：ページの下書きのこと。文字と枠だけで作る設計図で、デザインの前段階です
• 階層：ページの親子関係のこと。「サービス」の下に「料金」がぶら下がる、といった整理を指します
• 導線：見た人に進んでほしい道筋のこと。「問い合わせへの導線」なら、問い合わせページへ誘導するリンクやボタンを指します

打ち合わせで意味の分からない言葉が出たときは、その場で聞いて問題ありません。説明を省く会社より、かみくだいて話してくれる会社の方が、公開後のやりとりも進めやすい傾向があります。

構成づくりでやりがちな3つの失敗

最初から作り込みすぎる

10ページ、20ページの構成を最初に決めようとすると、原稿が集まらずに公開が数か月延びることがよくあります。5ページで公開して、あとから足す方が早く、費用も読みやすくなります。

階層を深くしすぎる

「サービス＞法人向け＞コンサルティング＞料金」のように階層が深いと、見る人がたどり着けません。小規模なサイトでは、どのページへもトップから1回のクリックで行ける形が扱いやすい構成です。

自分で更新できない構成にする

お知らせやメニューなど、頻繁に変わる情報を「更新のたびに制作会社へ依頼」にすると、費用と手間で更新が止まりがちです。自分で更新したい箇所がどこかを、構成を決める段階で伝えておくと、その前提で作ってもらえます。

決めきれないときは

ここまでの型に当てはめても、「うちの場合はどのページが要るのか」で手が止まることはあります。業種や今ある材料（写真・原稿・料金表）によって、最初に作るべき形は変わるためです。

クリートークのチャットでは、業種と目的を伝えると、構成の整理から相談できます。予算や依頼先が決まっていない段階でもかまいません。相談は無料で、そのまま帰っても大丈夫です。制作会社を探す段階になったら、掲載346社の一覧から地域や業種で絞ることもできます。