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

, , , ,

この記事でわかること

  • Webサイト制作の全体フロー(7つの工程)
  • 各フェーズで行われる作業内容と期間の目安
  • 発注者側が準備・対応すべきこと
  • スケジュール遅延が起きやすい原因
  • 制作をスムーズに進めるための実践的なコツ

「Webサイトを作ることになったけれど、どのくらいの期間がかかるのか見当がつかない」「制作会社に発注した後、自分たちは何をすればいいのかわからない」——初めてWeb制作を担当する方にとって、全体像が見えないことは大きな不安要素です。

Webサイト制作は、デザインを作ってプログラムを組むだけの作業ではありません。目的の明確化から始まり、設計、制作、テスト、公開、そして運用まで、複数のフェーズを経て進行するプロジェクトです。一般的な中小企業のコーポレートサイト(20〜30ページ程度)であれば、企画開始から公開まで約3〜4か月が標準的な期間となります。

本記事では、Webサイト制作の全工程を7つのフェーズに分けて解説します。各段階で何が行われるのか、発注者として何を準備すべきかを把握しておくことで、制作会社との認識のズレを防ぎ、スムーズなプロジェクト進行につながります。


Webサイト制作はどのような流れで進むのか?

Webサイト制作は、大きく分けて「準備・設計」「制作」「公開・運用」の3つのフェーズに分類できます。さらに細かく見ると、以下の7つの工程で構成されています。

制作の全体フロー

工程主な作業内容期間の目安
1. ヒアリング・要件定義目的や要望の整理、サイトの方向性決定2〜4週間
2. 企画・設計サイト構造やページ構成の設計2〜4週間
3. デザインビジュアルの作成、見た目の決定3〜6週間
4. コーディング・実装デザインをWebサイトとして構築4〜8週間
5. テスト・検証動作確認、表示チェック1〜2週間
6. 公開本番環境へのアップロード1日〜数日
7. 運用・改善更新、分析、継続的な改善継続

これらの工程は、前のフェーズが完了してから次のフェーズに進む「順次進行型」が基本です。デザインが確定しないままコーディングに進んだり、要件が曖昧なまま制作を始めたりすると、後から大幅な修正が発生し、スケジュールや費用に影響が出る可能性があります。

制作期間の目安として、ページ数が少ないLP(ランディングページ)であれば1〜2か月程度、20〜30ページ程度のコーポレートサイトで3〜4か月程度、100ページを超える大規模サイトでは6か月〜1年以上かかることもあります。


各フェーズではどのような作業が行われるのか?

1. ヒアリング・要件定義(2〜4週間)

制作の方向性を決める最も重要なフェーズです。制作会社が発注者の要望や課題をヒアリングし、サイトの目的、ターゲットユーザー、必要な機能などを明確にします。

主な作業内容:

  • サイト制作の目的と期待する成果の確認
  • ターゲットユーザーの設定(ペルソナの定義)
  • 必要な機能やページの洗い出し
  • 予算とスケジュールの確認
  • 競合サイトの分析と参考サイトの共有

この段階での検討が不十分だと、後工程で大幅な修正が発生しやすくなります。「なぜサイトを作るのか」「誰に向けて発信するのか」「どのような成果を期待するのか」を具体的に言語化しておくことが重要です。

目標設定においては、「お問い合わせ数を月○件にする」「採用エントリー数を○%増やす」など、数値で測定可能な指標(KPI)まで落とし込めると、制作後の効果測定がしやすくなります。

2. 企画・設計(2〜4週間)

要件定義を基に、サイト全体の構造を設計するフェーズです。どのようなページが必要で、それぞれのページにどんな情報を掲載するかを整理します。

主な作業内容:

  • サイトマップ(サイト構造図)の作成
  • ワイヤーフレーム(ページのレイアウト設計図)の作成
  • 機能要件の詳細化
  • ユーザー導線の設計
  • コンテンツの優先順位付け

サイトマップとワイヤーフレームは、発注者と制作会社の間で「どんなサイトを作るか」の認識を一致させるための重要な資料です。この段階で認識がずれていると、デザインやコーディングの段階でやり直しが発生します。提出された資料は内容を十分に確認し、不明点や違和感があれば早めに伝えましょう。

3. デザイン(3〜6週間)

設計に基づいて、サイトのビジュアルを作成するフェーズです。色使い、フォント、画像の配置などを決め、「デザインカンプ」と呼ばれる完成イメージを作成します。

主な作業内容:

  • デザインコンセプトの策定
  • トップページのデザイン作成
  • 下層ページのデザイン作成
  • スマートフォン表示用デザインの作成(レスポンシブ対応)
  • デザインの修正・調整

デザインの確認では、「見た目の好み」だけでなく、「ターゲットユーザーにとって見やすいか」「企業イメージに合っているか」「競合との差別化ができているか」という視点も重要です。

