2021年11月2日

Webサイト制作の6つの流れと整理すべき重要ポイント

Webサイトを制作する際の流れは、大まかに企画フェーズと制作フェーズに大別されます。さらに、制作フェーズは6つのプロセス「調査・分析・企画」「設計・UI/UX」「コンテンツ・デザイン制作」「実装・システム開発」「リリース・保守運用」「評価・改善」に細分が可能です。

本記事では企画フェーズにおける３つのポイントと制作フェーズにおける６つのプロセスについて解説します。記事の最後でWebサイト制作の成否を左右する重要な要素についても触れるので、Webサイトを制作する際の参考にしてください。

コーポレートサイト制作について
クライマークスのソリューションを見る

1.Webサイト制作を始める時に整理しておきたい3つのポイント

Webサイト制作の企画フェーズにおいては、「目的の明確化」「ターゲット像の定義」「体制・予算・計画の確立」の３つを整理しておくことが重要です。それぞれのポイントについて以下で解説します。

1-1.目的を明確化する

Webサイト制作の企画フェーズにおいては、まず「何のためにWebサイトを制作するのか」といった目的を明らかにしなければなりません。企業のWebサイトに多い目的としては、「自社製品やサービスの認知向上」「潜在顧客から見込み顧客への育成（リードナーチャリング）」などがあります。

Webサイトを制作する目的を明確化すれば、そこから逆算して、やるべきことや取り組むべき課題もはっきりしてきます。そこから、成果を挙げられる有意義なWebサイトの確立が可能です。一方、Webサイトを制作する目的が曖昧なままでは、企画フェーズ・制作フェーズにおいて方向性が定まらないため、具体的な成果につながりません。

1-2.ターゲット像を定義する

次に、Webサイトのターゲットを絞り込んで明確に定義し、具体的かつ詳細なペルソナ像を設定する必要があります。もし、Webサイトのターゲットを明確にしないままで制作するとしたら、どのような人のニーズも満たさないWebサイトになりかねません。

ターゲットをしっかりと定義することによって、以下のようなターゲットの目線に立ったWebサイトを制作する意識が働きやすくなります。

• ターゲットにとってわかりやすく有意義なWebサイトを制作する
  （ターゲットが求める情報を見つけやすいなど、Webサイトを訪問したニーズを満たしやすい構造にする等）
• 申し込みや問い合わせ、購入といったターゲットのニーズをスムーズに満たすための訪問経路・CV（コンバージョン）導線を設計する

ターゲットの絞り込みやペルソナ設定において定義すべき項目は、一般的には以下のような項目ですが、B2C/B2Bや業界/ジャンルによって着目すべき項目は変化します。

• 年齢
• 性別
• 職業
• 所得・資産
• 居住地
• 家族構成
• 趣味・志向
• 悩み・ニーズ

このように多彩な属性を明確に定義することによって、ターゲットへの訴求力が高いWebサイトを企画できます。

1-3.体制・予算・計画を確立する

体制の確立とは、社内外においてWebサイトの企画・制作や運用に関わるメンバーを構築することです。

まず、社内のリソースからマーケターやWeb制作担当者、サイト運用担当者などをアサインします。次に、社外の制作会社の選択が必要です。ある程度、規模の大きな会社でWebサイトを制作する場合は自社で制作することは少なく、一般的には制作会社に依頼します。

Webサイト制作の予算を見積もる際は、以下の項目を洗い出し、それぞれの予算を事前に確保しましょう。

• 制作会社に支払う費用
• サーバーやドメイン、SLLなどの年間利用費用
• Webサイト関連サービス（アクセス解析サービス・マーケティングツール・CMSパッケージなど）の導入費用

Webサイト制作の計画においては、ターゲットや競合の調査・既存サイトのアクセス分析・制作などの各工程にかかる期間を見積もったうえで、スケジュールを立てておく必要があります。

2.Webサイト制作の6つの流れ

Webサイト制作の流れは以下6つのプロセスです。

• 1.調査・分析・企画
• 2.設計・UI/UX
• 3.コンテンツ・デザイン制作
• 4.実装・システム開発
• 5.リリース・保守運用
• 6.評価・改善

各プロセスについて以下で解説します。

