マーケティングBLOG
Webサイト構築の手順とポイントを完全解説！マーケティング～要件定義、リリースまでの全工程を公開！
2023年11月21日
Share
導入実績700サイト以上!!
「カスタメディア」の事例ダウンロードは
こちら
本記事ではwebサイトの構築を考えている方に向けて、次のような内容を詳しく解説しております。
・webサイトを構築する手順
・webサイトを構築に必要な費用、期間、構築後の対策
・webサイトを構築する際の注意点
新規事業担当者、マーケティング担当者、そして起業をする方のなかには、Webサイトの構築に携わなければならない方も多いでしょう。
Webサイトの種類は目的に応じて、企業のホームページ（コーポレートサイト）、商品・サービスサイト、広告用のページ、コミュニティサイトなど、さまざまです。
どんなWebサイトを構築するにしても、本来の目的を達成することが重要です。
そして、目的、目標が決まったら、スムーズにスピーディにWebサイトを構築したいですよね。
今回の記事では、初めてWebサイトの構築に携わる方はもちろんのこと、すでに経験されている方にも改めて確認してほしい目的達成のためのWebサイト構築の手順とポイントを解説いたします。
＼ 今すぐ、マッチングサイト構築をご相談したい方は下記をクリック ／
目次
‐ 1.要件定義
‐ ①目的を定めて企画する
‐ ②ターゲットを選定する
‐ ③Webでの検索キーワードの内容、検索回数を調査・分析する
‐ ④成果のシミュレーションを行う
‐ ⑤Webサイトのコンセプトを決定する
‐ 2.予算の決定
‐ 3.RFPの作成
‐ 4.サイトの構築
‐ ①サイト構造の設計
‐ ②ワイヤーフレームを作成する
‐ ③デザイン作成
‐ ④サーバーの契約、ドメインの取得・設定、SSLの取得・設定
‐ ⑤コーディング
‐ ⑥システム開発
‐ ⑦テストをおこなう
‐ ⑧リリース（サイト公開）
‐ 5.リリース後の運用支援、seo対策など
‐ 6.Webサイト構築に必要な期間
‐ 7.Webサイト構築に必要な費用
‐ ①Webサイト構築に必要な費用の内訳
‐ ②Webサイト構築に必要な費用の相場
‐ 8.Webサイトを構築する際の注意点
‐ ①目的やターゲットを曖昧なまますすめない
‐ ②具体的な数値目標を設定する
‐ ③イメージにあったデザインにする
‐ ④スマートフォン（レスポンシブ）に対応する
‐ ⑤著作権を確認する
‐ ⑥SSL対応をする
‐ ⑦地道に改善する
‐ 9.いまさら聞けないWebサイト制作の基礎知識
‐ ①Webサイトとは？ホームページとの違い
‐ ②Webサイト制作の種類
‐ 10.webサイト制作の手段
‐ ①ホームページ作成ツール等を使って自作する
‐ ②制作会社に依頼する
‐ 11.まとめ
基本的に1ページの広告用ランディングページから数千ページにおよぶ大規模なWebサイトまで、規模の大小はあれど、基本的な流れは変わりません。
各タスクにかける時間、粒度、深堀りが変わるだけです。
1.要件定義
Webサイト構築の手順として最初に挙げられるのがこの要件定義ですが、要件定義を定めるためにもやらなければならないことがたくさんあります。
①目的を定めて企画する
まずは、基本的なことですが、Webサイトを構築して何を実現したいのか、目的をはっきりとさせておきましょう。
Webサイトを構築すること自体は、目標を達成するための手段に過ぎません。
しっかりと、何を実現したいのか定め、プロジェクトの成功が何なのかということをはっきりさせることで、プロジェクト全体の意思決定をスムーズにすすめることができます。
②ターゲットを選定する
要件定義において、最も大切なことはターゲットの設定です。
ターゲットの選定というと、ペルソナを活用し具体的なターゲット像を作り出していくことだと考えている方もいらっしゃるでしょう。
もちろん、より具体的にターゲット像を作ることも重要です。
ただ、それだけでなく、ターゲットが市場にどれくらいの数、割合いるのかもしっかりと調べておく必要があります。
また、競合他社がどれくらいのシェアをとっているのか、自分たちがどれくらいのシェアをとりにいけるのか、ありとあらゆるデータを検討しましょう。
③Webでの検索キーワードの内容、検索回数を調査・分析する
Web上では、Google広告が提供しているキーワードプランナーというツールで、グーグルでどのようなキーワードがどれくらいの数検索されているのかを調べることができます。
想定される検索キーワードの候補をできるだけ多く、多角的に調査していきましょう。
たとえば、
- 売り出そうとしている商品、サービスの商品名による検索回数（指名系）
- 用途や使用方法
- 商品、サービスを使用することで解決される悩み
これらの検索回数、さらに、Facebook、Twitter、Instagramでどのような話題がどれくらい拡散されているのかなどの数値を合わせたものが、Web上での購買、お問い合わせの数の参考数値となります。
また、どのようなコンテンツを作成するべきかの指標となります。
検索回数、SNS上での数値が少ない場合は、そもそもWeb上で訴求するのは向いていない商品・サービスかもしれません。
オフラインも含めたWebサイト構築以外の方法を検討する必要があるでしょう。
④成果のシミュレーションを行う
②で、Web上の検索回数、SNS上の数値を算出できたら、実際にどれくらいの成果を得られるのか、数値のシミュレーションをしてみましょう。
シミュレーションは３か月ごとに、半年、年間とたてていくと、シミュレーションの成果をわかりやすくまとめることができます。
指標としては、最低でも下記をシミュレーションし、いつ損益分岐点を超え、利益があがっていくのかしっかりとシミュレーションしましょう。
＜費用＞
- Webサイト構築にかける予算
- 広告費
- 人件費（かかわる人数）
など
＜売上・利益＞
・成果によってあがる売上、利益
など
⑤Webサイトのコンセプトを決定する
Webサイトのコンセプトを決めましょう。
コンセプトはWebサイトの構築を進めるために、プロジェクトに関わる人たち（上司、ディレクター、デザイナー、エンジニアなど）の意思統一を図るのに必要です。
コンセプトと言うと、なんだか少し抽象的で曖昧です。
「concept」には、概念・発送・構想といった意味がありますが、それでもまだ曖昧ですね。
ここでは、Ｗebサイト構築に必要な具体的なアウトプットを明確にしておきましょう。
コツとしては、よくある5W1Hではなく、6W2HのほうがWebサイトの構築プロジェクトでは向いているでしょう。
・Webサイトのキャッチコピー
・Webサイトの名前
・Webサイトのベースとなるカラー
・ページの公開日
・6W2Hでまとめる
-When（いつ）：どのタイミングで
-Where（どこで）：サイトを利用するシーン
-Ｗhom（だれに）：ターゲット
-What（何を）：どの商品・サービス、何を訴求するのか？
-Why（なぜ）：意義、Webサイトをターゲットが利用することで何を実現するのか？
-How（どうやって） ：
-How much（いくらで）：実現する予算
以上をコンセプトとして、決めておきましょう。
2.予算の決定
ここまでの過程では、予算は仮でたてた予算だと思います。
③の成果シミュレーション、④のサイトコンセプトを元に、予算を確定させましょう。
3.RFPの作成
ここまでシミュレーションが出来たらRFP（提案依頼書）の作成をしましょう。RFPを制作会社に送れば、プロの視点からより具体的なサイト構築の提案を行ってくれます。「どのように書けばわからない」という方は当サイトの該当記事を参考に、ぜひ作成してみてください！
4.Webサイト構築の手順
①サイト構造の設計
いよいよ、Webサイトを構築・制作するための具体的な作業に入ります。
サイト構造の設計では、どのようなコンテンツをどこに表示させるかを設計します。
Web上でのキーワードの検索回数（1-②の工程）などを参考にしながら、サイトコンセプトに沿って設計しましょう。
サイト設計の主なアウトプットとしては、サイトマップ（サイト構成図）があります。
サイトマップとは、各ページのタイトル、URL、サイトの構造をエクセルなどでまとめた図です。
XMLサイトマップとは別物ですので、ご注意ください。
②ワイヤーフレームを作成する
サイトマップを作成したら、ワイヤーフレームを作成しましょう。
ワイヤーフレームとは、各Webページごとに、見出し、テキスト、図を配置するかを決めていく作業です。
Webサイトを訪れるユーザーの動き、何を見て、どのようなアクションをしてほしいのかを想定して作成しましょう。
ワイヤーフレームを作る際には、以下のツールを使用すると便利です。
・Adobe XD
（商品ページ：https://www.adobe.com/jp/products/xd.html）
Adobe社が提供するUX/UIの共同作業ツールです。
枠を作る、テキストを配置するといったワイヤーフレームを作る際の作業をカンタンな操作でできます。
ツールを使いこなせる人は、デザインやリンク構造まで作りこむことで、モック（試作サイト）まで作ることができます。
・Power Point
（商品ページ：https://www.microsoft.com/ja-jp/microsoft-365/powerpoint）
言わずと知れたマイクロソフト社が提供するプレゼンテーション資料作成ツール。
パワー・ポイントでもワイヤーフレームを作成することができます。
最新版はカンタンに枠、テキストなど配置することができるので、Adobeなどのツールを使用したことがない人は、パワー・ポイントでワイヤーフレームを作成するのもよいでしょう。
③デザイン作成
ワイヤーフレームを作成したら、次はデザインを作成します。
Webサイトのコンセプトに合わせて、ワイヤーフレームを元にデザインを作成しましょう。
デザイナーに依頼する場合などには、ベースカラーのほか、メインカラー、アクセントカラーなどの配色を決めておくと、デザインのイメージも伝わりやすくなります。
また、デザインの参考になるサイトをピックアップし、事前に関係者に共有をしておくものよいでしょう。
デザインでよく使われるツールがAdobe Photoshop、Adobe Illustratorといったツールになります。
④サーバーの契約、ドメインの取得・設定、SSLの取得・設定
デザインが終わったらコーディング作業に入るのですが、その前にまずはサーバーを契約しておきましょう。
自前でサーバーを立てる人もいるかと思いますが、ほとんどの企業、個人はレンタルサーバーを契約するでしょう。
さくらインターネットや、Amazonウェブサービスなどが有名です。
そして、同時にドメインの取得・設定、SSLの取得・設定を行いましょう。
⑤コーディング
サイト設計、ワイヤーフレームの作成、デザインの作成が終われば、次はいよいよコーディング作業に入ります。
コーディングとはプログラミング言語を使って、デザインした通りにWebページをブラウザに表示させるための作業です。
HTMLなどの言語を使って、ソースコードを書いていきます。
また、Webデザインの装飾をしているのは、CSSという言語になります。サイト上に動きをつける場合にはJava Scriptなどを使います。
⑥システム開発
コーディングと同時に平行していくのが、システム開発です。
いわゆるプログラミングという作業になります。
Webサイトに顧客管理システムや、ショッピングカート、決済機能などが必要な場合など、HTMLとCSSだけでは実現できない機能が必要な場合には、システム開発の工程が必要となります。
⑦テストをおこなう
コーディング、システム開発が部分的、またはすべて終わったときあとは、テストを行います。
テストでは、表示の崩れ、事前に想定していた動きをしているかを検証していきます。
表示崩れや、想定外の動きをしている場合には、修正作業が入ります。
全体のスケジュールを決める際には、修正作業の時間を想定し、余裕をもって決めましょう。
⑧リリース（サイト公開）
テストも終わり、不具合が解消されたら、いよいよサイトリリースです。
契約したサーバーに、各ファイルをすべてアップロードして完了です。
リリース時にはシステムの作業が入る場合もありますので、その時間も考慮して時間を決めておきましょう。
また、リリースした後も、思わぬ不具合が発生することもありますので、リリース日は休日の前日などはやめておきましょう。
5.リリース後の運用支援、seo対策など
Webサイトをリリースしたら、それで終わりというわけではありません。
むしろ、リリースをしてからが始まりです。
Webサイトを構築した本来の目的は、リードの獲得や、PRなどです。きちんと目的が達成されているか、効果がでているか、効果計測をしながら更新業務をしていく必要があります。
Webサイトの運用業務は、主に以下のような業務です。
- ドメイン、サーバーの管理
- コンテンツの更新、編集
- Webサイトの分析、改善
- お問い合わせの管理
Webサイトの種類、目的によって内容は変わりますが、おおむね上記のような業務となります。
特に重要なのは、分析です。
Webサイトはサイト単体では大きな成果を得ることはできません。
分析をおこない、広告の運用、メルマガ、SNSの施策と連動して、目的を達成していきましょう。
詳しいwebサイトの運用については下記の記事を御覧ください
▶Web担当者は必見！ Webサイト運用って何をするの？成果をあげるための運用方法は？
6.Webサイト構築に必要な期間
これまでWebサイト構築の流れについてご説明しましたが、Webサイト構築に一体どれくらいの時間が必要なのでしょうか。
もちろん構築するWebサイトによって必要な時間は異なります。
LP(ランディングページ)のような数ページのサイトであれば数日で構築ができますが、小規模のコーポレートサイトであればおよそ3か月、100ページ以上ある大規模なコーポレートサイトやショッピング機能、決済機能などのシステムを搭載するとなると、半年以上必要な場合があります。
| サイトの規模 | 構築に必要な時間 |
| LPなどのWebサイト | 数日から数週間 |
| 10ページから30ページほどの小規模サイト | 1か月から3か月程 |
| 100ページ以上や複数のシステムを搭載した大規模なサイト | 半年以上 |
7.Webサイト構築に必要な費用
Webサイトの構築にどのくらいの費用が必要なのか、内容と相場を紹介します。
①Webサイト構築に必要な費用の内訳
Webサイト構築には下記のような費用が必要となります。
●サイト制作費(、ディレクションやデザイン、コーディング費も含む)
●サーバーレンタル費用
●ドメイン取得費用
●SSL費用
●Webサイトの更新、メンテナンス、監視などの保守費用
＊Webサイト構築に必要な業務をすべて自社の社員で行う場合は、制作費用や保守費用は発生しません。
運用費に関しては下記の記事で詳しく解説しております。
▶Webサイトの運用費用はいくらかかる？初心者でも分かる費用の内訳
①Webサイト構築に必要な費用の相場
・Webサイト構築に必要な費用(費用はあくまで目安です)
| LP(ランディングページ) | 10万円～30万円前後 |
| コーポレートサイト(個人事業主、小規模) | 30万円～100万円前後 |
| コーポレートサイト(中規模) | 50万円～200万円前後 |
| コーポレートサイト(大規模) | 150万円～500万円前後 |
| ECサイト | 100万円～300万円前後 |
| ポータルサイト | 100万円～500万円前後 |
Webサイト構築に必要な費用は、サイトのページ数や規模、デザインや作成方法などによって大きく異なるため、参考程度にご確認ください。
また、費用だけでサイト構築の発注先を決めてしまうのはNGです。
安い費用で済ませようと思い発注してしまうと、予定通りのサイトができなかったり、追加で膨大な費用が発生する場合があります。
発注する前は必ず複数社の見積もりと内訳項目等を確認して決定するようにしましょう。
8.Webサイトを構築する際の注意点
Webサイトを構築する際に、注意するべき点をいくつか紹介します。
①目的やターゲットを曖昧なまますすめない
Webサイト構築の失敗例として、目的やターゲットが曖昧なままとりあえず構築するというパターンがあります。
目的やターゲットが曖昧な場合、一貫性のあるWebサイトを構築しづらくなってしまい、構築したとしても利用してもらえない可能性が高いです。
まずは、目的やターゲットを明確にしてから手順を進めるようにしましょう。
②具体的な数値目標を設定する
目標を設定する際は、具体的な数値を設定することが大切です。
例えば、PV数やCV数など具体的な数値を設定することで、それに対して達成できたのか、達成できなかったのかを判断し、数字の分析や評価をすることができます。
不明確な数値目標を立てた場合、適正な分析や評価ができないため、具体的な数値を設定するようにしましょう。
③イメージにあったデザインにする
Webサイトをデザインするにあたり、企業のブランドイメージに合ったトーンや配色に設定し、統一感を出すようにしましょう。
ブランドイメージから大きく異なるデザインにすると、サイトに訪れた顧客が不信感を抱いてしまうこともあります。
そうならないためにも、Webサイト全体のイメージにあったデザインに統一させることが非常に大切です。
④スマートフォン（レスポンシブ）に対応する
忘れてはいけない事として、Webサイトは様々なデバイスを通して閲覧されるものであるという事です。
したがって、スマートフォンに対応したWebサイトでなければ、ユーザーは見にくさを感じ、離脱に繋がってしまいます。
⑤著作権を確認する
サイト内で使用する素材はすべて利用規約をチェックしておきましょう。
「商用利用OK」と書いてあっても、クレジット表記が条件であったり、利用してよい数に上限がある場合があります。
もし、無断で使用した事が発覚した場合、10年以下の懲役または1000万円以下の罰金が科せられる可能性があるため、注意が必要です。
⑥SSL対応をする
SSLとはインターネット上でデータを暗号化して送受信する仕組みの事です。
個人情報などの重要な情報を暗号化し、サーバーとPCの間で安全な通信を行えるため、多くのウェブサイトで採用されています。
未対応の場合、多くのセキュリティリスクが発生する可能性があります。
⑦地道に改善する
再度になりますが、Webサイトはリリースした後が本番です。
日々更新してコンテンツの追加を行ったり、SEOやセキュリティ対策を万全にしてwebサイトの信頼性を高めましょう。
何もしなければユーザーはどんどん離れていきます。
9.いまさら聞けないWebサイト制作の基礎知識
①Webサイトとは？ホームページとの違い
Webサイトは、インターネット上でアクセスできる複数のウェブページが一括して集まったオンラインの場所を指します。
通常、特定のドメイン（ウェブアドレス）の下に配置され、情報、コンテンツ、サービスなどを提供するために使用されます。
一方で、ホームページはWebサイトの中で最初に表示される主要なページです。
ほとんどの場合、ユーザーがWebサイトにアクセスしたときに最初に見るページで、サイトの概要やナビゲーションへのリンクを提供します。ホームページはWebサイトの入り口であり、他のwebページへのリンクや情報への案内役として機能します。
要するにWebサイトは複数のウェブページで構成され、ホームページはそのWebサイトの最初のページです。ユーザーがWebサイトにアクセスすると、通常はホームページから始まり、そこから他のウェブページに移動できます。
②Webサイト制作の種類
Webサイトはさまざまな種類があり、その目的やコンテンツに基づいて性質が異なります。以下は一般的なWebサイトの種類です。
コーポレートサイト
企業や組織が自身の存在や製品、サービスに関する情報を提供するために作成するウェブサイトです。企業の紹介、製品カタログ、連絡先情報などが含まれます。
ブランドサイト
特定のブランドや企業の製品、サービス、価値観などを強調するために設計されたウェブサイトのことを指します。様々な角度から消費者にアプローチを行い、ブランドの価値を向上させる事を目的にしています。
プロモーションサイト
特定の商品の宣伝・広告のために作られるサイトです。通常は一時的な存在で、プロモーション活動期間中だけオープンします。割引キャンペーンなどを行い、商品の購入や登録などを促し、売上に繋げます。
サービスサイト
顧客に対して自社で取り扱っている製品、またはサービスの情報を提供するために作成されたウェブサイトのことを指します。
ECサイト
商品を販売することを目的に制作されるサイトです。オンラインショップとも呼ばれ、ユーザーは欲しい商品を閲覧し、購入することができます。
LPページ
商品やサービスの申し込みや、アプリのダウンロードを行ってもらうために作られるサイトです。1ページの中に必要な情報がすべて揃っており、コンバージョンへの訴求力が高い事が特徴です。
マッチングサイト
特定の人や企業を結びつけてマッチングさせるサイトです。新しい事業や雇用を生み出したり、モノシェア、スキルシェアを行う事によって自分に必要なものを経済的に手に入れる事ができます。
＼ 今すぐ、マッチングサイト構築をご相談したい方は下記をクリック ／
10.Webサイト制作の手段
①ホームページ作成ツール等を使って自作する
自分自身、または自社で制作する場合、コンテンツやデザインを迅速に追加でき、比較的コストを抑えることができます。
しかしツールを使用するにしても、運用業務ではHTMLやCSSなどの知識がある程度必要であり、サイト設計におけるサーバーやセキュリティなどの知識も欠かせません。
そのため、何も知らない初心者がコーポレートサイトなどを制作するのは非常に高難易度です。それでも挑戦したい方に向けて、以下の記事でおすすめのサイト構築ツールを紹介しています。
▶サイト構築ツールのメリットとデメリット！自分に合ったツールを選ぶために知っておくべきこと
②制作会社に依頼する
Webサイト制作会社はプロのデザイナーや開発者から成るチームで構成されており、webデザイン、プログラミング、UIの最新のトレンドやベストプラクティスに詳しいです。そのため、高品質で機能的なwebサイトを制作できます！
もちろん費用はかかってしまいますが、リリース後の保守や、運営サポートも含めた伴走を行ってくれる制作会社であれば、その費用に見合う長期的な成功を確保できるでしょう。
構築依頼の際にフルスクラッチでの開発か、パッケージ開発か悩まれた時は以下の記事をご参考になさってください。
▶パッケージ開発とスクラッチ開発どちらがおすすめ？メリットとデメリットあわせて紹介
＼ 今すぐ、マッチングサイト構築をご相談したい方は下記をクリック ／
まとめ
Webサイトの構築の手順と構築のポイント、そして、マーケティングまでを解説いたしました。
今回解説した手順は、Webサイト構築の基本的な手順です。
規模が大きくなっても、今回ご紹介した基本的な手順に沿って柔軟に対応をすることで、慌てずに対応することができます。
Webサイト構築の経験がある方も、今回の記事を読んで再度工程を見直すことで、新しい気づきがあれば幸いです。
