ぴったり、を選ぼう。PITTALAB

unnamed.jpg

ホームページ制作の流れとは?各ステップにおける重要なポイントも解説

twitterでシェア
facebookでシェア
はてぶ
公開日: 2022.04.22
更新日: 2022.04.22

ホームページ制作のプロセスを6ステップに区分して各ステップで何をするのか、重要なポイントはどこか、ということを明確にすればスムーズに制作作業は進行することが可能になるでしょう。本記事がホームページの制作の参考になれば幸いです。

目次
目次

ホームページ制作の主な流れ・ステップ

なんとなくホームページを作ってみよう、と考える人はほとんどいないでしょう。何らかの目的を持ってホームページを制作しようと考える人が大部分だと思われます。同様に、制作側も行き当たりばったりで作業を進めるようなことはしません。もしも適当に制作作業を進めてしまうと、余計なコストや時間がかかってしまうことになり、結果的にクライアントに大きな迷惑をかけてしまう可能性が極めて高くなります。そこで基本的な制作の流れ・ステップに沿って作業を進めることが効率的なのです。本稿ではホームページ制作の基本的な流れ・ステップを解説すると共に制作の作業を始める前にあらかじめ整理しておくべきポイントについてご紹介します。

調査・分析・企画

ホームページ制作の最初のステップは調査・分析・企画になります。いわゆる準備段階です。まず調査・分析ですが、具体的には、ホームページのターゲット層の調査・分析、競合する他のサイトの調査・分析、SEOの観点からのキーワード分析などを実施します。

ターゲット層の調査・分析ではホームページのターゲットとなる層をある程度まで絞るためにどのような利用者を対象にしたホームページを制作するのか、を調査のうえ、製品・サービスの分析をします。この作業は非常に重要で、例えば、利用者の性別・年代によって使用するフォントや文字サイズなども違ってくるので、ホームページのデザインに大きな影響を与えることになります。

競合する他のサイトの調査・分析とは、自社と同じような商品・サービス、販売地域、価格帯、などの特徴を有している他のサイトを対象に分析することです。他社サイトのキーワードやターゲット層などを把握することで、差別化したホームページを制作することが可能になります。また、他のサイトを分析すると自社サイトに足りない部分に気付かされるという効果も期待できるので、他サイトの分析は継続して行うことが必要です。

SEOの観点からのキーワード分析とは、ユーザーが検索する可能性があるキーワードのひと月あたりの検索量やサジェストと呼ばれている調査を実施することです。サジェストとは、Googleなどの検索エンジンである言葉を入力した場合にキーワードが予測されることで表示される機能です。

具体的には、「春」と入力すれば「春休み」「小春日和」といった、入力した言葉から想定されるキーワードを表示する機能をいいます。こうしたサジェストを実施すると共に、このキーワードはこのコンテンツで対策を実施して、このキーワードはトップページで対策を実施する、などの整理された施策を実行することが可能になります。

なんでもかんでも単純にキーワードをやたら盛り込んだとしても検索エンジンで上位に表示されることは難しいので、キーワード分析を実行して、対策するコンテンツを準備するというフローが順当です。そのためにもキーワードの分析ホームページ制作に必要なコンテンツ制作作成を始めるタイミングで対策キーワードを添付しておくことをおすすめします。

ホームページの企画で行うことは、目的の整理、コンセプトの決定、予算の策定です。ホームページを制作してどのような成果を出したいのか、という制作のゴールを設定することでもあります。目的が整理・設定されていなければ船長がいない船のように行き着く先がはっきりと定まらず、制作作業が迷走してしまうでしょう。

目的と同様に、方向性を決めるべきコンセプトが決まっていなければホームページのイメージを持つことが困難になります。目的に沿ったコンセプトの決定が重要になります。予算の策定も極めて重要です。お金をかければかけるだけ素晴らしいホームページを制作することは可能かもしれませんが、湯水のように予算をかけられるケースは基本的にはないでしょう。

目的やコンセプトを踏まえて、これくらいの予算内でホームページを制作するという条件を設定して、その予算内で最高のホームページを制作する、という気概を持って作業にあたることはとても大切です。

設計・UI/UX

ホームページ制作の第2のステップは設計・UI/UXになります。ホームページ制作の設計とは、目的・コンセプトに基づいて具体的なコンテンツなどを明らかにしてホームページの基本的な骨組みを作り上げる作業をいいます。

ホームページ制作における下準備の作業であり、また最も重要なプロセスであるともいえます。ホームページの設計をしっかりと実行できれば、期待した成果を上げられるのみならずGoogleなどの検索エンジンにも高く評価されやすいホームページを完成させることができるでしょう。

