基本ノウハウ
Webサイトのリニューアルを進める際は、基本的な制作の流れを理解しておく必要があります。しかしWeb担当者になって間もない方は、「何から手を付ければ良いか分からない」と悩むケースも少なくありません。
本記事ではWebサイト制作の流れを、5つのフェーズに分けて解説します。各工程にかかるおおよその期間も、あわせて紹介しています。ぜひ参考にしてみてください。
Webサイト制作の全体的な流れと、おおよその期間は下表の通りです。
| フェーズ | 内容 | おおよその期間 |
|---|---|---|
| 発注フェーズ | 【1】問い合わせやヒアリング 【2】提案内容や見積もりの比較 【3】依頼先の決定 |
約2～3週間 |
| 企画フェーズ | 【1】ターゲットと目的の明確化 【2】調査と現状分析 【3】コンセプトの決定 |
約2～3週間 |
| 設計フェーズ | 【1】要件定義 【2】サイトマップの作成 【3】詳細設計 |
約1～2カ月 |
| 作成・実装フェーズ | 【1】素材の準備 【2】デザイン 【3】コーディングとテスト |
約1～8カ月 |
| 公開フェーズ | 【1】Googleへインデックス申請 【2】社内外へお知らせ 【3】分析・改善 |
公開後～ |
ただし社内で自作する場合、発注フェーズは必要ありません。またWebサイトのページ数が多くなると、公開まで半年〜1年など時間もかかります。逆に1ページのLPであれば、1カ月前後でリリースが可能です。
Webサイトを制作する際は上記の期間を参考にしつつ、余裕のあるスケジュールを立てましょう。
ここからはWebサイト制作の流れを、5つのステップに分けて解説します。まずは外部へ制作を委託する場合に発生する、発注フェーズです。この段階では、次に挙げる3つの工程が必要になります。
それぞれ詳しく見ていきましょう。
発注フェーズではまず複数の依頼先をピックアップし、Webサイト制作について問い合わせます。依頼先としてよくあるのは、主に次の5つです。
問い合わせ後は作りたいWebサイト像をヒアリングされたのち、次項の提案内容や見積もりが出されます。ここで注意したいのは、依頼先へ丸投げしないことです。
外部へ制作を委託するとはいえ、理想とするWebサイトへ近づけためには発注側が主導権を握る必要があります。そのためには次項の【企画フェーズ】を先に進め、RFP（提案依頼書）の作成を完了しておくのも有効です。
RFPとは何か、どのような内容を盛り込むのか知りたい方は、こちらの記事もあわせてチェックしてみてください。
関連記事：「RFPとは？メリット・デメリット、作成時のポイントについて解説」
ヒアリング後に上がってきた複数社の提案内容や見積もりを、次のような評価項目をもとに比較します。
前述したRFPがあると、評価基準がハッキリするためより選別しやすいでしょう。
発注フェーズ最後の工程は、依頼先の決定です。基本的には【2】の評価・比較で、バランスが取れた提案内容の業者を選びます。
ただし依頼先によって、得意・不得意はさまざまです。そのため場合によっては、メインの依頼先で対応しきれない部分を別の業者へ依頼するケースもあります。
ここで注意したいのは、依頼先が増えるほど作業のグレーゾーンが発生しやすい点です。グレーゾーンを放置すると、担当不在や作業の未実施に気づくのが遅くなりスケジュールも押してしまいます。穴を埋めるために、想定外のコストが追加されることもあるでしょう。
このような事態を避けるためにも、Webディレクターなどと作業範囲や制作フローをよく確認することが大切です。抜け漏れを防ぎつつ、ダブりのない依頼先を慎重に決定していきましょう。
企画フェーズの流れは、次の通りです。
それぞれ詳しく見ていきましょう。
企画フェーズではまず、Webサイトのターゲットや目的を明確にします。具体的な例は、下表の通りです。
| ターゲット | 目的 |
|---|---|
| ・見込み顧客 ・既存顧客 ・潜在顧客 ・休眠顧客 ・リピーター ・取引先 ・求職者 など |
・販促 ・認知拡大 ・関係維持 ・アップセル/クロスセル ・応募者数増加 など |
自社に必要なWebサイト像は、次のようにターゲットと目的を掛け合わせて考えると見えてきます。
近年では「コーポレートサイト×採用サイト×サービスサイト」など、複数の目的を兼ね備えたWebサイトも増えています。ただし単一目的のサイトよりもページ数が多くなりやすいため、予算やリソースを踏まえて取捨選択していきましょう。
【1】のターゲットや目的を踏まえ、具体的にどのようなWebサイトを作れば良いかイメージできるよう、情報を集めて分析します。収集する情報の例は、次の通りです。
また競合サイトの分析も、自社サイトの制作方針を固める上で役立ちます。競合サイトの見つけ方や分析について知りたい方は、こちらの記事もぜひ参考にしてみてください。
関連記事：「競合サイト分析チェック必須の7項目｜流れから役立つ無料ツールまで解説」
企画フェーズ最後の工程はコンセプトの決定であり、主に次のような内容を言語化します。
Webサイトのコンセプトは設計フェーズ以降の基本方針になり、決定後の後戻りは難しくなります。制作途中で手戻りが発生しないよう、関係各所とすり合わせながら決めることが大切です。
なおコンセプトの言語化は、20字ほどのキャッチコピーで表現すると社内外に広めやすくなります。例えば当メディア・BeMARKEのキャッチコピーは、「BtoBマーケの力をあらゆる企業に」です。
制作中に迷いが生じたとき、コピーから実現したいWebサイト像を思い出せるようにすると良いでしょう。
設計フェーズの流れは、次の通りです。
それぞれ詳しく見ていきましょう。
要件定義では企画フェーズまでに決定した内容を踏まえ、Webサイトの仕様を言語化します。要件定義書に記載する項目は、主に次の9つです。
次にサイトマップを作成し、Webサイト全体の構造を可視化します。ユーザーの見やすさ・使いやすさ（UI/UX）に配慮し、階層構造は基本的に3段階までにしましょう。また目的の情報へスムーズにたどり着けるよう、ページ数が増えてもツリー構造を崩さないのも大切です。
階層構造が深くなりすぎる、あるいはツリー構造が崩れそうな場合は再度カテゴリ分類を整理しましょう。
設計フェーズ最後の工程は詳細を詰めること、つまり各ページの内容や要素の明確化です。Webサイト全体とは別にページごとのターゲットや目的を絞り、方向性がぶれないようにします。そうすることでユーザー満足度が向上しやすくなり、検索上位に表示される可能性が高まります。
上位表示させるために必要なSEO対策について詳しく知りたい方は、こちらの記事もぜひ参考にしてみてください。
関連記事：「SEOとは？用語の基礎知識を初心者にも分かりやすく解説」
またデザインはワイヤーフレームを作成し、コンテンツの位置や順番などを可視化・調整します。
システムは次のような判断軸で、導入・設計するものを検討します。
設計フェーズ後は実際の制作に入るため、詳細は可能な限り詰めてスムーズに開発を進められるようにしましょう。
作成・実装フェーズの流れは、次の通りです。
それぞれ詳しく見ていきましょう。
作成・実装フェーズでは、デザインコンセプト（デザインにおける要件定義）に沿ってテキストや画像などを準備します。デザインコンセプトで定める内容の例は、次の通りです。
素材はフリーサイトからそろえることも可能ですが、社内で準備するとオリジナリティが出ます。競合他社と差別化したい場合は、労力を惜しまず独自の素材を準備しましょう。
次に設計フェーズで作成したワイヤーフレームに沿って、準備した素材を組み込みます。ページ間でトンマナにズレがないか、UI/UXに問題はないかをチェックしながら進めることが大切です。
次のコーディングに支障を来さないよう、実装不可能なデザインになっていないかも要チェックポイントになります。デザインでは見た目のインパクトではなく、ユーザーの見やすさ・使いやすさを追求しましょう。
作成・実装フェーズ最後の工程は、コーディングとテストです。コーディングではフロントエンドとバックエンドに手を加えながら、デザインの実装を進めます。
このうちフロントエンドで行うのは、実際にユーザーが目にする・操作する画面の設定と調整です。またバックエンドはサーバーサイド構築とも呼ばれ、次のような作業を進めます。
実装が済んだあとに行うのが、表示や機能が仕様通りになっているかを確認するテストです。ここで問題がなければ、晴れて公開フェーズへと移ります。
公開やリリース後の流れは、次の通りです。
それぞれ詳しく見ていきましょう。
まずはGoogleサーチコンソールを利用し、Webサイトが検索時に表示されるよう申請します。
新規ドメインのインデックスは時間がかかる傾向にあるものの、URL検査ツールでクローラーの認識を促進することが可能です。インデックスの調べ方や対策について詳しく知りたい方は、こちらの記事もぜひ参考にしてみてください。
関連記事：「Googleにインデックスされない7つの原因とは？必要な期間・効果的な対策を解説」
Webサイトの公開後は、次のような方法で社内外へお知らせします。
集客の観点から考えると、連携させるWebマーケティング施策をあらかじめ検討しておくことも大切です。例えば認知拡大が目的のWebサイトであれば、潜在層にもアプローチできるSNSとの連動が効果的といえます。
企画フェーズで調査した競合サイトを参考に、流入が多いと推測される経路を中心に連携施策を検討すると良いでしょう。
公開フェーズ最後の工程であり、継続的に行うのが分析と改善です。Webサイトは、公開時点で完璧な形になっているわけではありません。ユーザーの利用状況を踏まえ、繰り返し改善しながら徐々に成果を上げていくものです。
そのため日頃からアクセス解析などでデータ収集し、定期的に分析・改善を進めることが大切になります。
Webサイト制作の流れは、発注から公開まで5つのステップを踏みます。各工程ではさまざまな職種と協力し、方針や具体的な内容を丁寧にすり合わせていくことが大切です。
また外部へ制作を委託する場合でも、実現したいWebサイト像を明確にしておく必要があります。限られたリソースと予算の中で、最大限の成果を引き出せる形の自社サイトを完成させるためです。
Webサイトの制作やリニューアルを進める場合は、基本的な流れを押さえて効率的に動きましょう。
