Webサイト制作の流れ:初めての制作で知っておくべき全工程

この記事でわかること
- Webサイト制作の全体フロー(7つの工程)
- 各フェーズの内容と所要期間
- 発注者側がやるべきこと
- スケジュールが遅れる原因
- プロジェクトをスムーズに進めるコツ
「Webサイト制作を依頼したいけれど、どんな流れで進むのかわからない」——初めて制作会社に依頼する方から、よく聞く声です。
全体の流れを把握しておくと、「今、何が行われているのか」「次に何を準備すればいいのか」が明確になり、プロジェクトがスムーズに進みます。逆に、流れを知らないまま進めると、確認の遅れや認識のズレが生じ、スケジュールが大きく遅延することもあります。
この記事では、Webサイト制作の全工程を解説します。各フェーズで何が行われるのか、発注者として何を準備すべきかを整理していきます。
制作の全体フロー
Webサイト制作は、大きく7つの工程に分かれます。
1. ヒアリング・要件定義
↓
2. 企画・設計
↓
3. デザイン
↓
4. コーディング・実装
↓
5. テスト・検証
↓
6. 公開
↓
7. 運用・改善
一般的なコーポレートサイト(10〜20ページ程度)の場合、問い合わせから公開まで2〜3ヶ月が目安です。ページ数が多い場合や、機能が複雑な場合は、さらに期間が必要になります。
各フェーズの内容と期間
1. ヒアリング・要件定義
期間目安: 1〜2週間
内容:
制作会社が発注者の要望を聞き取り、制作するWebサイトの要件を整理するフェーズです。
- Webサイトを作る目的の確認
- ターゲット(想定する閲覧者)の整理
- 必要なページ・機能の洗い出し
- 予算・スケジュールの確認
- 参考サイト・競合サイトの共有
発注者がやること:
- 制作目的を明確にしておく
- 予算の上限を決めておく
- 希望する公開時期を伝える
- 参考にしたいサイトをリストアップする
- 社内の意思決定者を明確にする
このフェーズでの認識合わせが、プロジェクト全体の成否を左右します。曖昧なまま進めると、後から「思っていたものと違う」という事態になりかねません。
2. 企画・設計
期間目安: 2〜3週間
内容:
ヒアリング内容をもとに、Webサイトの設計図を作るフェーズです。
- サイトマップ(ページ構成図)の作成
- ワイヤーフレーム(画面構成の設計図)の作成
- 必要なコンテンツのリストアップ
- サーバー・ドメインの確認
サイトマップとは:
サイト全体のページ構成を図にしたものです。トップページから各ページへの導線がどうなっているかを示します。
ワイヤーフレームとは:
各ページの画面構成を示す設計図です。「ここに見出し」「ここに画像」「ここにボタン」といった配置を、色やデザインを付けずに示します。
発注者がやること:
- サイトマップの確認・承認
- ワイヤーフレームの確認・フィードバック
- 掲載するコンテンツの準備開始
- 社内での合意形成
ワイヤーフレームは「設計図」なので、この段階で情報の過不足や導線の問題を指摘することが重要です。デザインが始まってからの大幅な構成変更は、追加費用や遅延の原因になります。
3. デザイン
期間目安: 2〜4週間
内容:
ワイヤーフレームをもとに、実際の見た目を作るフェーズです。
- トップページのデザイン作成
- 下層ページのデザイン作成
- スマートフォン表示のデザイン作成
- ロゴ・アイコン・バナーなどの素材作成
一般的に、まずトップページのデザインを提出し、方向性の確認を行います。承認後、下層ページのデザインに進みます。
発注者がやること:
- デザイン案の確認・フィードバック
- 社内での合意形成
- 写真・ロゴなどの素材提供
- 原稿(テキスト)の提供
確認時のポイント:
- 自社のイメージに合っているか
- ターゲット層に適したデザインか
- 競合他社と差別化できているか
- 読みやすさ・使いやすさに問題はないか
デザインの修正は、この段階で行うのが最も効率的です。次のコーディング工程に入ってからの修正は、作業のやり直しが発生するため、追加費用がかかることがあります。
4. コーディング・実装
期間目安: 2〜4週間
内容:
デザインをもとに、実際にWebブラウザで表示・動作する形に作り上げるフェーズです。
- HTML/CSS/JavaScriptでのコーディング
- CMSの構築・設定
- お問い合わせフォームなどの機能実装
- スマートフォン対応
発注者がやること:
- 制作会社からの質問への回答
- 原稿・素材の最終提供
- サーバー・ドメイン情報の提供
このフェーズでは、制作会社側の作業が中心となります。ただし、細かな確認事項(電話番号、住所、担当者名など)の問い合わせがあるため、迅速に回答することがスケジュール維持のポイントです。
5. テスト・検証
期間目安: 1〜2週間
内容:
完成したWebサイトが正しく動作するかを確認するフェーズです。
- 各ブラウザでの表示確認(Chrome、Safari、Edgeなど)
- スマートフォン・タブレットでの表示確認
- リンク切れのチェック
- フォーム送信のテスト
- 誤字脱字のチェック
発注者がやること:
- テスト環境でのサイト確認
- 修正依頼(あれば)の提出
- 最終承認
テスト環境(本番公開前の確認用サイト)を確認し、問題がないかをチェックします。この段階で見つけた軽微な修正は、通常は追加費用なしで対応されます。
6. 公開
期間目安: 1〜3日
内容:
テスト完了後、実際にインターネット上に公開するフェーズです。
- 本番サーバーへのアップロード
- ドメインの設定
- SSL(https)の設定
- 公開後の動作確認
発注者がやること:
- 公開日時の最終確認
- 公開後の動作確認
- 社内への周知
公開直後は、予期しない問題が発生することもあります。公開後すぐに制作会社と連絡が取れる体制を整えておくと安心です。
7. 運用・改善
期間: 継続的
内容:
公開後、Webサイトを維持・改善していくフェーズです。
- コンテンツの更新・追加
- アクセス解析の確認
- SEO対策の継続
- セキュリティ対策
- 定期的なバックアップ
発注者がやること:
- 定期的なコンテンツ更新
- アクセス状況の確認
- 改善施策の検討
- 運用サポート契約の検討
Webサイトは「作って終わり」ではありません。公開後の運用・改善が、成果を出すためには不可欠です。
全体スケジュールの目安
一般的なコーポレートサイト(10〜20ページ)の場合、以下のようなスケジュールになります。
| フェーズ | 期間目安 | 発注者の関与度 |
|---|---|---|
| ヒアリング・要件定義 | 1〜2週間 | 高 |
| 企画・設計 | 2〜3週間 | 高 |
| デザイン | 2〜4週間 | 中 |
| コーディング・実装 | 2〜4週間 | 低 |
| テスト・検証 | 1〜2週間 | 中 |
| 公開 | 1〜3日 | 低 |
| 合計 | 約2〜3ヶ月 | — |
サイト規模別の目安:
- ランディングページ(1ページ):2〜4週間
- 小規模サイト(5ページ程度):1〜2ヶ月
- 中規模サイト(10〜30ページ):2〜3ヶ月
- 大規模サイト(50ページ以上):4〜6ヶ月以上
発注者がやるべきこと一覧
プロジェクトを通じて、発注者が対応すべきことをまとめます。
事前準備(発注前)
- [ ] 制作目的の明確化
- [ ] 予算の決定
- [ ] 希望公開日の設定
- [ ] 参考サイトのリストアップ
- [ ] 社内の意思決定者・確認フローの整理
制作中
- [ ] サイトマップ・ワイヤーフレームの確認・承認
- [ ] デザインの確認・フィードバック
- [ ] 原稿(テキスト)の提供
- [ ] 写真・ロゴなどの素材提供
- [ ] サーバー・ドメイン情報の提供
- [ ] 制作会社からの質問への回答
テスト・公開
- [ ] テスト環境での確認
- [ ] 修正依頼の提出
- [ ] 最終承認
- [ ] 公開後の動作確認
スケジュール遅延のよくある原因
Webサイト制作のスケジュールが遅れる原因として、以下のようなものがあります。
1. 確認・フィードバックの遅れ
制作会社から提出されたデザインやワイヤーフレームの確認が遅れると、その分だけスケジュールが後ろ倒しになります。
対策:
- 確認期限を事前に決めておく
- 社内の確認フローを簡素化する
- 意思決定者を明確にしておく
2. 素材・原稿の準備遅れ
写真や原稿の準備が遅れると、制作が進められなくなります。特に、社員インタビューや製品写真など、自社で用意する素材は早めに準備が必要です。
対策:
- 必要な素材リストを早めにもらう
- 原稿作成のスケジュールを逆算して組む
- 社内での協力体制を整える
3. 追加要望・仕様変更
制作途中での追加要望や仕様変更は、スケジュール遅延の大きな原因になります。特に、デザイン確定後やコーディング開始後の変更は、作業のやり直しが発生します。
対策:
- 要件定義フェーズで要望を出し切る
- 変更が発生した場合は影響範囲を確認する
- 「あったらいいな」と「必須」を区別する
4. 社内での合意形成の遅れ
「デザインを見せたら社長から『違う』と言われた」——社内での合意形成が不十分なまま進めると、後から大きな手戻りが発生します。
対策:
- 意思決定者を最初から巻き込む
- 要件定義の段階で方向性を合意する
- 中間確認の機会を設ける
スムーズに進めるためのコツ
1. 窓口担当者を一本化する
制作会社とのやり取りは、窓口となる担当者を一人に絞ることをおすすめします。複数人が別々に連絡すると、情報が錯綜し、認識のズレが生じやすくなります。
2. 意思決定のルールを決めておく
「このデザインでいいですか?」と聞かれたとき、誰がどう判断するかを事前に決めておきます。確認のたびに「上に確認します」を繰り返すと、スケジュールはどんどん遅れます。
3. 素材・原稿は早めに準備する
写真撮影や原稿作成には、想像以上に時間がかかります。制作会社から「○日までに原稿をください」と言われる前に、自主的に準備を進めておくとスムーズです。
4. 「完璧」を求めすぎない
細部にこだわりすぎると、いつまでも公開できません。まずは「80点」で公開し、運用しながら改善していく姿勢も大切です。
5. 定期的にコミュニケーションを取る
週1回程度の定例ミーティングを設けると、進捗状況の把握や認識のズレの早期発見につながります。問題が小さいうちに対処できます。
まとめ
Webサイト制作は、ヒアリングから公開まで7つの工程を経て進みます。一般的なコーポレートサイトで2〜3ヶ月程度の期間がかかります。
発注者として特に重要なのは、以下の3点です。
- 事前準備をしっかり行う:目的、予算、スケジュールを明確にしてから臨む
- 確認・フィードバックを迅速に行う:遅れはそのままスケジュール遅延につながる
- 素材・原稿を早めに準備する:制作会社任せにせず、自社で用意するものは計画的に
全体の流れを把握しておけば、「今、何が行われているのか」「次に何を準備すればいいのか」が明確になります。制作会社との協力体制を築き、スムーズなプロジェクト進行を目指しましょう。
次の記事では、制作会社の選び方について解説します。どのようなポイントで選べばいいのか、失敗しないための判断基準を整理します。
記事を書いた人

