Webサイト制作の流れ。ヒアリング～ホームページのデザインカンプ作成など

工程1：ヒアリングについて

ヒアリングの重要性

Webサイト制作の過程において、ヒアリングはもっとも大切です。

なぜか。

それは、「最高のWebサイト」=「クライアントのイメージに100%合致するサイト」であるからです。

これが難しいところで、Webディレクターやデザイナーは当然経験もあるし最先端の情報を知っているので、クライアントの要望する内容よりもクオリティの高いアイデアを持っていることが多い。

クライアントの言う通りのサイトを作るのもよいですが、出来ればクライアントにいろいろと提案して、一緒にベストなイメージを共有していく形が一番よいですね。

その際に必要なのがヒアリングのスキルです。

チェックシートの項目

ヒアリングシート詳細版のテンプレート

工程2：サイトマップ

アクセス性の高いWebサイトの需要が高まる中、サイトマップ構築は重要です。

特にSEO対策をする場合はここで失敗すると後から大変なことになります。

サイトマップのテンプレート

工程3：見積提出、受注、前金を払ってもらう

ここまで打合せをした段階で大体の工程は把握できるので、見積は提出できます。

より精度の良いコスト計算をするのであればワイヤーフレーム後にこの処理を行っても良いですが、失注した時に痛いです。

見積、請求書などのテンプレート

工程4：ワイヤーフレーム

コンテンツの構成を絵にしたものです。

ワイヤーフレームを作るツールはいろいろありますが、僕は他のフォーマットと統一させるためにエクセルを利用します。

ヒアリングシート、サイトマップのダイヤグラム、各伝票系書類、ワイヤーフレームを全て一つのエクセルシートにまとめます。

ワイヤーフレームのテンプレート

工程5：デザインカンプ

Photoshopで実際のデザインを提出する工程。

Webディレクター志望であれば、ここから後の工程は外注することも出来ます。

レスポンシブの普及によりここの工程を省略する人が増えてきていますが、僕はこの工程を省略しないことをおすすめします。

クライアントのイメージや、その人のこだわり具合によっては後から全てがひっくり返る可能性があるからです。

工程6：コーディング

Htmlで実際にコーディングしていきます。

ここは外注すると安くつきますが、僕は綺麗なソースコードを残すことにこだわるので、自分でコーディングします。

ただしBootstrapなどのフレームワークは必須です。

一からレスポンシブデザインのコーディングをするととんでもなく手間だし、ミスの多いサイトになる可能性も高いです。

工程7：CMS構築（WordPressなど）

クライアントの運営チームにWordPressの経験者がいれば、WordPressでCMS構築することによってクライアント側でコンテンツの更新などを行ってもらうことが可能です。

サイトのメンテナンス、更新頻度が重要視されている今の時代ではCMS構築はかなり需要が高いです。

工程8：ドキュメント、トレーニング提供

コンテンツ制作のガイドラインを守ってコンテンツ制作を行わないと、数年後にサイトのコーディングはカオスと化すことは必至です。

クライアント側でメンテナンスを行う場合はガイドラインや、方法を教えるトレーニングを実施することが必要になります。

工程9：納品

全てが終わった時点で納品。

まとめ

～次回に続く～