修正依頼がある場合は、このフェーズ中に具体的に伝える必要があります。「なんとなく違う」ではなく、「この部分をこう変えたい」と具体的に指示することで、制作会社とのやり取りが効率的になります。コーディングが始まってからのデザイン変更は、追加費用や納期遅延の原因となります。

4. コーディング・実装(4〜8週間)

確定したデザインを基に、実際にWebサイトとして動作するよう構築するフェーズです。HTML、CSS、JavaScriptなどのプログラミング言語を使用して、ページを組み立てます。

主な作業内容:

  • HTMLコーディング
  • CSSによるスタイル調整
  • JavaScriptによる動的機能の実装
  • CMS(WordPressなど)の構築
  • お問い合わせフォームなどの機能実装
  • アクセス解析タグの設置

この工程は制作会社が主導で進めますが、テキスト原稿や画像素材の提供が必要になる場面があります。素材の準備が遅れると、そのまま制作全体のスケジュールに影響するため、事前に何をいつまでに用意すればよいか確認しておきましょう。

5. テスト・検証(1〜2週間)

完成したサイトが正常に動作するかを確認するフェーズです。ブラウザごとの表示確認、リンク切れのチェック、フォームの動作確認などを行います。

主な作業内容:

  • 各ブラウザでの表示確認(Chrome、Safari、Edge、Firefoxなど)
  • スマートフォン・タブレットでの表示確認
  • リンク切れのチェック
  • 誤字脱字・表記ゆれの確認
  • フォームの動作確認(送信テスト、自動返信メールの確認)
  • ページ表示速度の確認
  • アクセス解析ツールの動作確認

発注者側も、テスト環境でサイト全体を確認し、修正点があれば伝えます。ただし、この段階での大幅なデザイン変更や機能追加は、追加費用が発生するケースがほとんどです。確認すべき点を事前にリスト化しておくと、見落としを防げます。

6. 公開(1日〜数日)

テストが完了したら、本番環境にサイトを公開します。サーバーへのアップロード、ドメイン設定、SSL証明書の適用などを行います。

主な作業内容:

  • 本番サーバーへのファイルアップロード
  • ドメインの切り替え作業
  • SSL(https化)の適用確認
  • リダイレクト設定(リニューアルの場合)
  • 公開後の動作確認
  • 検索エンジンへのインデックス登録

CMSの導入やドメイン・サーバーの移管がある場合は、公開当日の作業が複雑になることがあります。予期せぬトラブルに備えて、公開日は制作会社と連絡が取れる体制を整えておくと安心です。

7. 運用・改善(継続)

公開後も、情報の更新やコンテンツの追加、アクセス解析に基づく改善などを継続的に行います。Webサイトは「作って終わり」ではなく、育てていく資産です。

主な作業内容:

  • コンテンツの更新・追加
  • アクセス解析と改善施策の実施
  • セキュリティアップデート
  • バックアップの取得
  • 問い合わせ対応やフォーム改善

運用を自社で行うのか、制作会社に保守を依頼するのかは、制作開始前に決めておきましょう。CMSを導入していれば、簡単な更新は自社で行えますが、技術的な対応やセキュリティ対策は専門知識が必要になります。


発注者側は何を準備すればよいのか?

Webサイト制作を制作会社に依頼する場合でも、発注者側にはいくつかの対応が求められます。「制作会社に丸投げ」では、期待通りのサイトは完成しません。事前に準備すべきことを整理しておくと、制作がスムーズに進みます。

素材の準備

サイトに掲載するテキストや画像は、発注者側で用意するケースが一般的です。制作会社によっては原稿作成や撮影を代行するサービスもありますが、別途費用がかかります。

準備が必要な素材の例:

  • 会社概要、事業内容、サービス説明などのテキスト原稿
  • 商品写真、社内風景、スタッフ写真などの画像素材
  • ロゴデータ(AI、PNG、SVGなど複数形式)
  • 会社パンフレットや既存の営業資料
  • 掲載したい動画素材

原稿作成は想像以上に時間がかかる作業です。誰が、いつまでに、どのページの原稿を用意するか、社内で分担を決めておくとスムーズです。また、専門用語はわかりやすい言葉に置き換え、ターゲットユーザーにとって読みやすい文章を心がけましょう。

確認・フィードバック

制作の各段階で、サイトマップ、ワイヤーフレーム、デザインカンプ、テストサイトなどの確認依頼が届きます。期限内に確認し、修正点があれば具体的に伝えることが重要です。

確認時のポイント:

  • 「なんとなく違う」ではなく、具体的に何が問題かを伝える
  • 修正依頼は一度にまとめて伝える(小出しにしない)
  • 期限を守って回答する
  • 不明点は早めに質問する

