WEBサイト・ホームページの制作の流れを解説する【初心者向け】

  • PR
  • WEB制作
WEBサイト・ホームページの制作の流れを解説する【初心者向け】

WEBサイト(ホームページ)を制作するにあたって、どの様な工程があり、どの様な作業があるのか、またはどの様な人たちが関わっていくのか。イメージを持ちづらい方も多く居ると思います。



そこで今回は、WEBサイト(ホームページ)制作の主な流れや、各工程ごとの作業について解説してゆきます。



▼この記事が向いている人

  • WEBサイトの制作依頼を考えている
  • WEB制作の業界で働きたいと考えている方
  • WEBデザイナーやエンジニアなどの職業を目指している方
この記事を読めばWEBサイト制作の流れを知る事ができ、イメージを明確に持てるようになりますよ!

▼この記事を書いたひと

フリーランスみやしも(@miyashimo_blog)です。プログラミングやWebサイト制作に関するITの情報を幅広くお届けしていきます。

WEB制作の全体像

まずはWEB制作の全体像からイメージをつかみましょう。



WEBサイト・ホームページの制作は企業からフリーランスの個人まで幅広く行っており、その業態も様々です。そこで今回は、以下の様のな制作の規模感・条件を想定し解説を行います。



  • 企業サイト(コーポレートサイト)の制作
  • ページ数は10~20ページ程度の小・中規模サイト
  • WEBサイト・ホームページは制作会社への外注を行い作成する



※WEB制作会社や依頼方法によって工程や作業内容に違いがある事を予めご了承ください

※この投稿では便宜上、クライアントを『お客様』、WEBサイトの制作を行う企業またはフリーランスを『WEB制作会社』として表現してゆきます



WEB制作は大きく分けると発注までの『提案&見積り』と、発注を受けてからの『制作』、そして『公開・納品』のフェーズに分ける事ができ、図に表すと次の様になります。

WEB制作の流れ_全体のイメージ
WEB制作全体の流れ

制作期間についてですが、サイトの規模にもよりますが、一般的に制作にはおよそ2~3ヵ月程度の期間を必要とします。また、WEB制作会社も余裕をもって3ヵ月程度を目安にスケジューリングを行うことが多いです。

制作期間はサイトの規模や制作の条件によって大きく変動する事なので、あくまで目安として考えましょう。

WEBサイト制作の全体像を把握する事は出来ましたでしょうか。以降は、各フェーズで行う作業内容について詳しく解説を行ってゆきます。

WEB制作の流れ:提案&見積りフェーズ

WEB制作の流れ_提案&見積りフェーズ

『提案&見積り』フェーズは、サイト制作が決まってから実際にWEBサイト制作会社に発注するまでの期間をいい、一般的には次のような流れで行います。



▼提案&見積りの流れ

  1. 問い合わせ・相談
  2. 面談・ヒアリング
  3. 提案&見積りの作成
  4. WEBサイト制作の発注

問い合わせ・相談

WEB制作の流れ_問い合わせ

お客様の行動により、制作会社にWEBサイトの制作依頼が発生します。多くはWEB制作会社のWEBフォームや、電話などから発生し、お客様とWEB制作会社がマッチングします。その他にもクラウドソージング、口コミなどマッチングの方法は様々にあります。

面談・ヒアリング

WEB制作の流れ_面談・ヒアリング

問い合わせ後に連絡を取り合った後、お客様とWEB制作会社とで面談を行います。お客様のWEBサイトに必要な要件の洗い出し、サイトに盛り込むための要望を、面談を通してヒアリングしてゆきます。直接会って対面で行われる事が多い場面ですが、最近では通話やビデオチャットを始め、ネットを通して行われる事も多くあります。



この段階ではざっくりどの様な趣旨のWEBサイトが必要か、スケジュールや予算感などの確認が行われつつ、WEB制作会社が提案&見積りを作成するために動き始めます。

提案&見積りの作成

WEB制作の流れ_提案&見積りの作成
面談時のヒアリング内容を元に、WEB制作会社が『提案』&『見積り』の作成してお客様に提示します。



『提案』はお客様がWEBサイト・ホームページを作成するにあたり、目的や課題をどの様に解決するかが書かれている内容のもの。『見積り』は提案内容を実現するにあたり、どの様な作業があり、幾らくらい金額がかかるかを示したもの。それぞれ提案書・見積書の形で提出があります。

提案・見積りフェーズの期間は?

提案・見積りの方法はWEB制作会社によって様々ですが、期間にしておよそ2~3週間程度で行われます。



提案&見積り作業はWEBサイト制作内容を左右する重要な作業です。お客様が予算やスケジュール、他社の見積もりとの比較検討を行う(相見積もり)ことも多いため、何かと時間を要するフェーズでもあります。

お客様&WEB制作会社間で納得のいく内容で受発注が行われることが大切です、必要なら時間をかけて調整を行いましょう!

WEB制作の流れ:制作フェーズ

WEB制作の流れ_制作フェーズ

WEB制作会社が提案&見積りを行い、お客様から発注が行われたらいよいよWEB制作が始まります。『制作フェーズ』は、WEBサイト・ホームページ制作の発注からWEBサイトが公開(納品)されるまでの期間をいい、主に次の流れで進んでゆきます。