2-1.調査・分析・企画

まず、想定するターゲットの行動やニーズ、競合サイトなどの調査が必要です。さらに、自社の既存サイトがある場合はアクセス状況やユーザー行動、事業の実績からわかる顧客属性やニーズなどの分析を行います。それにもとづき、事業の抱える課題やその解決策も探り出しましょう。

次に、上記の調査・分析の結果やWebサイトの制作目的、ターゲット像などを踏まえつつ、Webサイトのコンセプトを企画します。Webサイトのコンセプトはコンテンツや構造設計、デザインなどWebサイト制作の全般に関わるガイドラインとなるため、とても重要です。

それから、Webサイト制作の計画書（要件定義書）を作成しましょう。計画書にはWebサイトの概要、制作要件とシステム要件、課題、スケジュール、制作体制などを組み込みます。

2-2.設計・UI/UX

Webサイトの設定にあたっては階層を整理し、全体の構造を設計してサイトマップに落とし込みます。その際はUI/UXの最適化や導線設計を意識しましょう。

UI（ユーザーインターフェース）とはWebサイトのデザインや視認性、操作性など、Webサイト訪問者に「わかりやすさ」「使いやすさ」を提供するものです。また、UX（ユーザーエクスペリエンス）はWebサイトを通じた顧客体験全般を指し、UIもUXに含まれます。

UI/UXの最適化は、Webサイトを訪れたターゲットユーザーはスムーズにニーズを満たすために重要です。また、CV（コンバージョン）達成や離脱防止にもつながります。

導線設計においては、ユーザーが求める情報へスムーズに辿り着けるような設計を意識しましょう。ユーザーの目に触れる個別ページ画面の設計については、コンテンツやボタンの配置などの画面設計図（ワイヤーフレーム）を作成します。画面設計図をもとにコンテンツの素材や原稿などの用意も開始してください。

2-3.コンテンツ・デザイン制作

Webサイトの企画にもとづき、ターゲットの属性による訴求効果も意識したうえで、Webサイト全体に共通するデザインのコンセプトを決めます。デザインコンセプトはWebサイトに使用するフォントやカラースキーム、レイアウト、画像素材、テキスト（文章）といったビジュアル要素を選定し、配置する際の基準となるものです。制作会社によってはデザインのトンマナ（トーン＆マナー）策定やデザインガイドラインを作成依頼することも可能です。

Webサイトに掲載するコンテンツには動画・画像やイラスト、テキストなどさまざまな方法があります。ターゲットの属性に受け入れられやすいコンテンツや内容を選ぶことが大切です。ターゲットに伝えたいコアメッセージを整理したうえで各コンテンツを制作しましょう。

テキストの書き方についても、トーンや文体、表記ルールなどのレギュレーション整備が必要です。デザインだけでなく、Webサイト全体の文章表現に一貫性を持たせることによって、訪問者は違和感を覚えることなくWebサイト内を回遊してくれます。

2-4.実装・システム開発

企画した通りのビジュアルや機能を備えたWebサイトになるように、システム開発と機能の実装が必要です。システム開発は「フロントエンド」部分と「バックエンド」部分に分かれます。

「フロントエンド」の開発においては、主に、HTMLやCSS、JavaScriptといったプログラミング言語を使って、Webサイトを訪問したユーザーの目に直接触れるビジュアルを調整します。Webサイトの閲覧環境はユーザーによって異なるため、どのような端末、OS、ブラウザで閲覧しても適切に表示するためにHTMLコーディングが重要です。HTMLコーディングはWebサイトの表示速度やSEO（検索エンジン最適化）、更新作業や運用のしやすさなどにも影響します。

「バックエンド」開発はユーザーの目には触れないWebサイトのプログラムを構築する作業です。日常的に更新することが前提のWebサイトであれば運用を考慮し、WordPressなどオープンソースのCMSを使う場合もあれば、オリジナルのシステムを構築する場合もあります。また、サーバーや社内システムとの連携といったインフラ部分の設計も重要です。

2-5.リリース・保守運用

Webサイトをリリースする前に、動作検証（デバッグ）やブラウザチェックといったテストを実施します。テストにおける主なチェックポイントは以下の4つです。