確認作業を後回しにすると、制作全体が止まってしまいます。特にデザインの確認は、「よくわからないからとりあえずOK」と伝えてしまうと、後から「イメージと違う」となっても、追加費用が発生する場合があります。出来上がりをしっかりイメージして、修正依頼があればそのタイミングで伝えることが大切です。

社内調整

制作中には、デザインやコンテンツについて社内で承認を得る場面が発生します。誰が最終決定権を持つのかを明確にし、意思決定が遅れない体制を作っておくことが重要です。

社内調整のポイント:

  • 決裁者を明確にし、承認フローを事前に決めておく
  • 関係部署への情報共有を早めに行う
  • 現場担当者だけで進めず、決裁者を巻き込む
  • 社内の意見をあらかじめ集約しておく

担当者レベルで進めた結果、後から決裁者に「イメージと違う」と言われてやり直しになるケースは珍しくありません。最終的な承認者への確認に時間がかかると、納期やリリース日が延びてしまう原因になります。早い段階で関係者を巻き込むことが、スムーズな進行の鍵となります。


なぜスケジュールが遅れてしまうのか?

Webサイト制作では、当初のスケジュール通りに進まないケースが多く見られます。遅延の原因を理解し、事前に対策を講じておくことが重要です。

確認・フィードバックの遅れ

最も多い遅延原因の一つが、発注者側の確認作業の遅れです。デザインカンプやテストサイトの確認が滞ると、次の工程に進めず、全体のスケジュールが押してしまいます。

制作会社からの確認依頼に対して、何度も返信を催促されるような状況は、双方にとって負担になります。確認期限を守ること、そして修正依頼を一度にまとめて伝えることが、遅延防止につながります。

追加要望・仕様変更

制作が進んだ段階で、「やっぱりこのページも追加したい」「デザインの方向性を変えたい」「この機能も入れたい」といった要望が出ると、前の工程に戻って作業し直す必要が生じます。

デザイン確定後やテストアップ時など、前工程に戻れないタイミングでの変更は、スケジュールに大きな影響を与えます。要件定義の段階で必要な機能やページを洗い出し、優先順位を明確にしておくことが重要です。追加要望が発生した場合は、影響範囲と対応可否について制作会社と早めに相談しましょう。

素材準備の遅れ

テキスト原稿や画像素材の準備が遅れると、制作会社はその箇所の作業を進められません。素材待ちの期間がそのまま遅延につながります。

特に原稿作成は、社内の複数部署から情報を集める必要があるため、想定以上に時間がかかることがあります。制作開始前に必要な素材リストを作成し、担当者と期限を決めておくことが大切です。

社内調整の不足

社内で意見がまとまっていない状態でプロジェクトが進むと、途中で方向性が変わったり、確認に時間がかかったりして、遅延が発生します。「担当者はOKだったが、上長がNGを出した」「他部署から急に要望が入った」といったケースは、事前の合意形成で防げることがほとんどです。


制作をスムーズに進めるためのコツは?

目的と優先順位を明確にしておく

「なぜサイトを作るのか」「何を達成したいのか」を具体的に言語化しておくと、制作中の判断がぶれにくくなります。「集客を増やしたい」「採用を強化したい」「ブランドイメージを向上させたい」など、目的を明確にした上で、数値目標まで落とし込めるとベターです。

デザインや機能で迷ったときも、「この選択は目的達成に貢献するか」という視点で判断できます。

参考サイトを用意する

「こんなサイトにしたい」というイメージを伝えるために、参考サイトを3〜5件ほど用意しておくと、制作会社との認識合わせがスムーズになります。参考サイトを提示する際は、「デザインのトーンが好み」「このナビゲーションが使いやすい」「この構成を参考にしたい」など、どの部分を参考にしたいのかを具体的に伝えましょう。

社内の意思決定者を巻き込む

担当者だけで進めると、後から決裁者に否定されて手戻りが発生するリスクがあります。企画段階から決裁者を巻き込み、方向性について合意を得ておきましょう。承認フローを明確にし、各段階での承認者を事前に決めておくことで、確認待ちによる遅延を防げます。

確認期限を守り、フィードバックはまとめて伝える

確認依頼が届いたら、できるだけ早く対応します。修正点がある場合は、一度にまとめて伝えることで、やり取りの回数を減らし、効率的に進められます。「今日は1点だけ、明日また別の修正を」という対応は、制作会社の作業効率を下げ、結果的にスケジュールに影響します。

素材は早めに準備する

テキスト原稿や画像素材は、制作開始前または開始直後に準備を始めます。社内で分担して作業を進めると、負担を分散できます。どうしても準備が難しい場合は、制作会社に原稿作成や撮影を依頼することも検討しましょう。

制作会社とのコミュニケーションを密にする

