2003年 Webデザインの間違い・トップ10

ミニマリスト・デザインの採用、アーカイブの維持管理、包括的なサービス提供といった面では改善が見られた。しかし、一連の進歩にともなって、それ自体がユーザビリティ上の問題を生んでいる。そのうちのいくつかは、2003 年に目立った間違いとなって現れている。

以下は、最近、Webサイトで私が特にイライラさせられる 10 のリストだ。

Webデザインの間違い・トップ10

1. 目的の表記が不明確

多くの企業、特にハイテク業界では、その目的を示す言葉があいまいだったり、一般的だったりする。この基本的な事実をぼかすと、ユーザにとってWebサイトの情報やサービスの理解するのが、非常に困難になる。

小さな種子からでも、しっかりしたメンタル・モデルを育てあげることができる。あとから追加されるデザイン要素のひとつひとつが、そのサイトに関するユーザの理解に積み重ねられていくのである。しかしながら、多くのサイトは、ユーザの心の中にぼやけたメンタル・モデルを作っている。なぜなら、他の事実を適切な文脈の中に配置する上で欠かせない、もっとも重要な事実を提供しそこねているからだ。

2. 過去記事の URL 変更

アーカイブがあれば、ごくわずかな労力で、サイトの価値をかなり向上させることができる。古いコンテンツを保管するサイトは増えているが、ほとんどのサイトはよいアーカイブを維持管理できていない。中にはアーカイブを別コーナー扱いにし、メインエリアからの移動にともなって、まったく新しい URL をつけてしまうサイトもある。

アーカイブに新しい URL を割り当てると、リンク切れを生む原因になる。また、他のサイトが、あなたのサイトへのリンクをためらうようにもなる。あるサイトが、最新記事にリンクを張ろうかどうか迷ったとき、もし過去にリンク切れで痛い思いをしたことがあれば、リンクをやめること多いはずだ。なぜなら、ページを移動された時に、自分のページをアップデートするのが面倒だからだ。

3. 日付のないコンテンツ

記事やプレス・リリースなどのコンテンツに日付が入っていないと、読者にとって、その情報が最新なのか、時代遅れなのかを判断することができない。コンテンツをアーカイブしておくことはすばらしいことだ。例えば、Alertbox は、読者の 80%を古い記事で得ている。有益と思ってくれる読者がまだいるからだ。しかし、中には日付に大きく依存した事実や推奨事項もある。たとえば、私が、あるパッケージ・ソフトウェアの特定のバージョンをあと 2 年間使い続けるように、と書いたとしよう。当然ながら、私が言いたいのは、その記事の執筆時点から 2 年、という意味である。もし日付が見当たらなければ、読者はその助言にどう従えばいいのかわからないだろう。

最近、私たちは、投資家や経済記者による企業の投資家エリアの使い方について調査したが、そこでも似たような問題に遭遇した。あるユーザは、そのサイトの検索エンジンで見つけたニュース記事にもとづいて、その企業の現時点での事業予測を行なった。普通なら何の問題もない。だが、その記事のデータは数年前のものだったのだ。検索エンジンが、その記事に関して誤解を生むような日付を表示していたのである。たぶん、そのファイルを移動した日付か、タイプミスを修正した日付だったのだろう。

私のサイトの検索エンジンも、同じ問題を抱えている。オペレーティング・システムのファイル修正日時にもとづいているのだが、本来ならコンテンツの執筆日時にすべきところだ。そのため、私は検索結果に日付を表示する機能を取り除いた。このような日付表示は有益なものになりうるのだが、もし信用に足るものでなければ、利益よりもむしろ害のほうが大きい。もちろん、理想的なのは、検索エンジンに執筆日時を表示できるコンテンツ管理システムを採用することである。IT専属スタッフを抱えた大規模サイトなら、ぜひそうすべきだ。

4. ディテールの細かい大きな画像の小さなサムネイル

Webサイトが小さめの画像を使うようになったのはすばらしい。過去の肥大したデザインを避けることで、ダウンロード時間が短縮され、情報量は豊かになる。小さな画像から大きな画像にリンクするのもよいことだ。ユーザに、より詳細な画像を見るオプションを与えてくれる。

ここで大きな問題になるのは、元画像を単純に縮小して小さな画像を作成しているWebサイトが多いことだ。もし、元になる写真が細かく入り組んだディテールをたくさん含んだものだと、サムネイルは理解できないものになってしまうことが多い。

Thumbnail from the White House website

Thumbnail from CNN's homepage

