Webサイト制作の流れと進め方完全ナビ！【図解で掴むタスクとプロセス】

Webサイト制作を依頼する際、
『どのように進めればよいのか分からない』『具体的な流れがイメージできない』
と感じる方は多いのではないでしょうか？

このコラムでは、Webサイト制作の全体的な流れやステップを図解でわかりやすく解説し、プロジェクトがスムーズに進むためのポイントをお伝えします。
記事を読むことで、制作プロセスに対する先の見えない不安が解消され、理想のWebサイト実現の第一歩を踏み出すお手伝いができれば幸いです。

Webサイト制作に必要な事前準備

Webサイト制作を依頼する前に、大まかな概要を整理しておくことはとても重要です。
事前準備をしっかり行うことで、制作会社とのコミュニケーションが格段にスムーズになり、手戻りや認識齟齬などのリスクを大幅に減らすことができます。

以下は、事前準備における依頼元の3つの代表的なタスクです。

1. Webサイトの目的とターゲットの明確化

目的によってサイトの種別は異なり、制作の考え方も様々です。
例えば以下のように、Webサイトの目的によって、制作するサイトの種類や進め方は大きく異なります。

サイト種別	目的例
コーポレートサイト	企業価値を高め、投資家目線でIR情報を強化したい
採用サイト	理想の人材にアプローチし、採用活動を促進したい
ECサイト	顧客体験を向上し、売り上げを伸ばしたい

Webサイト制作には様々な意図や目的が込められるからこそ、まずは何を重視するのかを整理することが重要です。目的や自社のターゲット、優先事項を明確にすることで、制作会社に具体的な要望を伝えやすくなり、
スムーズなコミュニケーションにつながります。

2. 対象範囲とページボリュームの把握

対象となるぺージやどのような機能が必要かを考えておきましょう。

・必須のページ（会社概要、製品情報、ニュース、株主・投資家向け情報など）をリストアップする
・既存サイトがあれば、現状の改善点を洗い出しておく

具体的な希望を伝えることで、制作会社から最善の提案を得られます。

3. 予算と納期の設定

予算と納期はプロジェクト全体を左右する重要な要素です。
この後述べるWebサイト制作の流れと全ステップにも影響します。

短納期の場合、要員を追加したり、優先順位を明確にして効率的に進める必要があります。
十分な期間が確保できれば、より細部にこだわった制作が可能です。

Webサイト制作の流れ【フロー図】

次に、Webサイト制作の全体像をご説明します。
Webサイト制作は、主に以下の4つのステップで進行します。

制作の流れ

STEP１　課題抽出・要件整理・RFP用意
▼
STEP２　発注候補先の選定、コンペ
▼
STEP３　企画・設計
▼
STEP４　制作・実装
サイトリリース

所要期間の目安

プロジェクトの規模や内容により変動しますが、一例として目安期間をご紹介します。

STEP（工程）	期間目安
STEP 1・2（要件整理・選定）	約2ヶ月ずつ
STEP 3・4（設計・制作）	約4ヶ月

以下では、それぞれのステップについて詳しく説明します。

STEP１　課題抽出・要件整理

Web制作における目的や要求事項の整理といったプロジェクトの基盤となる序盤のステップです。
先のチャプター「事前に準備しておきたい情報」で述べた内容のほか、以下のような様々な準備が必要です。

準備項目	タスク例
課題の抽出	現行サイトに対する不満や改善希望の取りまとめ
システム把握	現行システムの仕様や必要な機能の整理
関係者の合意	プロジェクトに関与する各部署からの意見収集
RFP（提案依頼書）作成	要件を正確に伝えるためのドキュメントの準備

※RFPは、後項でご説明する”依頼先の選定作業”において重要な役割を果たします。

整理すべきポイントは、以下のコラムで詳しくまとめております。
Webサイトリニューアルを成功させる「要件定義」の進め方と内容

STEP２　発注候補先の選定・コンペ開催

制作会社はプロジェクトの成否を左右する存在であるため、委託先の選定はWeb制作の流れにおいて重要なステップです。

まずは複数の制作会社に問い合わせを行い、自社の目的を達成するための技術力や得意分野などを確認します。
提案依頼を行う際には、情報のばらつきを防ぐためにRFP（提案依頼書）を共有し、同じ条件での見積もりや提案を依頼します。
その後、提出された提案内容を納期、費用、クオリティといった観点から比較・検討し、最適なパートナーを選定します。

コンペの進め方や手順については以下のコラムをご参照ください。
Web制作会社選定にコンペは有効？失敗しない進め方と準備の手引

RFP作成に役立つテンプレートと記入例については、以下よりご請求いただけます。
RFP記入サンプルとテンプレート

STEP３　企画・設計

委託先の制作会社が決まった後は、提案内容をもとに、目的達成に向けた詳細な計画を立てます。
この段階はプロジェクト全体の方向性を具体化するステップです。

例えば、以下のような「事前に準備しておきたい情報」の再確認や、より詳細な定義を行います。

・誰をメインターゲットとするのか
・サイト全体のトンマナ（トーン＆マナー）をどう設定するか
・キーワード選定や、サイト構造などSEO/集客施策の方針はどう定めるか
・ユーザビリティを重視したUX（ユーザー体験）や、誰にでも使いやすいアクセシビリティ対応を進めるのか

これらはSTEP1で大まかに整理されていますが、企画・設計フェーズでは方法や精度をさらに詳細に話し合います。

