フリートーク > 2001年2月1日バックナンバー
Webとうんちくの日々
先日某所にて、マクロメディアさんの新製品「Dreamweaver4 日本語版」「Fireworks4 日本語版」それから「UltraDeveloper4 日本語版」についてのうんちくをしゃべってきました。言いたがりの樋渡、山ほど語りたいことがあったんですが、時間の関係上ほとんど割愛せざるを得なかったのがかなり不本意でした(^^;)。
というわけで発表されたマクロメディアの新製品群、機能についてはすでにWebで発表されているのでそちらを参照していただくとして、そろそろこういったWeb制作ツールも次の段階に向かっているのではないかと思います。
これまでさまざまなメーカーからさまざまな種類のWeb制作ツールやグラフィックツールが発表されてきました。「きれいに、軽く」というのは当たり前、初心者向けのツールには最初からいくつものテンプレートが用意されていますし、素材集なんかも発売されているので、ある程度の見栄えのものは（パソコンを使える人なら）誰でも作れるといっても過言ではないでしょう。
ところが、実はWebサイトというものは「きれい」であるだけではいけません。なぜなら、Webサイトはテキストと画像だけで成り立つ「一枚の紙」ではないからです。
私がWebサイトに必要不可欠であると思っている要素にはいくつかあるのですが、まず
（1）ナビゲーションがスムーズに行くかどうか、すなわちユーザーが目的のコンテンツにたどり着きやすいようにナビゲートできているか
（2）コンテンツの整理
（3）サイトイメージの統一性
これらがもっとも重要ではないかと考えています。
（1）の場合、たとえばある製品の情報を入手するために企業のサイトを訪れたけれども、どこにその製品情報が掲載されているのかわからない、わかったとしても、そこにたどり着くまでに何回もクリックをしなければいけないのでは、ユーザーに見放されることでしょう。
また、ブラウザの「戻る」ボタンは左向きの矢印、「進む」ボタンは右向きであるのを私たちは習慣的、直感的に理解できますが、こうした人間の直感的な感覚を無視したレイアウトやボタンの作りかたはあまりほめられたものではないと思います。
さらに言うと、リンクボタンだと思ってクリックしたらただの画像で、ただの画像だと思ったらリンクボタンだった、なんてこともありますから、「これはリンクボタンである」とひと目でわからない画像は、ナビゲーションを困難にします。
また（2）を軽視してしまうと、コンテンツが整理されていないためにどこになにがあるのかわからない、まったくテーマの見えないサイトになってしまうこともあります。メニューボタンの多すぎるトップページを見たときに、「なんじゃこりゃ！ 俺はどこを見りゃいいんだよ！」って思いませんか。不要なコンテンツは極力省き、必要・可能であればひとつのカテゴリーに束ねる。このサイトのテーマ、もしくは売りのコンテンツはこれである！ 胸を張って言えるほどにコンテンツの整理整頓ができていなければ、訪れた人にはちんぷんかんぷんのサイトにしか見えないのです。
最後の（3）を軽視してしまうと、サイトのテーマに沿った配色、雰囲気作りをしていないために訪れた人に違和感を与えてしまいます。たとえば「ゆうぞーの愛の小部屋」というサイトタイトルなのに、黒バックに金属的なボタンを配置したサイバー風（笑）デザイン。これってなんかタイトルにイメージがそぐわないですよね。「愛の小部屋」と聞いたとき、その言葉のイメージからピンクなどのやわらかい色を想像することでしょう。サイトタイトル、コンセプトにあわせた配色は、イメージづくりにもっとも威力を発揮します。
これらは、どれも初めてサイトを訪れた一見さんにとって非常に重要なことです。きれいなサイト、コンテンツの充実したサイトであっても、ナビゲーションが悪かったりすればWebサイトとしてはあまりほめられたものではないと私は思います。
ここで自分のサイトの分析をしてみました。
（1）に関して、メニューボタンが英語であるために、ユーザーにコンテンツの内容を伝えにくくしている点が指摘できます。英語にしたのはスタイルシートで欧文フォントの指定がしやすいためですが、極力わかりやすい単語にすべきだなと反省しています。各コーナーの階層は最大3階層までなので、それほど目的のコンテンツにたどり着きにくいとは思いませんが、せめて2階層までにしておいたほうがいいかもしれません。
（2）に関して、メニューの数とコンテンツが増えてきたので、そろそろメニューを再考しなければなぁと思っています。いま現在CGIを使ったコンテンツが4つ、これらは極端に言えば「コミュニティ」というカテゴリーでひとくくりにできます。さらに、メインコンテンツである小説やイラストのコーナーと、サブコンテンツであるFreeTalkやCGIのコーナーと、メニューの大きさが同じであるというのも難点。いちばん注目してほしいメニューは大きくして目立たせるなどの配慮も必要かなと思います。
（3）に関して、イメージづくりには失敗していないのではないかと自負（笑）しています。必ずテーマカラーを決めてすべてのページに同じフォーマットを適用しているので（CGIを除く）、デザインの統一性という点では成功していると思います。ただし、同系色を使用しているために、おとなしい、地味な印象を与える点は否めません。差し色を使って注目して欲しい項目を目立たせる配慮も必要かもしれません。
日本ではWebサイトのことを「ホームページ」と呼んで久しいのですが、私はこの「ホームページ」という言い方が大嫌いでして(^^;)。なんか語感から「自己満足の固まり」みたいな気がするんですよね。開かれた感じがしないっつーかある意味排他的な感じがするっつーか（※注：もともと『ホームページ』とは、ブラウザを開いたとき、あるいはホームボタンを押したときに表示されるホームグラウンドなWebサイトを意味する言葉です）。
「個人で作るホームページだからなんだっていいじゃない」という人もいるかもしれません。確かにそうですが、自分が何かを発信したくて構築したサイトを、多くの人に見てもらいたいと思うのは当然。しかし、多くの人に見てもらうための努力を怠っていたのでは、誰も見てくれません。見やすいサイトづくり、見てもらうためのサイトづくりには、「ホームページを作ろう！」ではなく、「サイト全体をよく考えて構築しよう！」という意識が必要だと思うのです（※注：ちなみに見てもらうための努力としての宣伝活動は、サイト構築のあとの「サイト運営」に当たるので、ここではまったく別のものとして区別します）。
いちばん最初に書いたマクロメディアさんのDreamweaverやAdobeさんのGoLiveは、「サイト構築」に適した非常に優れた使いやすいソフトです。プロのデザイナーも使っていますから、そろそろ我々ふつーの人もサイト構築を意識する時代がきたのかなと思います。
Web制作において、プロが当たり前にやっていてふつーの人がやらないことというのがたくさんありますが、プロとアマの違いはここにあります。たくさんあるのですが、決定的なことを書き出してみるとこんな感じ。
Webデザイナー:
はじめに伝えたいことがあって、次にコンテンツを整理し、それからデザインを起こす
一般人:
適当なテーマでとりあえずホームページを作り、それからコンテンツを充実させていく
プロはまず最初にコンセプトとコンテンツを整理し、それからそれをうまく伝えるにはどんなデザインがいいのかを考え、ラフを描きます。このときに（1）（2）（3）がクリアされています。この段階までに、どのメニューの下にどのコンテンツがあってどことリンクされているのか、ツリー構造までもがこと細かく決められます。それからデザインを起こし、そのデザインを元にHTMLコーディングを行うのです。
しかし、我々一般の人は、すぐにトップページを作ってそこからコンテンツを作り始めます。そのため、コンテンツが増えたときにデザインが統一されていなかったり、建て増しの建て増しのようにメニューが増える一方、リンク切れも多いしナビゲーションは最悪、突然路線変更もあったりして、非常にバランスの悪いサイトになります。
家を建てるのも本を出すのも企画書を書くのも、すべてこうした手順が基本だということを考えると、そんなに難しいことではないでしょう。
「そんなのできねーよ」と言うかもしれませんが、だからこそ、前述のDreamweaverやGoLiveのようなサイト構築に適したソフトがあるわけです。Dreamweaverなら、FireworksやPhotoshopで作成したレイアウト画像（今度のFireworksはPSDファイルのレイヤーとマスクも読み込めるようになったのだぁ！ うぉすげいぜ！）をもとにデザインを起こしていくことが可能なわけですし、GoLiveであればPhotoshopと連携してダイナミックなレイアウトが可能。それぞれにテンプレートが数多く付属しているわけですから、それを使って応用してみるのも悪くありません。
自分の力だけではなかなかできないことを、ソフトをうまく使って実現させるちょっとしたインチキも必要ですね。私なんかこうしたインチキのおかげでメシ食わせてもらっているようなもんですから。(^^;