左の写真は whitehouse.gov からのもので、合衆国大統領、内務長官、国立公園局の役員が Santa Monica mountains を歩いているところを写したものだ。私がそう言わなければ、サムネールだけでそんなことはわからなかっただろう。たんに 3 人の人が写った写真でしかない。どの公園かという以前に、公園にいるのかどうかすらわからない。

右の写真は cnn.com からもので、ここはホームページ上の縮小画像に関しては、たいがいよい仕事をしている。この写真は洪水の模様を伝えるものだ。こちらは、65 × 49 ピクセルしかないのに、何が起きているのかを明確に見て取れる。

Webで写真を使うときは…

  • 写真に入る人や物を少なくし、印刷用のものより複雑さを低減させる
  • 撮影対象に寄り、背景をシンプルにすることを心がける
  • 大きい画像から小さい画像を作るときには、関連性強調型の画像縮小を使う。ただリサイズするだけではだめだ。まず、はっきりとしたシンプルな要素に焦点をあてて、切り抜くこと。

5. 説明過多の ALT テキスト

多くのサイトが障碍を持つユーザに配慮し始めていて、画像に ALT テキストを付けるなどのアクセシビリティ・ガイドラインにしたがっている。

残念ながら、中には ALT テキストがユーザ・インターフェイス要素であって、単なる「世間体」ではないということを理解できていないサイトもあるようだ。ALT テキストは、目の不自由な人(その他、画像を見られない人)のナビゲーションと操作の補助となるべきものである。その画像のインタラクションにおける意味合いと、もっとも効果的にサイトを使う上でユーザが画像について知る必要のあることを記述しておかなければならない。関係のない視覚的な細部まで記述する必要はない。

例えば、自社のロゴに、次のような ALT テキストをつけていたサイトがあった。「IDEAS ロゴを使ったホームページへのリンク:ideas のまわりにふたつの三日月型、背景に日の出」サイト内のどこかで、ロゴ・デザインを文字で説明しておくのはいいだろう。目の不自由な人の中には、ロゴがどのような形をしているのか知りたがる人がいるかもしれないからだ。だが、読み上げ装置を使う全ユーザに対して、ページビューごとに、毎回、三日月型の数をアナウンスする必要はない。

読み上げ装置に 19 語読ませるには長い時間がかかる。過度の説明によって、重要な情報を拾い出すのが困難になる。この場合なら、それはすなわち、そのグラフィックがホームページへのリンクであるという情報だ。

Web用に文章を書く場合、短くするのがよい。読み上げ装置用の文章なら、なおさらだ。

6. 「もしも」のサポートがない

複数の選択肢の比較と選択は、もっとも重要なWebタスクの基盤となる。しかし、ほとんどのWebサイトは、複数の選択肢を考慮したいというユーザをサポートしていない。

もし、私が日曜日ではなく、土曜日に出発したいとしたらどうだろう。その違いは航空券の値段にどう影響するだろうか。ほとんどの旅行サイトでは、その答えを出すために、最初の画面からやり直して、まったく別の旅行プランを組み立てなければいけない。最初に日程を組み立てた時の作業は、すべて無駄になってしまう。

もし、私がモノクロ・コピー機ではなく、カラー・コピー機が欲しいとしたらどうだろう。しかも、私が今見ているモノクロ・コピー機のモノクロ以外の属性には満足しているとしたら。ひとつの属性を変えるだけでナビゲートできるだろうか。たぶん無理だろう。

中には、ユーザにいくつかの商品を選ばせて、比較表を出してくれるWebサイトもある。しかし、たいがいそういった比較表のユーザビリティは低く、商品間の一番重要な違いを目立たせてはくれない。

7. 属性による絞り込みができない長いリスト

以前は、ひとつのWebサイトで提供している商品はひとつかふたつだった。今では数千、数万といった商品を扱っているサイトも珍しくない。すばらしいことだが、そうすると、商品リストが長くなり、見にくくなる場合も多くなる。

カテゴリー・ページの主なユーザビリティ・ガイドラインのひとつに、関心のある属性によって商品の絞り込みができること、というものがある。リストを「絞り込む」ということは、基本的に、指定された判断基準を満たさない商品をふるい落とし、リストを短くして、扱いやすく、理解しやすいものにするということだ。

有効な絞り込みには 4 つの条件が求められる。

  • そもそも、サイトが絞り込み機能をサポートしていなければいけないが、大部分はそうなっていない。
  • 絞り込み用の属性は、ユーザにとって意味のあるものでなければならない。あまりにも技術的だったり、内部的なものはだめだ(例えば、パーツ番号。とはいえ、何が必要なのかわかっている顧客のために、これで検索できるようにしておいてもよい)。
  • 判断基準は、興味のある製品と無視したい製品を切り分けられるものでなければいけない。例えば…
    • クリスマスイブまでに届けられる商品だけを表示。
    • サイズ 10 の幅広がある靴だけを表示。
  • 最後に、もちろん、絞り込みプロセスを制御するユーザ・インターフェイスは、シンプルでなければいけない。そうすれば、ユーザは、サイト内の操作メカニズムではなく、属性と商品リストに集中できるようになるだろう。