• 1.サーバーやネットワーク、データベースは正常に機能するか
• 2.主要な複数ブラウザで正常に動作するか
• 3.パソコン、スマートフォン、タブレットなどマルチデバイスで正常に動作するか
• 4.問い合わせフォームや検索機能などのシステム要件は問題ないか

テスト後は見つかったバグの修正を行うため、あらかじめ修正期間もスケジュールに組み込んでおく必要があります。要件定義書に記載された項目を満たすWebサイトが完成て初めて本番公開となります。自社サイトやSNS、場合によってはプレスリリースで新しいWebサイトをリリースした旨の周知を図ることも大切です。

2-6.評価・改善

Webサイトをリリースした後も、アクセス状況やCVR（コンバージョン達成率）の監視を継続したうえで、システムの微調整やコンテンツの更新を継続していくことが重要です。Webサイト制作と並行して、アクセス解析ツールの導入などWebサイトの保守運用を行う体制も、事前に構築しておく必要があります。

アクセス解析は定期的に行いましょう。そのうえで、「CVRをより高めたい」「目的のページの閲覧率を上げたい」「SEOによる流入を増やしたい」といったWebサイトの課題を洗い出し、追加施策を講じていかなければなりません。

また、必要に応じてコンテンツの配置を変更したり、テキストのリライト（修正加筆）をしたりといったコンテンツ内容のメンテナンスも実施していきましょう。

3.Webサイト制作の成功を左右する重要な要素

Webサイト制作が成功するかどうかは主に3つの要素で決まります。

• 1.マーケティング・戦略思考
• 2.技術力
• 3.体制・制作会社選び

各要素について、以下で解説します。

3-1.マーケティング・戦略思考

Webサイトとは、ターゲットに向けて情報を発信し、何らかの成果につなげるための装置です。予算や工数、人材といった貴重なリソースを投入する以上、目的を達成するための戦略をしっかりと練っておく必要があります。

具体的には、マーケティングリサーチなどによって「どのような人をターゲットとするか」を明確化したうえで、「ターゲットに対し、どのような価値を、どのように提供するのか」を整理し、戦略を立てることが重要です。さらに、KGI（重要目標達成指標）やKPI（重要業績評価指標）など、目標達成度の計測指標にもとづく数値目標を定め、両者を達成する道筋を立てておく必要があります。

3-2.技術力

Webサイトを構成する要素には、ユーザーの目に見えるデザインや画像・動画、テキストといったフロントエンド要素と、システムやサイト構造などユーザーには見えないバックエンド要素があります。企画した通り、ユーザーに分かりやすく使いやすい訴求効果のあるWebサイトを実現させるためには、フロントエンド要素とバックエンド要素の両方において高い品質が必要です。

つまり、Webサイトにおいてユーザーに高い価値を提供するためには、良い企画だけでは足りません。各要素を高い水準で完成させるために、実績に裏付けられた専門的な技術力が求められるのです。

3-3.体制・制作会社選び

上記の戦略思考や技術力に優れたデザイナーやマーケター、エンジニアなどが社内におり、Webサイトの制作・運用に十分に参加できるリソースはあるでしょうか。社内でそういったリソースを確保することが難しい場合は、外部の制作会社に委託する必要があります。

制作会社を選ぶ際は、技術力や対応範囲（コミットメント）、過去実績を基準にするとよいでしょう。コミットメントとは、「企画・リサーチ段階から参画してくれるか」「制作面だけでなく、経営課題も踏まえたうえで提案してくれるか」といった関わり方です。また、過去実績をみれば、制作会社のレベルや自社のイメージとの相性などを測る際の参考になります。

4.まとめ

Webサイト制作においては、マーケティング戦略にもとづいた目的の明確化やターゲットの定義、制作・運用の体制作りや予算設定といった企画が重要です。また、企画で目指した通りのWebサイトを実現するために、高い技術力も欠かせません。一般的に、社内のリソースだけで優れた企画や制作のすべてを行うことは困難です。そのため、豊富な実績と高い技術力を備え、企画・リサーチ段階からのコミットメントや経営課題まで踏まえて提案をしてくれる制作会社に依頼するほうがよいでしょう。