ホームページの設計を顧慮せずに手探りのような状態で制作してしまうと、期待していたような成果を得ることは難しいと思われます。さらに、実際の運用の際には、求めていたターゲット層には上手く刺さらない、想像していたものとは異なるホームページが完成した、などの問題が生じるおそれもあります。

結果的にホームページ制作に費やした時間・費用が無駄になる場合も考えられます。また、ホームページの設計においては、現状課題の整理も実施します。企業のホームページの位置付けや目標の達成基準などのKPIを明確に設定することが必要不可欠です。

ホームページの設計においては、ホームページに載せる項目を決定していくことになります。ホームページに載せる項目はサイトマップと呼ばれています。サイトマップは、本で例えると、目次に相当する部分になります。ホームページのトの種類によって、載せる内容も大幅に異なります。

具体的な例としてECサイトのサイトマップの場合には、トップページ、商品の紹介ページ、商品の購入ページ、実際の購入者の声、企業概要、顧客からのお問い合わせフォーム、といった項目が必要になります。こうしたサイトマップの鉱区は上述した目的やコンセプトとも照らし合わせながら決めることが必要です。

また、サイトマップの項目は表示される順番にもこだわると共に利用者にとって見やすい構成になるように配慮しましょう。サイトマップになんでもかんでも詰め込んでしまうとページ数が増えて費用が嵩んでしまいます。そこで必要な項目を抽出して見極めることも重要です。

UIとはユーザーインターフェース(User Interface)のことで、ホームページのデザイン・フォント、パソコンそのものの外観、といった、利用者の視覚で感じることが可能な全ての情報をいいます。また、UXとはユーザーエクスペリエンス(User Experience)のことで、利用者が製品や・サービスの使用を通じて獲得することが可能な体験・経験を意味しています。

このようにUIとUXは異なるものですが、この2つには密接な関係があります。それは、UIはUXを向上させるための大切なファクターであるということです。よいUXを利用者に提供するためにはUIに対する気配りが欠かせません。反対にUIに多くのマイナス点があると利用者は好印象は持たないでしょう。ホームページの設計の際はUI/UXの最適化を意識することも大切です。

コンテンツ・デザイン制作

ホームページ制作の第3のステップはコンテンツ・デザイン制作になります。ここでいよいよホームページの制作に取りかかることになります。制作するページ数などによって制作期間は異なりますが、ページ数が少ないLP(ランディングページ)のような場合には1ヶ月くらい、15~20ページくらいの場合は3ヶ月~3.5ヶ月くらい、30ページ以上の場合には4ヶ月くらい、50ページ以上の場合は半年~1年くらい、の時間がそれぞれ必要になることを目安にしておくとよいでしょう。

一般的には、いきなり全てのページのデザインを制作するのではなく、トップページと代表的な下層ページの数枚のページを作成しすることりから着手して、ホームページのデザインの方向性をクライアントと共有することができたうえで、他のページのデザインへと移っていきます。

ホームページ制作の企画に基づきターゲット属性に対するアピール効果も十分に意識して、ホームページ全体に共通するデザインのコンセプトを決定します。デザインのコンセプトはホームページで使うフォント、カラースキーム、レイアウト、画像の素材、文章(テキスト)、などのビジュアル的なファクターを選び出して配置する場合の重要なベースになるものです。制作会社次第ですが、デザインのトンマナ(トーン&マナー)の策定・デザインのガイドライン作成、なども依頼することができます。

実装・システム開発

ホームページ制作の第4ステップは実装・システム開発になります。デザイン制作が完了したらホームページとしてきちんと機能するようにシステムの実装とホームページのブラウザ上で表示できるようにシステム開発を行います。この作業は、コーディング、マークアップ、などと呼ばれています。 システム開発は、HTMLやJavaScriptなどを使うフロントエンドとPHPなどのサーバー用の言語を使うバックエンドとに分かれています。それぞれ可能なことが異なるので実装する前に必要となる実装領域と分担を明確に決めておきましょう。

フロントエンドとは、完成見本と同様のものがインターネット上においても見られることを可能にする、メインとしてビジュアル面を調整するプロセスのことです。ソースコードと呼ばれている言語で記述する作業のことです。ホームページ上に表示されるテキストは当然ですが装飾なども実装していくことになります。主に、HTML、CSS、JavaScript、などの言語によって構築されます。

