サイト別に押さえるポイント
2026/01/22
ホームページを立てるときに、まず最初に意識してほしいのが「このサイトは何のために存在するのか」という目的を明確にすることです。目的が曖昧なまま制作を始めてしまうと、デザインや文章、構成の判断基準が定まらず、「きれいだけど何がしたいのかわからないサイト」になりがちです。
たとえば、会社の信頼性を高めたいのか、商品を売りたいのか、問い合わせを増やしたいのか、人材を採用したいのかによって、トップページに書くべき内容や情報の順番は大きく変わります。目的が決まっていれば、「これは載せるべきか」「これは今は不要か」という判断がしやすくなり、結果として無駄のない、伝わるホームページになります。
また、目的を明確にすることは、制作側だけでなく、閲覧するユーザーにとっても重要です。ユーザーはページを開いた瞬間に「ここで何が得られるのか」を無意識に判断しています。目的に沿ったメッセージが最初に示されていれば、ユーザーは安心して読み進め、行動(問い合わせ・購入・応募など)につながりやすくなります。
ホームページは作ること自体がゴールではありません。目的を明らかにし、その目的を達成するためにどう使うかを考えてこそ、初めて「成果の出るホームページ」になります。制作に取りかかる前に、ぜひ一度「このサイトで何を実現したいのか」を言葉にしてみてください。それが、成功への第一歩です。
「ホームページ冒頭(ファーストビュー〜スクロール直後)」に“必ず書くべきこと”を、①目的 → ②最優先事項 → ③補足事項の順で整理します。※ここでは絶対的記載事項=冒頭必須、相対的記載事項=次点として扱います。
WEBプロデューサー視点での「実務でそのまま使えるワイヤーフレーム構成」を、①ファーストビュー → ②中段 → ③下段(クロージング)の流れで整理します。※図ではなく構成設計(要素配置)として記載します。
■ 総括(WEBプロデューサー視点)
■ プロ視点の鉄則
WEBプロデューサー視点での「実務でそのまま使えるワイヤーフレーム構成」を、①ファーストビュー → ②中段 → ③下段(クロージング)の流れで整理します。※図ではなく構成設計(要素配置)として記載します。
- 冒頭=「誰に・何を・なぜ」
- デザインより先に目的と優先順位を決める
- ファーストビューで迷わせた時点で離脱
- ファーストビュー=結論
- 中段=納得
- 下段=行動
■ コーポレートサイト
目的:顧客・取引先・社会との円滑なコミュニケーション
冒頭に記載すべき事柄(優先順)
■ コーポレートサイト|ワイヤーフレーム構成
目的:信頼形成・問い合わせ獲得
① ファーストビュー
■ ブランドサイト
目的:商品・サービスの認知度向上・世界観の訴求
冒頭に記載すべき事柄
■ ブランドサイト|ワイヤーフレーム構成
目的:世界観・記憶定着
① ファーストビュー
■ リクルートサイト
目的:優秀な人材の獲得・企業理解の促進
冒頭に記載すべき事柄
■ リクルートサイト|ワイヤーフレーム構成
目的:応募動機形成
① ファーストビュー
■ プロモーションサイト
目的:商品・サービスの販促・話題化
冒頭に記載すべき事柄
■ プロモーションサイト|ワイヤーフレーム構成
目的:話題化・参加促進
① ファーストビュー
■ セールスサイト
目的:365日働くWEB上の営業マン
冒頭に記載すべき事柄
■ セールスサイト|ワイヤーフレーム構成
目的:成約獲得
① ファーストビュー
■ ランディングページ(LP)
目的:一点集中で成果を出すWEB営業マン
冒頭に記載すべき事柄
■ ランディングページ(LP)|ワイヤーフレーム構成
目的:一点突破・即決
① ファーストビュー
■ 店舗サイト
目的:WEB上の名刺として集客力アップ
冒頭に記載すべき事柄
■ 店舗サイト|ワイヤーフレーム構成
目的:来店促進
① ファーストビュー
■ サポートサイト
目的:顧客満足度向上・問い合わせ削減
冒頭に記載すべき事柄
■ サポートサイト|ワイヤーフレーム構成
目的:自己解決率向上
① ファーストビュー
■ ポートフォリオサイト
目的:自分の才能・実績を伝え、仕事につなげる
冒頭に記載すべき事柄
■ ポートフォリオサイト|ワイヤーフレーム構成
目的:仕事獲得
① ファーストビュー
目的:顧客・取引先・社会との円滑なコミュニケーション
冒頭に記載すべき事柄(優先順)
- 会社は何をしている会社か(事業内容の一言要約)
- 提供価値・強み(信頼・実績・専門性)
- 企業名・ロゴ・タグライン
- 主な事業・サービスへの導線
- 問い合わせ・資料請求への導線
目的:信頼形成・問い合わせ獲得
① ファーストビュー
- ロゴ/グローバルナビ
- キャッチコピー(事業内容を一言で)
- サブコピー(強み・提供価値)
- メインビジュアル
- CTA(お問い合わせ/資料請求)
- 事業紹介(3〜5ブロック)
- 選ばれる理由・強み
- 実績・導入事例
- お知らせ・ニュース
- 会社概要(簡易)
- アクセス・拠点
- CTA再掲
- フッター(法的表記・SNS)
目的:商品・サービスの認知度向上・世界観の訴求
冒頭に記載すべき事柄
- ブランドコンセプト・世界観(感情に訴えるメッセージ)
- ブランドが提供する体験・価値
- 象徴的ビジュアル(写真・動画・コピー)
- 主力商品・代表的サービス
- ブランドストーリーへの導線
目的:世界観・記憶定着
① ファーストビュー
- フルビジュアル(写真/動画)
- ブランドコピー(情緒)
- ロゴ・最小限ナビ
- ブランドストーリー
- 世界観・哲学
- 代表商品・体験紹介
- ビジュアルギャラリー
- SNS連携
- 関連サイト導線
- コピーライト
目的:優秀な人材の獲得・企業理解の促進
冒頭に記載すべき事柄
- 「どんな人に来てほしいか」の明確なメッセージ
- 会社の存在意義・ミッション
- 働く魅力(成長・やりがい・環境)
- 社員・仕事の雰囲気が伝わる要素
- 募集職種・エントリー導線
目的:応募動機形成
① ファーストビュー
- キャッチコピー(誰向けか明確)
- 社員写真・動画
- エントリーボタン
- ミッション・ビジョン
- 仕事紹介
- 社員インタビュー
- 働く環境・制度
- 募集要項
- 選考フロー
- FAQ
- エントリー再掲
目的:商品・サービスの販促・話題化
冒頭に記載すべき事柄
- キャンペーン・企画の主旨・結論
- ユーザーにとってのメリット
- 期間・限定性・緊急性
- 商品・サービスの魅力
- 行動喚起(参加・購入・申込)
目的:話題化・参加促進
① ファーストビュー
- キービジュアル
- キャンペーン訴求コピー
- 期間・限定表記
- CTA
- 商品・企画説明
- メリット・特典
- 利用シーン
- SNS拡散要素
- 注意事項
- 問い合わせ
- CTA再掲
目的:365日働くWEB上の営業マン
冒頭に記載すべき事柄
- 誰のどんな悩みを解決する商品か
- ベネフィット(得られる結果)
- 他社との違い・優位性
- 実績・証拠(数字・事例)
- 購入・申込への導線
目的:成約獲得
① ファーストビュー
- 悩み訴求コピー
- 解決策の提示
- CTA(購入・申込)
- ベネフィット説明
- 商品詳細
- 実績・証拠
- 他社比較
- 価格・プラン
- 保証・FAQ
- CTA強調
目的:一点集中で成果を出すWEB営業マン
冒頭に記載すべき事柄
- ターゲットの悩みを突くキャッチコピー
- 結論(この商品で解決できる)
- 具体的なベネフィット
- 安心材料(実績・保証・口コミ)
- CTA(申込・購入ボタン)
目的:一点突破・即決
① ファーストビュー
- 強烈なキャッチコピー
- ベネフィット
- CTA(即行動)
- 問題提起 → 解決
- 商品説明
- お客様の声
- 実績・信頼材料
- オファー再提示
- 保証・不安解消
- CTA連打
目的:WEB上の名刺として集客力アップ
冒頭に記載すべき事柄
- 何の店か・何ができる店か
- 店舗の強み・選ばれる理由
- 所在地・営業時間・アクセス
- 雰囲気が分かる写真
- 予約・問い合わせ導線
目的:来店促進
① ファーストビュー
- 店舗写真
- 店名・業種
- キャッチコピー
- 予約・電話ボタン
- メニュー・サービス
- 強み・特徴
- 店内・スタッフ写真
- 口コミ
- アクセス・地図
- 営業時間
- SNS
- 予約CTA
目的:顧客満足度向上・問い合わせ削減
冒頭に記載すべき事柄
- 「困ったらここ」という明確な案内
- よくある質問(FAQ)への導線
- サポート対象の商品・サービス
- 検索窓・カテゴリ導線
- 問い合わせ方法
目的:自己解決率向上
① ファーストビュー
- 検索窓(最重要)
- よくある質問リンク
- カテゴリ別サポート
- 人気記事
- トラブル別導線
- 問い合わせ方法
- 対応時間
- 注意事項
目的:自分の才能・実績を伝え、仕事につなげる
冒頭に記載すべき事柄
- 自分は何者か(肩書・専門)
- 得意分野・提供できる価値
- 代表作品・実績への導線
- 実績の信頼性(実務・受賞など)
- 連絡先・依頼導線
目的:仕事獲得
① ファーストビュー
- 名前・肩書
- 専門分野コピー
- 代表作品サムネイル
- 実績一覧
- 制作プロセス
- スキル・ツール
- プロフィール詳細
- 問い合わせ
- SNS・外部リンク