Webデザイナー Part2

　最初からWebデザイナーとしてキャリアを積んだWebデザイナーはまだ多くはない。現在のWebデザイナーの大半は印刷物の広告などをデザインしてきたグラフィックデザイナー（Ｇデザイナー。求人情報ではよくこう略されます）か、プログラマーからの転進組。
　それぞれの陥りがちなあやまちがある。 　特にグラフィックデザイナーは紙とWeb、２つのメディアのちがいに気づかず、失敗しているケースが少なくない。

「（Webという）メディアの特性を知らなければ伝え方を間違うし、伝える方法を間違えると伝わるものも伝わりません」

　月刊アスキーの連載時に取材させていただいたグラフィック＆Webデザイナーの内沼氏はこうおっしゃっていた。

　発注側もWebをよくわかっていなかった昔ならいざ知らず、現在では印刷物のデザインをそのままWebに持ちこんで通用する時代ではなくなっている。WebにはWebのデザインがある。しかし、多くのグラフィックデザイナーがそれまでの経験とノウハウにこだわって、Webデザインではまちがいを犯してしまっている。
　まずWebの特性をきちんと知っておきたい。

　リンクや検索結果からそのページに飛んできたユーザーはぱっと見た瞬間に、じっくり見ていくか、よそへ行くかを決める。瞬時にそのサイトの目的や雰囲気を伝えられなければおしまいだ。

　たとえばショップなら、何を売っているのかだけでなく、その店の特徴、売りを瞬間でアピールしなければならない。

　多くのWebデザイナーやWebデザイナー志望者のサイトがトップページを単なる入り口で終わらせているが、あれは自己満足、プロのデザイナーとしてはどうかと思う。

　トップページにFlashを使っているケースも多いが、あれでどれだけの客を逃していることだろう。
　特別なにかムービーでなければ見せられないものを見せる必要があれば別だが、そんなケースは稀。古いマシンなどで正常に見られないケースも少なくないし、いくらスキップボタンを用意されていてもそれを押すことさえ面倒くさい。邪魔くさい。

　考えてみてほしい。あなたが店などに入ろうとしたら、いちいち毎回入り口でショーを見せられるとしたら、どう感じるだろう？　非常に質が高いものだったとしても、１回だけなら見ても、二度目も三度目もとなったら、めんどくさくて、よその店へ行くことにしないだろうか？

　Webページの画像は印刷物とは比べ物にならないくらい荒い。
　印刷物のように細部の美しさにこだわって重い画像を使えば、表示に時間がかかり、結果、表示しきれないうちに次のページへと移動され、見てもらうことができないといった事態になる。

　どうしてもきちんと見せたい画像がある場合も、1ページに複数の軽量版を展示したインデックスを用意して、クリックすると別ページで大きなサイズの画像をじっくり見られるようにしておこう。
　↓　↓　↓
たとえばこの【食卓の写真集1】のように（姉妹サイトです）


　「ホームページの場合はディスプレイの調整1つでも色は変わってしまうので、画像の美しさの細部にこだわる意味がありません」

　グラフィックデザイナーは細かな質にこだわりがちだが、Webデザインを行なう場合は、内山氏のこの言葉をよくかみしめておいてもらいたい。

　最近はブロードバンドで大容量も快適と言われることが多い。

　しかし調査によれば、現在まだアナログ回線を使っているほうが多く、しかもそのひとたちはあえて早い回線に乗り換えたいとも思ってないようだ。

　やはりいまでも画像が多く、表示が遅い（いわゆる重たい）ページは嫌われる。特にトップページはついつい懲りがちだが、その実、最も軽くしておいたほうがいいページである。

　1ページのファイルサイズは36KB以内が理想。大きくても1MB以内にはおさえるようにしたい。

　HTMLタグは共通言語のはず。だが残念ながら実際にはWebブラウザによって独自の拡張タグが用意され、使えるタグと使えないタグがある。

　それどころか、あるWebブラウザ用のタグを使うと、他のブラウザではその行以降の命令がすべて読み込まれなくなることまである。
　たとえばスタイルシートのfont-familyはInternetExplorerでは使えるが、Netscapeではその行以降の命令が読まれなくなる。もしかしたら最近のバージョンでは解決されているかもしれないが、少なくともVer.4の時代はそうだった。

　またMacintoshとWindowsでは色やサイズなども異なってくる。

　特にホームページ作成ソフトを使って作った場合、注意しないと、そのソフトが前提としている環境では見えても、他の環境のマシンでは全く表示されないケースも少なくない。

　いくらホームページ作成ソフトが普及しても、プロのWebデザイナーはHTML言語は理解し、ソフトを使ってベースは作っても、最後は必ずソースを見て、チェックしたり、修正を加えたりするようにしたい。