一方のバックエンドとは、サーバー上で動くプログラムを開発するプロセスのことです。実際には目で見えない部分の作業となるので、正直あまりピンとは来ない可能性が高いでしょう。具体的には、飲食店の予約システムを利用してお店の予約をした際にはお店への連携だったり予約の受付メールを送ったり、と様々な処理が実行されます。しかしそういったアクションは利用者には見えません。このようにユーザーには見ることができない裏側の部分の作業を行う工程がバックエンドです。

代表的なシステムには、WordPressなどのコンテンツ管理システム(CMS)やオンラインショップを構築する際に利用されているEC-CUBEなどのパッケージシステムを挙げることができます。バックエンドではこうしたシステムのインストール・設定のカスタマイズなども担うことになります。

当然ながらオリジナルのシステムを構築する場合にもバックエンドエンジニアが担当することになります。そして、バックエンドのプロセスのエリアにおいてはプログラミングの他にもホームページを公開するためにサーバーの設計やドメインの設定などのインフラ準備も担当します。

リリース・保守運用

実際にホームページをリリースする前にはデバッグ(動作の検証)やブラウザチェックなどのテストの実施が必要不可欠です。テストを行わずにいきなり本番運用をスタートしてしまうとトラブルが発生した場合に利用者からのクレームが殺到してホームページを制作した意味がなくなってしまうでしょう。

そういう意味においてはしっかりと意義のあるテストを実施することがとても重要になります。テストにおいて確認するべきポイントは、サーバー・ネットワーク・データベースは正常に機能するか、主な複数のブラウザにおいて正常に動作するか、パソコン・スマートフォン・タブレットなど複数の異なるマルチデバイスにおいて正しく動作するか、問い合わせフォーム・検索機能などのシステム要件に問題は発生していないか、といったものです。

テストを実施した後には見つかった不具合を修正する必要があるので、そのような時間もホームページの制作期間に加味しておくことが必要です。不具合を修正して、最初に定めた要件定義の項目を全て満たすことでようやくホームページがリリースされることになります。こうしてホームページの運用がスタートすると引き続き定期的な保守運用が実施されることになります。

評価・改善

ホームページの運用が開始された後も、ホームページが利用者からどのように評価されているのか、を把握して、改善に生かすようにすることは極めて重要です。ユーザーからの評価状況は、例えば、ホームページへのアクセス数やアクセス状況やコンバージョン達成率(CVR、Conversion Rate)の監視などで把握することが可能です。コンバージョン達成率とは商品の購入や申込み(コンバージョン)を達成した割合を示す指標のことで目標達成の指標としている企業も多いようです。ただし、コンバージョン達成率は業界によって目安が異なるので自社が属している業界の平均的なコンバージョン達成率は把握しておきましょう。

こうしたアクセス数やコンバージョン達成率の把握などのアクセス解析はぜひ実施することをおすすめします。アクセス解析によってホームページの課題が明確になり、改善するための対策が講じやすくなるからです。ほかにも場合によってはコンテンツの配置を変更したり、テキストの修正加筆(リライト)をしたり、というホームページのコンテンツ内容をメンテナンスすることも実施していくようにしましょう。

ここまでホームページ制作の各ステップにおけるタスクの内容などについて解説してきましたが、ホームページ制作を始める前に整理しておきたいポイントについて以下で詳しく紹介します。

ホームページ制作を始める前に整理しておきたいポイント

いきなりホームページの制作を始めようとしても何から手を付けてよいのかわからず途方に暮れてしまうかもしれません。そこでホームページの制作を始める前にあらかじめ整理しておくべきポイントについて詳細に解説します。

目的の明確化

上述した「ホームページの設計」の部分で明確な目的の設定は必要不可欠だと述べましたが、本来はホームページの制作プロセスに入る前にホームページを制作する目的は定めておいたほうが望ましいと考えられます。なぜなら目的が明確に決まっていないのに、最初のステップの調査・分析・企画に着手してしまうと、常に「何のために?」と疑問を持ちながら作業を進めることになりかねないからです。

目的はホームページのタイプによっても違います。具体例を挙げると、人事採用のホームページの目的は「企業が必要とする人材とその企業で働きたい人材とをマッチさせて応募を促すため」、企業紹介のためのコーポレート用ホームページでは「企業を広く大勢の人に認知してもらうため」、ECサイトは「顧客からのアクセス数を向上させて自社の商品・サービスの購入数のアップへとつなげたい」、サービスサイトは「商品・サービスをお客様に知ってもらって見込み客を獲得する」、などが考えられます。