進捗状況の共有や課題の早期発見のために、定期的な打ち合わせを設定することをおすすめします。週に1回、1時間程度のミーティングを設けることで、認識のズレを早期に発見できます。疑問点があれば、遠慮せずに質問しましょう。


まとめ

Webサイト制作は、ヒアリング・要件定義から始まり、企画・設計、デザイン、コーディング、テスト、公開、運用へと続く一連のプロセスです。一般的なコーポレートサイトであれば、3〜4か月程度の期間を見込んでおくとよいでしょう。

各フェーズは順番に進行し、前の工程が完了してから次の工程に進むのが基本です。途中での大幅な変更は、スケジュールや費用に影響するため、要件定義とデザインの段階で十分に検討し、合意を得ておくことが重要です。

発注者として重要なのは、「素材の準備」「確認・フィードバック」「社内調整」の3つを計画的に進めることです。制作会社に丸投げするのではなく、プロジェクトの一員として主体的に関わることで、期待通りのWebサイトが完成します。

初めて制作を担当する場合でも、全体像を把握した上で、制作会社と密にコミュニケーションを取りながら進めていけば、スムーズなプロジェクト進行が可能です。事前の準備と、各フェーズでの迅速な対応が、成功するWebサイト制作の鍵となります。

この記事からわかるQ&A

一般的なコーポレートサイトの制作期間はどのくらいですか?

20〜30ページ程度のコーポレートサイトの場合、企画開始から公開まで約3〜4か月が標準的な期間です。ページ数が少なければ2か月程度、100ページを超える大規模サイトでは6か月〜1年以上かかることもあります。

発注者側で準備が必要なものは何ですか?

会社概要や事業内容などのテキスト原稿、商品写真やスタッフ写真などの画像素材、ロゴデータなどが必要です。制作開始前に、何をいつまでに用意すればよいか、制作会社と確認しておきましょう。

デザイン確定後に変更を依頼することはできますか?

デザイン確定後やコーディング開始後の変更は、追加費用や納期延長が発生する場合があります。デザインの確認段階で、出来上がりをしっかりイメージして、修正依頼があればそのタイミングで伝えることが重要です。

スケジュールが遅れる主な原因は何ですか?

発注者側の確認作業の遅れ、制作途中での追加要望や仕様変更、素材準備の遅れ、社内調整の不足が主な原因です。確認期限を守り、要件定義の段階で必要な機能やページを洗い出しておくことで、遅延リスクを軽減できます。

公開後の運用は誰が行うのですか?

自社で行うか、制作会社に保守を依頼するかを事前に決めておく必要があります。CMSを導入していれば簡単な更新は自社で行えますが、セキュリティアップデートなど技術的な対応は専門知識が求められます。

引用・参考資料

  • TMCデジタル「ホームページ制作期間の完全ガイド|サイトタイプ別の目安期間と短縮方法を徹底解説」(https://www.tmcdigital.jp/column/web-design/website-schedule/)
  • Web幹事「10分で分かるWebサイト制作の流れ・期間|元Webディレクターがフロー図付きで解説【2026年最新版】」(https://web-kanji.com/posts/homepage-flow)
  • クライマークス「【工程別・サイト規模別】ホームページ制作期間の目安と短縮のコツ」(https://www.climarks.com/insight/20211227.html)
  • センタード「ホームページ制作にはどれくらいの期間がかかる?制作の流れや費用を解説」(https://www.centered.co.jp/blog/production-flow/)
  • スターティアラボ「Webサイト制作の発注で失敗しないために!事前準備でやるべきタスクをまとめました!」(https://bluemonkey.jp/media/column/web-task/)
  • 株式会社LIG「Web制作を発注する際に、事前に準備すべきものとは」(https://liginc.co.jp/250874)
  • 才流「Webサイト制作プロジェクトにおける、130の工程別チェックリスト|BtoB企業向け」(https://sairu.co.jp/method/2615/)
  • デパート「Webサイト発注の進め方。9ステップ」(https://depart-inc.com/blog/how-to-order/)
  • 株式会社ベイス「Webサイトの制作期間を短縮する5つのコツ!遅延

記事を書いた人

アストライド代表 纐纈 智英

アストライド代表。「左脳と右脳のハイブリッド」を武器に、人の心の深層に迫るインタビュアー。行政職員として12年間、予算編成や徴収業務に従事した「論理的思考(左脳)」と、音楽コンテストでグランプリを受賞するなど「芸術的感性(右脳)」を併せ持つ、異色のバックグラウンド。これまでに200社以上の経営者インタビューを行った経験を活かし、経営者すら気づいていない「言葉にならない想い」を引き出して映像化する。

私たちアストライドは、経営者のインタビュー映像の制作に圧倒的な強みを持っています。
課題や要件が明確でなくても問題ございませんので、お気軽にご相談ください。