　基本としてサイズは800×600で作ると、小さめのノートパソコンなどでもきちんと見てもらえる。特に横幅はスクロールせずに見られるサイズにしておきたい。

　デザインを装飾、飾りつけだと勘違いしているひとは少なくない。だがデザインとは目的に最適な形を設計することだ。

　Webデザインはまず目的ありき。目的に添ってそのサイトでアピールしたいイメージを訴求、見せたい部分を見てもらえるように作らなければならない。たとえばダーティで頑強なイメージを伝えたいときに、繊細で美しいデザインをしたら失敗だ。

　だが目的をとらえることが存外と難しい。

　ホームページ制作を請け負う立場の場合なら、上手にクライアント（依頼者）から目的を聞き出さなければならないが、当のクライアント自身がわかってない場合が少なくない。
　こう書くと、自分のサイトを作ろうとしているひとの中にはドキッとしたひともいるのではなかろうか？「時代に乗り遅れないように」とか「金をかけずに広告ができるなら(支店を出せるなら)」などと安易にサイトを作るひとは少なくない。

　ただ「目的は？」とたずねれば、あれもこれもと欲張った答が返ってくることも多い。
　だからまず一番重要な目的、欠かせない目的を絞り込め。

　たとえば商品広告ひとつでも「商品名を覚えてもらいたい」、「商品の機能を伝えたい」、「商品にステータスを感じさせたい」などいろいろあるが、絞り込まなければ効果は上がらない。
　新ジャンルの商品でその機能を伝えただけで売れる時期なら機能重視、どの会社のどの製品も価格も性能も変わらない時期なら広告でイメージをプラスしたり、商品名やパッケージをアピールするなど、時代、市場、周囲の状況などを見て決めていく。

　大きな目的が決まったら、伝えたいイメージを詰める。

　このとき重視すべきは客の視点だ。たとえばありふれた商品なのにオリジナリティを感じさせたいなど無茶な望みもまま聞く。そんな虚構は客にすぐ見破られる。一見魅力がなさそうなものもスポットの当て方次第で魅力的に見せられるものだ。ないものをあるように見せるのではなく、あるものの新たな魅力を見出すように考えよう。

　目的がきちんと見極められれば、おのずとデザインも絞り込まれていくもの。まずは目的発見から始めたい。

　ホームページが印刷物と決定的にちがう点はリンクだろう。
　印刷物の場合、ページ物を作るときは基本的には頭から順番に読まれていくことを前提とする。読者があちこち拾い読みするための手がかりは目次や索引と、章などのタイトルくらいのものである。

　これに対してホームページは構造がもっともっと自由。ひとつのページから飛ぶ先は次のページだけでなく、関連項目のあるページ、用語解説のページ、トップページ、索引ページなど複数あるほうが普通。

　このリンクで結ばれた構造の性質を充分理解して、それを生かせるか、生かせないかでそのサイトが見られるサイトになるかどうかが決まってくる。

　　「３秒、３クリック」

　見られるサイトのためのルールと言われている。３秒で全体が表示され、３クリックで最下層までたどりつける構造にしなければいけないという意味だ。３階層以上深いと、めんどくさがられて入ってきてもらえない。

　当然トップページには次の層へのリンクボタンを並べたインデックスが必要だ。トップページで中身が見えなければ、客は帰ってしまう。
　中身をわかりやすく、かつクリック数を減らすためにインデックスは工夫しよう。


《無意味に深い層構造》

《整理されてないインデックス》

《無駄のない層構造とわかりやすいインデックス》

　　かつてはトップページが重視されていたが、最近、ユーザーは下層のページから入ることが多くなってきた。
　ショップなどでも価格比較サイトや検索サイトでほしい商品のあるページを見つけて直行してくるケースが少なくない。
　下層ページにもっと留意しよう。

■「前へ」、「次へ」、「上へ」を活用■
　同類のページはいちいちインデックスまで戻って次のページを見なくても済むように「←」や「→」で次のページや前のページに移動できるようにしたい。
　またインデックスページへのリンクも忘れずに用意しておこう。

■行き止まりページは作らない■
　行き止まりのページは作らないように注意しよう。すべてのページに他のページへのリンクボタンを用意しておこう。

■１ページにひとつ絶対パス■
　後でよく読もうと、ページを保存するひとも多い。
　オフラインで見ていて、他のページを見たいと思った場合、リンクが相対パスで張られていると、クリックしても目的ページを開けない。

　サイトのURLがページ内のどこにも書いてない場合、どこのサイトだったかもわからず、そのサイトを再度探し出すのはとても大変。

　リンクはすべて絶対パスとしておきたいところだが、作る際、ローカルディスク内で確認できないのが不便。理想としては最後にサイトにアップする直前に相対パスをすべて絶対パスに書き換えたい。

　それが面倒な場合のお勧めはトップページへのリンクだけ絶対パスにすることだ。