明確な目的が設定されると、どういったコンテンツをどのような配置・順番で掲載して、さらにどのようなデザインにするのか、まで含めたホームページの設計・制作内容・必要な費用なども自然と分かってくるでしょう。ホームページの制作を円滑に推進するためには、あらかじめホームページ制作の目的を明確にしておくことが必要です。

ターゲット(ペルソナ)の設定

誰をターゲットにしてホームページを制作するのか、ということも制作に入る前に整理しておきたいところです。ペルソナ(persona)とは、商品やサービスの典型的な利用者像のことです。マーケティングにおいてはよく使われている概念です。あたかもその人が実際に存在しているかのように、年齢・性別・住所・仕事・タイトル・収入・趣味・特技・価値観・家族構成・学歴・休みの日の過ごし方・ライフスタイルなど、とてもリアルで詳しい情報を設定してペルソナは作られます。

一般的にターゲットとペルソナは同じ意味を持つ言葉として使用されていますが、実はペルソナのほうがターゲットに比べるともっと細かい人物像を設定している、という違いがあります。つまり、ターゲットは人物像に若干幅を持たせて設定するのですが、ペルソナは人物像を詳細かつリアルに設定していくのです。

ホームページ作成を始める前にペルソナという言葉が本来持っている意味のレベル(粒度)まで設定できれば、それに越したことはないですが、少なくともどういった人物をターゲットにしてホームページ制作を始めるのか、という点はあらかじめ考えておいたほうが制作の各プロセスをスムーズに進めることが可能になると思われます。

体制・予算・計画の確立

ホームページの制作を始める前に、ホームページ制作プロジェクトに携わる人員・体制、必要となる予算金額、ホームページ制作プロジェクトの計画(WBS)、などを確立しておくことが望ましいでしょう。具体的には、制作側の要員だけでなくクライアント側の関与者も含めて推進体制を構築・周知しておくことで、万が一問題が発生した場合にも適切な人物にコミット・連絡することが可能になるので体制構築は制作会社側とクライアント企業側の双方にとって必要になると思われます。

予算に関しては、どの程度の予算を見込むことができるのか次第でやれることも決まってくるので、実際に制作に着手する前に決めておくべき事項でしょう。予算が決まっていなければ、際限なく費用をかけてしまい無駄なコストを流出させてしまうことになりかねません。予算による歯止めは、ホームページの制作に限らず、プロジェクトを推進する際には必要不可欠なものだと言えます。

WBS(Work Breakdown Structureとは日本語では「作業分解構成図」と呼ばれており、プロジェクトの計画時に作成する場合が多いものです。WBSはやるべき作業を分解して構造化しスケジュールを策定するものであり、基本的にプロジェクトはWBSに沿って進められます。WBSを利用すれば作業の抜けや漏れを防止することができますし、進捗状況を把握することも可能です。

一方で、プロジェクト全体の作業が明確になっていない段階で詳細なスケジュールを策定することはプロジェクト失敗のリスクが高まる、という考え方もあります。見積もり段階の精度が低い状態でプロジェクトを進めることは関係者の誰であっても好ましいことではないでしょう。

したがって、ホームページ制作を始める前段階ではWBSレベルまでの詳細な計画を策定することは必須ではなく、WBS策定前のラフなレベル、言い換えると今後WBSを策定する場合に必要かつ重要なポイントを記載したレベルの計画を作ることが求められている、と考えられます。ホームページ制作の計画においては、ターゲットや競合先の調査・自社の既存サイトのアクセス分析・制作などのそれぞれのプロセスに必要となる期間を勘案したうえでスケジュールを立案することが必要です。

結論:各ステップにおけるタスクの明確化が重要

ホームページの制作においては様々なタスクが存在しており、それぞれが具体的に何をするのかを明確に定めておくことが必要不可欠になります。制作したホームページがきちんと成果をあげるためにもはっきりと定められた各タスクをしっかりとこなしてホームページを制作することが大切です。

最後に

ホームページの制作は、調査・分析・企画、設計・UI/UX、コンテンツ・デザイン制作、実装・システム開発、リリース・保守運用、.評価・改善、の6つのステップから成り立っています。また、ホームページの制作においてはマーケティング戦略に基づく目的の明確化・ターゲットの定義・制作や運用の体制作りや予算策定などをあらかじめ決めておくことも重要です。加えて、目的をクリアするために目指したレベルの通りのホームページの制作を実現するためには高い技術力も不可欠です。


無料のご相談窓口はこちら!あなたに最適な業社選定致します
\最短1分!/今すぐ相談