実はもうすでに知り合いの経営するタクシー会社のコーポレートサイトはネット上に公開しているのですが、本記事ではどのような工程でコーポレートサイト制作を進めたのかざっくりと説明したいと思います。
まずはサイトコンテンツの原稿作成
依頼主から頂戴したリーフレットやＰＤＦファイルなどの文書を「サービス」、「会社概要」などと大まかに分類し、それを基準として枝分かれしていくイメージで分割していきました。
つまり、階層が深くなるにつれてサービス単体にスポットライトが当たるようにしています。
今回ターゲット層が「出張（観光）で訪れた県外の顧客」と「地域住民の顧客」になっていたため、トップページは両者が見ても差し支えないように仕立てました。また、ユーザビリティを考慮してあまりスクロールさせないように導入部のページと詳細を掲載するページに分けました。
あらかじめどのようなことを訴求したいのかを確認しておき、キャッチフレーズや強調したいところはページの上部に表示させるようにしたのもポイントです。
ＨＴＭＬテンプレートを選定
原稿を作成した後に行ったのはＨＴＭＬテンプレートの選定です。
制作するタクシー会社が山形県の酒田市という港町なので、「海と言えば○○市」という主要な都市のタクシー会社のコーポレートサイトをあらかじめ検索しておき、イメージを膨らませました。
それから、依頼主からあらかじめ伝えられたホームページのイメージとタクシーの一般的なイメージに当てはまるデザインを選びました。
もちろん、イメージにより近づけるためフォントサイズやサイドメニューの位置、不足している部品などがあるのでテンプレートのＣＳＳファイルやＨＴＭＬファイルに修正を加える前提です。
画像加工
画像の加工はリサイズやトリミング、テキスト挿入が主でぼかし加工やコントラスト調整はヘッダー画像にしか施しませんでした。
バナー作成はこの工程に含みますが、合成や挿入したテキストを囲むといった簡単な加工ですので、バナー制作の参考にはならないと思います。
顧客仕様テンプレート作成
ダウンロードしたHTMLファイルやCSSファイルにテコ入れをして、セミオリジナルテンプレートを作りました。イチから作っているわけではないので、少しずるい印象を与えるかもしれませんが、顧客がそこまでデザイン性を追求しないのであれば有効な手段です。
実際のWEBデザインやシステム開発の現場では、工数短縮のため、既にあるコードを流用するのが通例です（動作が保証してあるから）
タイトルや文章は「テキストテキスト…」、画像は長方形の枠だけのダミーデータで十分です。
ブラウザで表示しながらHTMLとCSSファイルを修正していく形でトップページとサブページの２種類のテンプレートを用意しました。
原稿と画像の実装
上記の工程が完了すれば、あとは機械的に進められます。
原稿の通りの流れでタイトル、画像、本文をテンプレートへ当てはめていきます（コピペ）。
HTMLを学習した経験のある方であれば、見出しや本文のことを「要素」として理解していることでしょう。当てはめるべきところに、その要素を持った部品を組み合わせていくようにしてコーディングを行いました。
動作確認（チェック作業）
誤字脱字、想定したリンク先のページに飛べるか、中途半端なところで改行がされないかといった観点でWEBページのチェック作業をします。「基本はコピペ」なのですが、リンク先の変更が漏れていたり、表示させたい画像が横長の画像を表示させたいところで縦長サイズの指定をしていたりと少なからず間違いはあります。
「自分が作ったのだから間違いはない」といった過信はいけません。
「ケアレスミスがある」ことを前提にあら捜しをするつもりでチェック作業を行いました。
