Webサイトの各部分：注釈付き実例（Webサイトの全体像）
We.Incで作成したラベル付きの実例を使って、Webサイトの各部分を解説。ヘッダー、ナビゲーション、メインビジュアル、行動喚起、サービス、実績、会社概要、問い合わせフォーム、フッターと、ドメイン、タイトル、サイトマップなどの裏側の要素を紹介します。
多くの小規模事業のWebサイトは、上から順に同じ8つの部分で構成されます。ヘッダーとナビゲーション、メインビジュアル、行動喚起、サービス、実績、会社概要、問い合わせ、フッターです。訪問者には見えない裏側には、ドメイン、ページタイトル、サイトマップなどがあります。以下では、We.Incで作成したデザイン例にそれぞれの部分を示します。
目に見える部分：上から順に
- ヘッダー。ロゴや事業名を載せるページ最上部の帯です。すべてのページに表示し、訪問者が今どこにいるか分かるようにします。
- ナビゲーション（メニュー）。サービス、会社概要、料金、問い合わせなど、主要なページやセクションへのリンクです。項目数は5〜7個に抑えます。スマートフォンではメニューボタンの中に折りたたまれます。
- メインビジュアル。最初に表示される画面です。何を誰に提供するかを伝える見出し、短い補足文、多くの場合は画像を含みます。訪問者は数秒で滞在するかを決めます。メインビジュアルの例をご覧ください。
- 行動喚起（CTA）。「電話を予約」「見積もりを依頼」など、主なボタンです。メインビジュアルに置き、ページ下部でも繰り返します。
- サービスまたは機能。提供内容を項目ごとに短く説明し、顧客が得られる成果を一言添えます。
- 実績・信頼の根拠。レビュー、仕事の例、資格、保証などを掲載します。実在するものだけを使いましょう。
- 会社概要。事業を運営する人と、信頼できる理由を紹介します。会社概要ページの書き方をご覧ください。
- 問い合わせ。フォーム、電話番号、メールアドレス、所在地または対応地域を載せます。問い合わせフォームの追加方法もご覧ください。
- フッター。ページ最下部の帯です。連絡先、補助リンク、プライバシーポリシー、SNSリンクをもう一度掲載します。
訪問者に見えない部分
| 要素 | 役割 |
|---|---|
| ドメイン | yourbusiness.comのようなWebサイトのアドレス |
| ホスティング | 訪問者にサイトを配信するコンピューター |
| ページタイトルと説明 | Googleの検索結果やブラウザーのタブに表示される情報 |
| サイトマップ | 検索エンジンがページを見つけるためのページ一覧 |
| ファビコン | ブラウザーのタブに表示される小さなアイコン |
| 共有画像 | SNSでリンクを共有した際に表示される画像 |
同じ要素でもページ構成は異なる
1ページのWebサイトは、これらの要素を縦長の1ページに並べ、メニューから各セクションへ移動します。複数ページのサイトでは、サービス、会社概要、問い合わせをそれぞれ独立したページにしつつ、同じヘッダーとフッターを使います。Webアプリでは、さらにログインやデータ保存の機能が加わります。
We.Incで必要な要素をそろえる
We.Incのテンプレートには、ヘッダー、ナビゲーション、メインビジュアル、CTA、フッターがあらかじめ含まれています。公開したサイトにはタイトル、サイトマップ、共有画像も設定されます。Freeプランではwe.incのアドレスでテンプレートサイトを最大3つ公開できます（AIクレジットと独自ドメインは含まれません）。月額$20からの有料プランでは、AIによる作成と独自ドメインを利用できます。テンプレートをご覧ください。
よくある質問
Webサイトの主な部分は何ですか？
ヘッダー、ナビゲーション、メインビジュアル、行動喚起、サービス、実績、会社概要、問い合わせ、フッターです。ほかにドメイン、ホスティング、ページタイトル、サイトマップなど訪問者に見えない要素もあります。
Webサイトのメインビジュアルとは何ですか？
訪問者が最初に見る画面です。見出し、短い補足文、多くの場合は画像、そして主な行動喚起ボタンで構成されます。
Webサイトのフッターには何を載せますか？
連絡先、プライバシーポリシーや利用規約などの補助リンク、SNSリンク、場合によってはメニューの一部を再掲します。
1ページのWebサイトも同じ構成ですか？
はい。同じセクションを1ページに並べ、新しいページを開く代わりに、メニューから各セクションへ移動します。
無料で始める · クレジットカード不要
製品
- AI ホームページ作成ツール：作りたいサイトを普段の言葉で伝えるだけで、数分で公開
- ホワイトラベル プラットフォーム：自社ブランド、自社ドメイン、自社の利益で運営
- エンタープライズ：SSO、個別の SLA、専任サポート
- 開発者向け API：自社の SaaS にサイト生成機能を組み込み
ご利用いただける方
- 制作会社・代理店向け：自社ブランドで再販
- フリーランス向け：自分ブランドのビルダーを持つ
- ホスティング事業者向け：サービスにビルダーを追加
- SaaS プラットフォーム向け：API でサイト作成を組み込み
- スタートアップ向け
- 金融サービス向け
- 医療・ヘルスケア向け