ホームページどんな流れでWebサイトを作っているの？
Webサイトを作るには、HTMLやCSSなどの言語や仕様、そしてソフトが使われているということがお分かりいただけたと思います。これらを駆使しながら、皆さんが閲覧できるWebサイトに仕上げていくのが私たちの仕事です。
しかし、現時点では知識が「点と点」といった状態で、いったいどのようにしてWebサイトが作られるていくのかは、まだ想像がつかないことでしょう。
そこでこのページでは、私のケースを例に、実際の制作フローについてご紹介しようと思います。ちなみにこのフローも会社により多少異なってきますが、大筋ではどこも同じような流れになると思います。
それでは順番に見ていきましょう。
制作案件を確認するための打合せ
まず最初にすることは、制作案件の確認をするための打合せです。Webサイトの制作を依頼してくるクライアントは、必ず何らかの目的・理由があって依頼をしてきています。その目的を達成するために、クライアントとじっくり話し合って情報を引き出すのです。
この段階でしっかりとヒアリング（聞き出すこと）しないと、目的が不明瞭な、いわゆるダメなWebサイトになってしまいます。ここでは、あせらずじっくりと打合せをしなくてはなりません。 どんなことをヒアリングするのか、例を挙げてみましょう。
- クライアントのビジネスはどのようなものか
- Webサイトに何を求めているのか
- ターゲットの属性はどんな人か
- 見た目重視か実用性重視か
- ページ数は何ページ作るのか
- スクリプトは必要か
- データベースは必要か
- イラストはどの程度必要か
- フラッシュは必要か
- 対応ブラウザについてはどうするか
- ターゲットに合う色は何か
- やわらかいタッチにするか、かたいタッチにするか
- 文字の大きさはどうするか
- etc...
といった感じです。ここに書き上げればきりがない程たくさんのことをヒアリングします。クライアントの要望をできる限り引き出すことがプロジェクトを成功させる鍵となりますので、絶対に手を抜けない部分と言えるでしょう。
デザイン作成
次に、Fireworksを使って、ワイヤーフレームと呼ばれる、Webページの設計書を作ります。コンテンツの配置などを、デザイン要素を省いて作り、クライアントに確認＆意見を求めます。
そこで承認を得たら、次はデザインに入っていきます。ここでもまた、逐一クライアントによる確認ステップを挟みます。なぜなら、最後になって「やっぱり変えたい」などといったどんでん返しが発生しないようにするためです。そうなってしまうとコストも増えますし、なによりお互いにとって幸せではありません。適切なステップで確認＆承認してもらうことにより、問題の発生リスクを低減させているのです。
このデザイン段階において、小さな部分を丁寧に作り込んでいくと、見た目が綺麗なWebサイトになります。この作りこみには比較的時間がかかるので、クライアントの予算の面からあまり時間をかけられない案件もあります。
デザインの最終確認
全ページの画像を作り終えたら、クライアントにデザインの最終確認をとります。 この最終確認をきちんとせずに次のステップに進んでしまうと、あとあと面倒なことになりかねません。ですので、このステップはとても重要です。要するに、ここでデザインは〆（シメ）ということですね。
HTMLへ書き出す
デザインの承認を得たら、HTMLへの書き出し＝コーディングに進みます。Fireworksのスライス機能を利用して、Webサイト用に画像を書きだしていきます。その書きだした画像を、DreamweaverにてHTMLを記述し配置していきます。
書き出し作業というのは、画像そのままにHTMLにしていけばいいだけですので、慣れてくると簡単なサイトであれば、比較的単調な作業です（単調というか、無意識に手が動く）。HTMLで文書を適切にマークアップ（簡単に言えば、「ここは見出し」等と意味づけすること）していき、通常はCSSを使用して見た目を調整します。なお、HTMLタグは基本的に手打ちです。
動作チェック・納品
様々なブラウザで、Webページの表示チェックを行います。ここのステップで、癖のあるブラウザのために結構時間をくってしまうこともたまにあります。その後クライアントに最終確認をしてもらい、問題なければ納品です。
納品方法は、直接先方のサーバーにアップしてしまうことがほとんどですね。
完了！
以上、結構大雑把でしたが、上記のような流れで私はWeb制作を進行しています。実際にはもっと細かくフローが入ってくるのですが、あまり細かくても分かりづらいので、今回は要点をご紹介しました。大体の流れをつかんでいただけたらと思います。