8. ブランドだけで並べ替えされた商品

たくさんの商品を取り扱うサイトは、絞り込み機能と並べ替え機能を提供するべきだ。この方法はリストを処理する上で非常に有効で、幸いなことに広く採用されている。だが、不幸なことに、多くのサイトではブランドだけでしか並べ替えができない。つまり、例えばアルマーニの商品すべてを探すことはできても、赤いセーターをすべて探し出すことはできないのである。ユーザにとって重要な属性での並べ替えをサポートする際、最初に問うべき質問は、当たり前だが「ユーザはどんな属性を重要と考えるか」だ。商品の種類によって答えは変わってくる。ユーザ調査が、優秀なセールスマンと同様に、答えを見つける手助けになってくれるだろう。

9. 入力規則が厳しすぎるフォーム

負荷はコンピュータにかけるべきであって、人間にかけるべきでない。ユーザには、好きな形式でデータを入力させるべきだ。ユーザを不当に束縛するやり口としては、次の 2 つが一般的である。

  • 必要以上に書式にうるさい入力フォーム。ユーザがひとまとまりの情報と考えているものを、複数の入力欄に記入させるということは、カーソルを動かす無駄な時間を使わせるということだ。よくある例として、ユーザに名前と苗字を分けて入力させるものがある。単純に 1 つの入力欄にフルネームを入れる方が、ずっと早くタイプできる。もうひとつの例として、以下のようなものがある。
    電話番号: ( )
  • 手動でのフォーマット禁止。人間が好む自然な形式での入力を許さず、特定の形式での入力を強要するテキスト入力欄は、ユーザをイライラさせる恐れがある。例えば、クレジットカード番号を 1234567890123456 のような形で入力させるサイトが多いが、4桁ごとにスペースで区切った方が、はるかに間違える恐れは少ない。同様に、多くの人になじみがあるにもかかわらず、電話番号の市外局番を括弧で囲むのを許さないサイトもある。私たちの調査によると、長年慣れ親しんできた形式で入力できない場合、特に高齢者に被害が大きいことがわかった。

データ入力の制約が多いと、国際化の点でも問題になる。コンピュータが唯一絶対の形式以外受け付けないということになると、国外の顧客を排除してしまうことが多いからだ。

10. 今見ているページへのリンク

この点は、守られていないホームページのガイドライン・ベスト10の 10 番目で詳しく書いたが、ホーム以外のどんなページでも、同じように大切なことだ。

Webユーザビリティ:二歩進んで一歩下がる

今年のデザイン上の間違いのトップ項目は、その多くがむしろ喜ばしい現象の表れだ。Webユーザビリティは進歩している。ある面で正しいことができるようになった今、私たちは二次的な現象に見舞われているのだ。それが問題になるのも、一次的な問題を乗り越えてこその話だ。

例えば、ALT テキストのよしあしの問題は、アクセシビリティに配慮して、なんらかの ALT テキストを入れたサイトでしか発生しない問題だ。その他、今年上位に入った問題は、画像サイズを小さくしてダウンロード時間を抑えようとしたサイト、良質なアーカイブを維持管理しようとしたサイト、品揃えをよくしようとしたサイトで発生した問題である。いずれも、デザインの方向性としては正しい。ただ、最上級のユーザビリティ効果を得るためには、細部にまで注意を払う必要があるのだ。

過去のトップ 10 リスト

過去のトップ 10 リストの多くは、今日のWebサイトにもまだかなり該当する。新しい間違いが増えたからといって、古い間違いがなくなるわけではない。もっとも、それらを目にする機会は(幸いなことに)確実に減ってきている。

2004 年の間違い:優先順位

現時点で、私は、文字通り1 千項目以上のユーザビリティ・ガイドラインを出版したことになる。すべてのサイトがすべての項目に対応できないことを考えると、もっとも重要なガイドラインはどれになるのだろう。これが新しい調査プロジェクトのテーマであり、この中で、私たちはユーザの行動を幅広くテストし、どのユーザビリティ項目が最大の問題になり、最大の補助になるのかを明らかにするつもりだ。この結果は、4 月と 5 月に、合衆国、ヨーロッパ、オーストラリアで開かれる Web Usability 2004 セミナーで発表する予定だ。

2003年12月22日