ホームページ制作の進行の流れ

これからホームページ制作をスタートする方は、どういった流れで制作が進行していくのか気になりませんか?
実はホームページを制作する側からすると通常の制作進行でも、初めての担当者にとっては思っていた以上に多くの工程があるようです。
最初に全体の流れを知っておくことで、スムーズに進行できるので確認していきましょう。

まず大まかな全体の流れを説明します。

  1. 要件定義
  2. ホームページ制作会社との契約
  3. ワイヤーフレーム
  4. デザイン制作
  5. コーディング
  6. 全体チェック

といった流れになります。1つずつ詳細を見ていきます。

ホームページ制作の要件定義

まず要件定義とは、これから作るホームページはどんなホームページなのか、ということについて詳しく記載してあります。
ホームページ制作会社によっては、要件定義シートという決まった形式の書類を準備している場合もあります。また内容については、制作会社によって多少違うこともあります。

要件定義に含まれていることは、主に以下になっています。

  • ホームページ制作の目的
  • ターゲット
  • コンテンツ内容
  • 完成後の目標
  • デザインのイメージ
  • スケジュール
  • 予算
  • 運用方法

要件定義を実施するには、時間がかかる場合があり、早く制作をスタートしたいと思っている担当者もいますが
ここで詳細に詰めておけるかどうかが、ホームページ完成に大きなカギを握ります。
これからホームページを制作している途中で、迷ったり意見が分かれたりする場面が出てきたときに、
要件定義を確認すると「誰にどんな目的でこのホームページを見てもらうか」ということが書かれているので、答えを導きやすくなるというわけです。

ホームページ制作会社との契約

この要件定義が決まると、予算が出るためにホームページ制作会社との契約に移ることができます。

そして契約が無事終了すると、早速ホームページのイメージが目に見えて分かる段階となります。
これがワイヤーフレームの制作という段階になります。

ワイヤーフレームの制作

ワイヤーフレームとは、画面設計とも呼ばれています。
まだデザインではないですが、ホームページのどこに何が配置されるのかが白黒で表されており、画面感覚でホームページを確認できます。
これは、デザインに入る前の段階に通る道で、ホームページに掲載する情報を整理して、全体のイメージを制作会社とクライアント側で共有するツールともいえます。
どこに写真やテキストが入るか分かってくると、かなりイメージが膨らんできて、分かりやすくなるのではないでしょうか。

ホームページデザインの制作

全体のイメージがワイヤーフレームで出来たら、早速デザインの制作に入っていきます。
デザインについては、要件定義の際にどんな色のイメージかをあらかじめ決めていたり、参考や競合のサイトもすでに出ている場合も多いため
それに沿ってデザインが進行していきます。
デザインについては、まずはトップページを最初に確定して、その後トップページのデザインに合わせて、他のページのデザインも進行していきます。

HTMLコーディング

デザインがある程度できると、コーディングといって、プログラムを組み立てる段階に入っていきます。
コーディングを行うことによって、動かなかったデザインが、ブラウザ上で動きが出てよりホームページらしくなっていきます。
このときに、お問い合わせフォームなどのシステム機能がある際は実装を行います。

ホームページの全体チェック

このコーディングが完成すると、ホームページ制作の完成は間近となっており、最後に全体のチェックを行います。
全体のチェックは、ホームページの文章に誤字脱字はないかのチェックや、クリックした先のページに問題がないかなどのかなり細かいチェックも含みます。
お問い合わせフォームを実装している場合には、そのフォームの送信先に問題がないかなど、ホームページが完成した後にすぐ運用ができるかも確認します。

すべての確認が終わるとホームページの完成です。