Webサイト制作の流れを工程別に解説 期間の目安と担当者の動き方
「Webサイトを作りたいが、何から始めればいいかわからない」「どれくらいの期間がかかるのか見当がつかない」という担当者の方は少なくありません。制作会社へ依頼してから公開まで、Webサイト制作にはさまざまなフェーズがあり、それぞれに担当者側の対応が求められます。全体像を事前に理解しておくことで、プロジェクトをスムーズに進め、手戻りや納期遅延を防ぐことができます。
本記事では、ヒアリング・要件定義から設計・デザイン・コーディング・テスト・公開まで、Webサイト制作の流れを工程ごとに詳しく解説します。各フェーズの所要期間の目安も合わせてご紹介しますので、制作スケジュールを立てる際の参考にしてください。
Webサイト制作の全体的な費用相場・制作会社の選び方・完成後の運用については、「Webサイト制作の費用・流れ・制作会社選び 担当者が知るべき完全ガイド」で詳しく解説しています。本記事では、制作プロセスの各工程に特化して深く掘り下げます。
1. Webサイト制作の全体像を把握しよう
1-1. Webサイト制作にかかる期間の目安
Webサイト制作にかかる期間は、サイトの規模・機能の複雑さ・担当者のレスポンス速度によって大きく異なります。一般的な目安は以下のとおりです。
- 小規模サイト（1〜20ページ程度）：2〜3ヶ月
LP（ランディングページ）や採用サイト、シンプルなコーポレートサイトなどがこれに当たります。要件が明確で素材の準備が整っていれば、比較的短期間での公開が可能です。
- 中規模サイト（20〜100ページ程度）：3〜6ヶ月
中小企業のコーポレートサイトやサービスサイト、ECサイトの基本形などが該当します。ページ数が増えるほどデザインやコーディングの工数が増加し、確認・修正のサイクルも長くなります。
- 大規模サイト（100ページ以上）：6ヶ月〜1年以上
メーカーや大学・官公庁などの大規模サイト、多言語対応サイト、複雑な機能を持つWebシステム連携サイトなどがこれに含まれます。計画段階だけで数週間を要することもあります。
これらはあくまで目安であり、素材の準備状況や社内の承認フロー、機能要件の複雑さによって大幅に変動します。余裕を持ったスケジュールを設定することが重要です。
1-2. 制作フローの全体図
Webサイト制作は大きく「発注前フェーズ」「設計・企画フェーズ」「制作フェーズ」「テスト・公開フェーズ」の4つに分けられます。各フェーズは以下の工程で構成されています。
- 発注前フェーズ：目的の明確化 → RFP（提案依頼書）作成 → 複数社への見積もり依頼 → 制作会社の選定・契約
- 設計・企画フェーズ：ヒアリング → 要件定義 → サイト構成（サイトマップ）作成 → ワイヤーフレーム作成
- 制作フェーズ：デザイン制作 → コーディング・システム実装 → コンテンツ入稿
- テスト・公開フェーズ：動作確認・テスト → 修正 → 公開 → 公開後の初期確認
各フェーズが連続して進むことで、最終的な成果物であるWebサイトが完成します。どの工程も省略することなく丁寧に進めることが、品質の高いサイトを完成させる鍵です。
2. フェーズ1：発注前の準備
Webサイト制作を制作会社に依頼する前に、発注者側が準備すべきことがあります。この段階での準備不足が、後工程での手戻りや納期遅延の最大の原因となります。
2-1. 目的・ゴールの明確化
最初に取り組むべきは、「なぜWebサイトを作るのか」「完成後に何を達成したいのか」を明確にすることです。目的が曖昧なまま制作会社に依頼してしまうと、完成後に「思っていたものと違う」という事態になりかねません。
明確にすべき主な項目として、以下が挙げられます。
- 制作の目的：新規顧客の獲得・採用強化・ブランディング向上・既存顧客サポートの充実など
- ターゲットユーザー：年齢層・業種・役職・課題・情報収集の方法など
- KGI・KPI：問い合わせ数・資料請求数・採用応募数などの数値目標
- 競合サイトの把握：同業他社の強みと弱み、自社との差別化ポイント
目的とゴールを社内で合意形成し、文書化しておくことが重要です。特にBtoB企業では、Webサイトが商談前の企業調査に使われるケースが多く、「信頼性の担保」と「課題解決への導線設計」が重要な役割を果たします。
2-2. RFP（提案依頼書）の作成
制作会社への依頼の精度を高めるために、RFP（Request for Proposal：提案依頼書）を作成しておくことをおすすめします。RFPとは、制作会社に対して自社のニーズや要件を整理して提示するための文書です。
RFPに盛り込む主な内容は以下のとおりです。
- 会社概要・事業内容：自社のビジネスモデルと強みの説明
- 制作の目的と背景：なぜ今Webサイトを作る・リニューアルするのか
- ターゲットユーザー像：誰に・何を・どのように伝えるか
- 機能要件：問い合わせフォーム・会員機能・予約システム・多言語対応など
- デザインイメージ：参考サイト・ブランドトーン・禁止事項など
- スケジュール・予算：公開希望時期・予算の上限
- 保守・運用の希望：公開後のサポート内容
RFPがあると、複数の制作会社から同一条件での見積もりが取得でき、比較検討が容易になります。また制作会社側も要件を正確に把握した上で提案できるため、ミスマッチのリスクが軽減されます。
所要期間の目安：目的整理〜RFP作成まで1〜2週間
2-3. 制作会社の選定・契約
RFPをもとに複数の制作会社へ問い合わせ・提案依頼を行い、提案内容・見積もり・実績などを比較して制作会社を選定します。選定後は契約書の締結と発注手続きを行い、正式に制作がスタートします。
制作会社選定のポイントとして、自社と同業種・同規模の制作実績があるか、担当者とのコミュニケーションのとりやすさ、SEO対策やアクセシビリティへの対応可否、公開後の保守体制などを確認しておくと安心です。
所要期間の目安：提案依頼〜契約まで2〜4週間
3. フェーズ2：ヒアリング・要件定義
制作会社との契約後、最初に行われるのがヒアリングと要件定義です。このフェーズはWebサイト制作において最も重要な工程の一つであり、ここでの精度が制作全体の品質を左右します。
3-1. ヒアリングで確認される主な内容
制作会社は、担当者から以下のような情報を詳しくヒアリングします。
- 事業・サービスの内容：提供するサービスや商品の強み・特徴・競合との差別化点
- ターゲットユーザー：年齢・職業・課題・情報収集の行動パターン
- サイトに求める機能：問い合わせフォーム・資料請求・会員ページ・EC機能など
- デザインの方向性：ブランドカラー・既存ロゴ・参考サイト・禁止表現
- コンテンツの準備状況：テキスト・写真・動画などの素材の有無
- スケジュール・予算感：公開希望時期・予算の上限と優先度
ヒアリングは1〜2回の打ち合わせで実施されることが多く、担当者はできる限り具体的な情報を準備して臨むことが重要です。「競合他社のどこに負けているか」「過去の問い合わせでよく聞かれた質問」など、現場の声も積極的に共有しましょう。
3-2. 要件定義とは
要件定義とは、ヒアリングの内容をもとに「Webサイトに必要な機能・仕様・制約条件」を文書化する作業です。制作会社が作成し、発注者が確認・承認します。
要件定義書には、機能要件（何ができるか）と非機能要件（パフォーマンス・セキュリティ・アクセシビリティなど）の両方が盛り込まれます。この文書が制作の「設計図」となり、後工程の判断基準として機能します。要件定義の段階で認識のズレを解消しておかないと、デザイン・コーディング工程で大幅な手戻りが発生するリスクがあります。
所要期間の目安：ヒアリング〜要件定義完了まで1〜3週間
4. フェーズ3：設計（サイト構成・ワイヤーフレーム）
要件定義が固まったら、サイト全体の構造設計に移ります。このフェーズでは、サイトマップとワイヤーフレームを作成し、情報設計を固めます。
4-1. サイトマップの作成
サイトマップとは、Webサイト全体のページ構成を一覧化した設計図です。どのようなページが存在し、それぞれがどのような階層関係にあるかを視覚的に整理します。
例えば製造業の企業サイトであれば、「会社概要」「事業内容」「製品・サービス」「採用情報」「ニュース」「お問い合わせ」などのカテゴリが大枠となり、各カテゴリの下層ページが設計されます。サイトマップの作成により、コンテンツの過不足や重複が発見しやすくなります。
SEOの観点でも、サイトマップはきわめて重要です。検索エンジンがサイト全体のコンテンツを正確に把握できるよう、論理的な階層構造と適切なURL設計を行うことが評価向上につながります。
4-2. ワイヤーフレームの作成
ワイヤーフレームとは、各ページのレイアウト・情報の配置・ユーザーの導線を示した骨格図です。デザインを加える前の段階で作成するため、色・フォント・画像などのビジュアル要素は含まれません。
ワイヤーフレームでは以下のような要素を設計します。
- ヘッダー・フッターの構成：ロゴの位置・ナビゲーションメニューの項目
- メインコンテンツの配置：見出し・本文・画像・CTAボタンの位置
- サイドバーやフォームの有無：補足情報・問い合わせ動線の設計
- モバイル対応のレイアウト：スマートフォン表示時の構造
ワイヤーフレームは発注者が確認・承認するフェーズです。デザインに進む前にコンテンツの配置と導線を確定させることで、後工程での大幅な変更を防ぐことができます。
所要期間の目安：サイトマップ〜ワイヤーフレーム承認まで2〜4週間
5. フェーズ4：デザイン制作
設計が確定したら、いよいよビジュアルデザインの制作に入ります。このフェーズでは、制作会社のデザイナーがサイトの見た目を作り上げます。
5-1. トップページデザインの作成と確認
デザイン制作はまずトップページから始まります。カラーパレット・フォント・余白・写真のトーンなど、サイト全体の視覚的なスタイルをここで決定します。トップページのデザインが承認されると、その方向性を踏まえて下層ページのデザインが作成されます。
確認時のポイントとして以下の点に注意しましょう。
- ブランドとの整合性：企業のイメージやトーンと合っているか
- ターゲットへの訴求力：想定するユーザーに響くデザインか
- CTAの視認性：問い合わせボタンや資料請求ボタンが目立つ位置にあるか
- 情報の優先順位：最も伝えたいことが最初に目に入るか
修正は何度でも行えますが、回数が増えるほどスケジュールに影響します。確認するポイントを事前にチームで合意しておくことで、スムーズなフィードバックが可能になります。
5-2. 下層ページデザインと素材の準備
トップページのデザインが確定したら、各下層ページのデザインを作成します。同時に、ページに掲載するテキスト・写真・図版などの素材を準備します。
素材の準備は発注者側が行うケースが多く、この対応の遅れがスケジュール全体を押し上げる原因になりがちです。特に写真撮影や原稿ライティングを外注する場合は、制作スケジュールと並行して早めに手配することが重要です。
所要期間の目安：デザイン制作全体で2〜6週間（規模により異なる）
6. フェーズ5：コーディング・システム実装
デザインが確定したら、エンジニアによるコーディングとシステム実装の工程に入ります。このフェーズでは、デザインカンプをもとに実際にブラウザで動作するWebサイトとして構築します。
6-1. HTMLコーディングとCMS構築
デザインを忠実に再現しながら、HTML・CSS・JavaScriptを使ってページを組み上げます。また、担当者が自社でコンテンツを更新できるようにするため、CMS（コンテンツ管理システム）の導入・設定を同時に行うことが一般的です。
CMSとしてはWordPressが広く普及していますが、大手企業や官公庁ではセキュリティや安定性を重視してMovable Typeが選ばれるケースも多くあります。企業規模や運用体制・セキュリティポリシーに応じた適切なCMS選定が、長期的な運用のしやすさに直結します。
6-2. 各種機能の実装
コーディングと並行して、サイトに必要な各種機能を実装します。主な実装項目として以下が挙げられます。
- フォーム機能：問い合わせ・資料請求・採用応募フォームの設置と自動返信メールの設定
- 検索機能：サイト内検索・製品検索・店舗検索など
- 会員機能：ログイン・マイページ・お気に入り機能など
- 外部サービス連携：GoogleマップAPI・SNSシェアボタン・チャットツール連携など
このフェーズでは、制作会社から「ドメインとサーバーの情報」を求められることが多くあります。新規で取得するのか既存のものを使うのかを事前に確認し、スムーズに情報提供できる体制を整えておきましょう。
6-3. レスポンシブ対応
現代のWebサイトは、スマートフォン・タブレット・PCなど複数のデバイスで快適に閲覧できるレスポンシブ対応が必須です。Googleの検索評価においてもモバイルフレンドリーであることは重要な評価指標の一つとなっており、スマートフォン表示の最適化は集客力にも直結します。
所要期間の目安：コーディング・実装全体で3〜8週間（機能の複雑さによる）
7. フェーズ6：テスト・品質確認
コーディングが完了したら、公開前のテストフェーズに入ります。このフェーズでは、制作したサイトに不具合がないかを多角的に確認します。
7-1. 動作確認とブラウザテスト
まず、制作されたサイトがさまざまな環境で正常に動作するかを確認します。主なテスト項目は以下のとおりです。
- ブラウザ互換性テスト：Chrome・Safari・Firefox・Edge・スマートフォンブラウザなど複数の環境での表示確認
- デバイステスト：PC・スマートフォン・タブレットでのレイアウト崩れの確認
- リンクチェック：全ページのリンクが正常に機能しているかの確認
- フォームテスト：送信・自動返信メール・管理者通知が正常に動作するかの確認
- 表示速度の確認：ページの読み込み速度がSEO評価に影響しないかの確認
7-2. 内容確認・校正
テキストの誤字脱字・情報の正確性・法的表記（特定商取引法に基づく表記・プライバシーポリシーなど）の確認も、このフェーズで行います。制作会社によるチェックと並行して、発注者側でも内容の最終確認を行うことが重要です。
特に医療・金融・不動産などの分野では、法令上の表記ルールがあるため、専門家の確認を挟むケースもあります。
7-3. SEO初期設定の確認
公開前に、基本的なSEO設定が正しく行われているかを確認します。主なチェック項目は以下のとおりです。
- titleタグ・metaディスクリプション：各ページに適切に設定されているか
- 見出し構造（h1〜h3）：適切な階層構造になっているか
- altテキスト：画像に適切な代替テキストが設定されているか
- OGP設定：SNSシェア時に正しくサムネイルと説明文が表示されるか
- Google Search Console・Analyticsの設定：アクセス解析ツールが正常に連携されているか
所要期間の目安：テスト〜修正対応まで1〜3週間
8. フェーズ7：公開・リリース
テストが完了し、発注者の最終承認が得られたら、いよいよ公開（リリース）です。
8-1. 本番環境への移行と公開作業
公開時は、テスト環境から本番サーバーへのデータ移行・DNS設定の変更・SSL証明書の設置など、技術的な作業が発生します。これらの作業は制作会社が主体となって行いますが、ドメインの管理権限や既存サーバーの情報が必要になるため、事前に確認しておきましょう。
リニューアルの場合は、既存サイトから新サイトへのリダイレクト設定（301リダイレクト）も重要な作業です。適切なリダイレクト設定を行わないと、これまで積み上げたSEOの評価が失われるリスクがあります。
8-2. 公開直後の確認作業
サイトが公開されたら、本番環境での動作確認を改めて行います。テスト環境では問題がなかった部分でも、本番サーバーの設定やドメインの変更によって不具合が発生することがあります。公開直後は特に注意深く確認しましょう。
また、Google Search Consoleへのサイトマップ送信・インデックス登録のリクエスト・Google Analyticsの動作確認なども、公開直後に実施します。
所要期間の目安：公開作業〜公開後確認まで1〜2週間
9. 制作スケジュールが遅延する主な原因と対策
Webサイト制作において、当初のスケジュールどおりに進まないケースは珍しくありません。ここでは、遅延の主な原因とその対策を解説します。
9-1. 素材・コンテンツの準備遅れ
制作において最も多い遅延原因の一つが、テキストや画像などの素材の準備遅れです。制作会社はデザインやコーディングを進めたくても、素材がなければ作業を止めざるを得ません。
対策として、制作開始と同時にコンテンツの準備に着手し、ライティングや写真撮影の外注が必要な場合は早期に手配しましょう。各コンテンツの納期を制作スケジュールに組み込んでおくことが重要です。
9-2. 社内承認フローの長期化
デザインや原稿の確認・承認に時間がかかるケースも頻発します。特に複数の部門や経営層が承認に関わる場合、1回のフィードバックに1週間以上かかることもあります。
対策として、承認フローを事前に整理し、誰がどのタイミングで確認するかを明確にしておきましょう。また、フィードバックは「良い・悪い」だけでなく「どこを・どのように変更したいか」を具体的に伝えることで、修正回数を減らすことができます。
9-3. 要件の追加・変更
制作途中で「やっぱりこの機能も追加したい」「デザインの方向性を変えたい」という要件変更が発生すると、スケジュールと費用の両方に大きな影響が出ます。
対策として、要件定義の段階で「必須要件」と「あると良い要件」を明確に分類し、優先度を整理しておくことが重要です。要件の追加・変更が発生した場合は、スケジュールと費用への影響を制作会社と都度確認しながら進めましょう。
10. まとめ
Webサイト制作の流れは、大きく「発注前の準備」「設計・企画」「デザイン」「コーディング・実装」「テスト」「公開」の6つのフェーズで構成されます。小規模なサイトでも2〜3ヶ月、中規模では6ヶ月程度の期間を要するため、公開希望時期から逆算して早めに動き出すことが成功の鍵です。
各フェーズで担当者側がすべきことを理解しておくことで、制作会社とのコミュニケーションが円滑になり、手戻りや遅延のリスクを大幅に低減できます。特に要件定義・素材準備・承認フローの整備は、担当者の関与度がスケジュールに直接影響します。 制作の流れや各フェーズの詳細についてご不明な点がある方、どのような制作体制・スケジュールで進めるべきか迷っている方は、制作実績20,000件以上のフォー・クオリアにお気軽にご相談ください。商社・製造・金融・不動産・大学・官公庁など幅広い業界での制作経験をもとに、貴社の状況に合わせた最適な制作フローをご提案します。