▼制作フェーズの流れ

  1. サイト設計
  2. デザイン制作
  3. プログラム開発
  4. テスト・チェック

サイト設計

WEB制作の流れ_サイト設計
  •  制作期間:2週間~
  •  関わる人:ディレクター



サイト設計とは文字通り、WEBサイト・ホームページを制作の設計を行う作業のことです。



ヒアリング内容を元に制作すべきサイトの要件を定めて、サイト全体の構成や各ページの内容を表す様々な資料が作成されます。資料を通し、打ち合わせを重ねながら、お客様とWEBサイトの内容を決定してゆきます。



資料は総じて『サイト設計書』や『制作仕様書』などと呼ばれ、それらに準じて、後に続くデザインやHTMLコーディングなどのプログラム開発作業を行う事となります。WEB制作会社によって作成される資料の種類や内容も様々ですが、設計書には次のようなものがあります。



▼WEB制作で扱われる設計書は?

  • サイト概要・計画
  • サイトマップ
  • コンテンツリスト
  • ワイヤーフレーム
  • デザインコンセプト
  • カラースキーム



サイト設計はWEB制作のプロジェクトの中でもっとも多くの期間を要する段階といってよく、適切なスケジュール管理や品質管理が求められる作業になります。また、後の作業にも大きく影響する、制作フェーズでも一番重要な作業にもなります。

制作されるWEBサイトの内容に誤解が無いか、しっかり確認をしながら次の作業に進む事が大切です。

デザイン制作

WEB制作の流れ_デザイン制作
  • 制作期間:2週間~
  • 関わる人:デザイナー



WEBデザイナーと呼ばれる職業の方が、WEBサイト・ホームページのがデザイン制作を行います。



先のサイト設計作業で決められたページ構成やワイヤーフレームなどの内容に従ってデザインの制作を行います。また、この時点では実際のWEBページが作られる訳ではなく、あくまでデザインに関してのみ作業が行われます。



簡単に言うなら、デザイナーさんがWEBサイトの『絵』を描く作業であり、WEBサイトの見た目の部分にのみ集中して行われる作業になります。



デザイン制作では『Photoshop(フォトショップ)』や『Illustrator(イラストレーター)』というAdobe社のデザイン用のソフトが多く使われていますが、お客様へは画像やPDFなどのファイルを通してデザインの確認が行われ、指摘・修正を繰り返しながらデザインの完成を目指します。

考えたWEBサイトが形になり始める段階です。お客様にとってはワクワクする作業ですね!

プログラム開発

WEB制作の流れ_プログラム開発
  • 制作期間:2週間〜
  • 関わる人:エンジニア



『エンジニア』と呼ばれる職種の方が、デザインを実際のWEBページに起こす作業を行います。プログラミング言語には、HTML&CSS・Javascript・PHPといったものが主に使用され、エンジニアはそれらプログラミング言語を駆使して、実際のWEBページの制作を進めてゆきます。

デザイナーさんが作成した『デザイン』を動かすために、『エンジニア』がデザインに命を吹き込む作業とも言えます。

テスト・チェック

WEB制作の流れ_テスト・チェック
  • 制作期間:1週間~
  • 関わる人:ディレクター、エンジニア



ホームページ・WEBサイトのデザインやプログラム開発などの作業が一通り終わったら、最後にテスト・チェック作業を行います。WEB制作会社にとってのテスト作業、お客様にとっての納品物のチェック(=検収)となりますので、この作業は必ず行います。 



また、この時点では公開前のWEBサイトにパスワードをかけた状態など、実際のサイトの状態をPCやスマートフォンを通して確認します。

この作業を通してWEB制作会社・お客様共に問題がなければ、ホームページ・WEBサイトの公開となります。

WEBサイトの公開(納品)

  • 所要期間:1~5日程度
  • 関わる人:ディレクター、エンジニア



サイト設計~テスト・チェックに至る制作の全ての作業が完了したら、いよいよWEBサイト・ホームページの公開を行い、納品となります。



また、WEB制作会社ではGoogleなどの検索エンジンへの登録や、WEBサイトの管理画面の使用方法などのレクチャーを。お客様ではサイトの告知や周知などの作業を行い納品に向けて残りの作業を完了させます。



サイトの運用上問題が無ければ無事、WEBサイト・ホームページは納品となります。

WEB制作の『納品』についてイメージを持ちにくい方も多いかもしれませんが、多くは『サイト公開時=納品』になります。

まとめ:WEBサイト制作のイメージをつかもう

今回はWEBサイト(ホームページ)の制作の流れについて、解説を行ってきました。



WEBサイトを作るためにはデザインや原稿などの人の目に触れる部分から、WEBサイトを動かすためのプログラムの存在、集客やSEO対策などの要素があり、またそれらを担当する技術を持った、様々な職業の人が入り混じまじる業界です。



また、そんな中でどの様にWEBサイトが作られていくのか、イメージが持ちにくい方も多いのではと思い、今回の記事を執筆いたしました。 



この記事を通して、WEBサイト・ホームページ制作の依頼を検討中の方、WEBサイトの制作を学びたいデザイナやープログラマー志望の方々にとって、少しでもお役に立てれば嬉しく思います。

今回は以上となります。最後までお読みいただき、ありがとうございました!