この工程で定めた方向性を制作会社が取りまとめ、以下のようなドキュメントを作成することが一般的です。

1. サイトマップ

サイトの全体像やページ構造を可視化し、情報の整理を行います。

2. 要件定義書

制作会社と依頼者の間で認識齟齬を無くし、必要な機能や、要件を明確にします。
SEO、UX（ユーザー体験）、アクセシビリティなど、細かな方針もこの段階で確定します。

3. デザインガイドライン（デザイン方針の定義書）

ターゲットや目的に基づき、Webサイトのクリエイティブやトーンを具体化します。

制作会社がこれらの要素を取りまとめたドキュメントを作成し、プロジェクト全体の指針として活用します。
この企画・設計フェーズを丁寧に進めることで、プロジェクトがスムーズに進み、要望通りの成果物が期待できます。

STEP４　制作・実装

いよいよWebサイトの形を作り上げるフェーズです。
基本的に制作会社が構築を実行し、依頼元の企業担当者は内容のチェックや素材の提供を行います。

具体的には以下のように進行します。

各工程で把握すべき点やチェックポイントは以下になります。

①画面設計

ワイヤーフレームにより、ページを構成する要素やレイアウト、導線の位置や強弱、コンテンツのボリューム感など把握。

②デザイン作成

ターゲットが目にするビジュアルを具体化。ターゲット目線でクリエイティブを確認。

③コーディング

微妙な動きや挙動の速度等の確認とともに、原稿や画像のチェック。

④システム組み込み

要件定義と同じ内容が実現されているかをチェック。

⑤テスト・リリース

全体のチェックを行い、問題がなければ公開。

各工程で適宜チェックを行い、リリース後のトラブルを防ぎます。

Webサイト制作費用

Webサイトの制作を進めるうえで、制作コストは大きな関心事だと思います。
制作費用は、以下の要素によって大きく変動します。

1.ページボリューム

一般的にページ数と費用は比例します。
また、ページの種別によって（例：コーポレートサイト、ECサイト等）制作コストが異なります。

2.要件の複雑さ

高度な機能やシステム連携が必要な場合、コストが増えます。

3.デザインとクオリティ

オリジナルデザインかテンプレートを使用するか、デザインのクオリティで変わります。

4.納期

短納期の場合、追加リソースが必要になるため費用が増加する場合があります。

Webサイト制作後の運用が重要

ここまで制作の流れをご紹介しましたが、Webサイトは公開後の運用フェーズが重要です。
新規構築やリニューアルプロジェクトは平均して1年ほどですが、運用は数年単位で実施するため、更新に関する方針も予め立てておくことが理想的です。

Webサイトの運用を成功させるポイント

定期的な更新計画

ニュース、イベント情報、コラム、採用情報などを継続的な更新が必要なコンテンツについて、計画を立てておく。

データ分析と改善

アクセス解析を活用し、ユーザー行動を把握。課題を洗い出して必要な改善を加える。

セキュリティ対策

CMSやプラグインのアップデート等により、常に最新のセキュリティを維持する。

注意点

運用に必要な体制やコストも、制作段階で見越しておきましょう。
運用サポートを提供する制作会社を選ぶと、負担を軽減できます。

運用に関する以下のコラムも合わせてご覧ください。
Webサイト運用とは？目的や費用、内製・外注の違い、業者選定のコツ

よくある失敗とWeb制作会社に依頼する際の注意点

Webサイト制作は、委託するパートナーも、非常に重要です。
以下によくある失敗例とその解決策を挙げましたので、参考にしてください。

よくある失敗例

・コストで選んだが、デザインやシステムの品質が不安定

解決策：費用だけでなく、ポートフォリオ等で実績や技術力もチェック。

・途中で担当者がいなくなり、プロジェクトが中断

解決策：体制が整備されている制作会社は、プロジェクトが頓挫するリスクが低く、会社全体でプロジェクトを管理しているか確認。

・コミュニケーション不足

解決策：初期段階での対応力やレスポンスの速さを確認し、定期的なミーティングで進捗確認や認識ズレがないか把握。

依頼時に、運用サポートやアフターフォローの有無を確認し、安心して任せることができる制作会社を選びましょう。

当社のWebサイト制作実績紹介

株式会社ツムラ 様 事例

コーポレートサイト、採用サイト、ブランドサイトを一新

【プロジェクト内容】
サイトの課題分析 / 要件整理やRFPとりまとめ / 企画設計 / 制作・実装

京王電鉄株式会社 様 事例

アクセシビリティに対応し、全ての方が使いやすいサイトへ

【プロジェクト内容】
要件整理やRFPとりまとめ / 企画設計 / 制作・実装

東ソー株式会社 様 事例

コーポレートサイトの機能に加え、スクラッチで資料DLシステムを開発

【プロジェクト内容】
要件整理やRFPとりまとめ / 企画設計 / 制作・実装

まとめ

ここまでお読みいただきありがとうございます！
情報量が多くなりましたが、Webサイト制作の進め方や発注者視点で知っておくべきことなど、理解を深めていただく一助となったでしょうか？

当社は、Webサイト制作・デジタル戦略全般におけるサービス提供で約25年の実績と豊富な経験を有するウェブ制作会社です。

デザインクオリティはもちろんのこと、ただ見た目が綺麗なサイトを提供するだけではなく、
目的達成を第一に置いた企画戦略を得意としておりますので、Web戦略・サイト制作の進め方など、お困りごとがあればぜひお気軽にご相談ください！

Webサイト制作等　サービス一覧ページ