アストライド代表 纐纈 智英
アストライド代表。前職を含め地域企業を中心とした200社以上の経営者インタビュー映像を制作。現在は「左脳と右脳のハイブリッド」を掲げ、戦略設計から映像・Web・各種コンテンツ制作まで手がける。 これまで音楽家として楽曲提供、行政職員として12年間 制度運用・予算編成等に従事。その後、NPO法人、映像・マーケティング分野に転じ、現在に至る。現在は大学非常勤講師として映像編集ソフトの操作指導も行う。

私たちアストライドは、経営者のインタビュー映像の制作に圧倒的な強みを持っています。
課題や要件が明確でなくても問題ございませんので、お気軽にご相談ください。
アストライドは、代表 纐纈がこれまで200社以上の経営者インタビュー映像を制作してきたノウハウとインタビュースキルを軸として、BtoBマーケティング視点からクライアント様それぞれのステージに合わせた、各種クリエイティブをご提案・制作します。

私たちアストライドは、経営者のインタビュー映像の制作に圧倒的な強みを持っています。課題や要件が明確でなくても問題ございませんので、お気軽にご相談ください。
アストライドは、代表 纐纈がこれまで200社以上の経営者インタビュー映像を制作してきたノウハウとインタビュースキルを軸として、BtoBマーケティング視点からクライアント様それぞれのステージに合わせた、各種クリエイティブをご提案・制作します。
Astride(アストライド)
〒510-0016 三重県四日市市羽津山町1-6
© Astride All rights reserved.



