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

1996 年に私が指摘したデザイン上の間違い『トップ10』は、今なおWebの使いやすさに悪影響を及ぼしており、現に多くのWebサイト上に散見される。その意味では、この 3 年で、あまりたいした変化はなかったとも言えるだろう。

しかし、不幸なことに、新たなWeb技術と、新たなWebの応用によって、 まったく新しい種類の間違いが導入されてしまった。ここに挙げるのは、そのうちでも最悪の10ヶである。

1. 動作しない、あるいは反応の遅いBackボタン

Backボタンは Web ユーザにとって生命線であり、(ハイパーテキストリンクに次いで)二番目にもっともよく用いられるナビゲーション手段である。Web上で何をやろうが、Backボタンを 1、2 回押すだけで、いつでもおなじみの場所に戻って来られるというのは、ユーザに安心感を与える。

当然ながら、以下のようなデザイン上の罪悪を犯しているサイトではBackボタンは通用しない。

  • 新しいブラウザウィンドウを開く(間違い #2 を参照せよ)
  • 瞬時にリダイレクトをかける:Backボタンをクリックする度に、ブラウザは勝手な場所へユーザを跳ね飛ばしてしまう
  • キャッシュを効かなくしてあるので、Backする度に、毎回サーバへデータを読みに行く。あらゆるハイパーテキストナビゲーションは、1 秒以下で実現されるべきであるが、バックトラック(逆方向への移動)は、その 2 倍の速さが求められる。

2. 新しいブラウザウィンドウを開く

新しいブラウザウィンドウを開くというのは、訪問するやいなや、お客様宅 のカーペットに灰皿の中身をぶちまけて歩く、真空掃除機のセールスマンにひとしい。勝手にウィンドウを開いて、私のモニタを汚染するのはやめてもらえないかね、頼むから(特に現在のオペレーティングシステムは、おそまつなウィンドウ管理機能しか提供していないのだから、なおさらだ)。新しいウィンドウが必要だと思ったら、自分で開くよ!

新しいブラウザウィンドウを開けば、理論的にはユーザがサイトを離れてしまうことはないとデザイナーは考えるようだ。ユーザのマシンを勝手に操作するということ自体、そこに敵意あるメッセージを感じ取れるわけだが、それを別にしても、以前いたサイトに戻るためのもっとも当たり前のやり方、すなわち Back ボタンを使って元に戻れなくなるわけで、戦略的にも自己破壊にしかなりえない。ユーザは、新しいウィンドウが開いたことにすら気づかないこともある。特に小さなモニタを使っていて、ウィンドウを全画面サイズに広げているとそうなりやすい。ユーザが元に戻ろうとしても、Back ボタンがグレーになって押せなくなっているので混乱するというわけだ。

3. GUI 部品の非標準的な使い方

一貫性を保つことは、使いやすさを向上するためのもっとも重要な原理のひとつだ: 物事がいつも同じように動いていれば、何が起こるかいちいち心配する必要はない。反対に、それ以前の経験を元にして、次に何が起こるかを予測することができるだろう。アイザック・ニュートン卿の頭上でリンゴを放せば、彼の頭に落下する。それでいいのだ。

期待通りの結果が得られ、システムをコントロールしているという実感が得られれば、その分、彼らに気に入ってもらえるだろう。彼らの期待を裏切れば、その分、彼らは不安になるだろう。おっと、このリンゴを放したら、突然トマトに変身して、1 マイル上空に飛び上がるかもしれない。

一貫したインタラクションという観点からも、新しいブラウザウィンドウを開くことの誤りは証明できる: リンクをクリックしたら、今までのペ ージと入れ代わりに新しいページが、同じブラウザウィンドウ内に表示される。これが標準的な反応だ。それ以外の反応は、すべてユーザの期待を裏切ることであり、Webの使い方に関して、彼らの自信をくじくだけだ。

現在、Web上で、もっとも一貫性を欠いているのは、ラジオボタンやチェックボックスなどの GUI 部品の使い方だろう。これらのデザイン要素の適切な使い方については、Windows ユーザインターフェイス規格Macintosh ユーザインターフェイス規格、そして Java ユーザインターフェイス規格に定義されている。これらの規格のうちいずれに従うべきかは、大多数のユーザが、どのプラットフォームを利用しているかによって決まる(たいがいは Windows だろう)。だが、どの規格もほとんど同じルールに基づいているので、もっとも基本的な部品の使い方について対立が生じることはほどんどない。

例えば、ラジオボタンについてのルールは以下の通り「一連のオプション からひとつを選択する場合に用いられるが、その選択結果はユーザが OK ボタンを押すまで確定しない」。不幸にも、クリックした瞬間何事かが起こるアクションボタンとしてラジオボタンを使っている Webサイトを多数見てきた。すでに定着したインターフェイスの常識を、このような勝手な解釈で曲げることにより、Webはますます使いにくくなっていく。

4. 人物紹介(バイオグラフィー)がない

1994 年の最初のWeb調査の結果、ユーザはWeb情報の背後にいる人間について知りたがっているということがわかった。特に、著者の人物紹介と写真は、Webに人間味を与え、信頼性を増す。パーソナリティと個性的視点は、しばしば、マスコミからの無記名の情報をしのぐことがある。

にもかかわらず、多くのサイトではコラムニストを採用していないし、署名入りの記事も避けようとする。署名入り記事を掲載しているサイトですら、記者の人物紹介や、あるいは同じ記者による別の記事へのリンクを提供し忘れている。

署名のところに、その記者の人物紹介へのリンクではなく、mailto: リンクを付けるのは特に間違っている。理由は2つある。

  • 著者にコンタクトを取りたいと思うユーザより、著者についてもっと知りたい(同じ記者の別の記事を見たい)というユーザの方が普通だろう。もちろんコンタクト情報は、人物紹介の中によく取り上げられる項目ではある。だが、著者について、コンタクト方法以外のデータが、ほとんど、あるいはまったくないのでは困る。
  • ブルーの下線が付いたテキストをクリックした時の反応として、新しいページへのハイパーリンクではなく、電子メール画面が開くというのは、Webの慣習に反している; このような一貫性のなさは、Webをますます予測不可能なものにし、ユーザビリティを損ねるものだ。

5. アーカイブ(過去の文書の保存用エリア)がない

昔の情報がよい情報である場合も多く、また読者にとって役立つ可能性もある。古い情報より、新しい情報の方が珍重される場合ですら、古いものにはそれなりの価値がある。オンラインで、そういった情報をキープしておくのには、たいしてコストもかからない。アーカイブを設けたとしても、サイトのランニングコストはおよそ10%しか上がらないが、有用性は50%ほど向上できると、私はにらんでいる。

アーカイブは、リンク切れを防止する唯一の方法であり、他のサイトからのリンクを促進するものでもある。

6. ページのURLを移動する

ページを移動すれば、外部のサイトから張られたリンクはみんな切れてしまう。タダでお客さんを紹介してあげよう、という人に対して、どうしてそんなひどいことをするんだろう?

7. 単体で見たらまったく意味がわからない見出し

Web用の見出しや、その他のマイクロコンテンツは、従来型メディアとは明確に違った書き方がある: 次の動作に結び付くアイテムなのだから、ユーザインターフェイスの一部となって、ユーザのナビゲーションを助けるように書くべきなのだ。

見出しは、ページ全体の文脈から離れて、目次(例えば、ホームページや、各セクションのトップページなど)の項目として利用されることがよくある。いずれの場合も、ごく簡潔に、次の2つのゴールを目指して書く必要がある:

  • ユーザが頭をひねらなくても、リンクの向こう側に何があるか理解できること
  • 興味のないリンクは、事前にそう判断できるようにしておくこと(おとり作戦は使わないこと — 1、2回はまんまとだませて、トラフィックを増やせるかもしれない。だが長い目で見れば、彼らはサイトに二度と来なくなり、信用も失うことになる)

8. 最新の流行語に飛び付くな

Webの世界は、お金と、それに、「オレなら、ありとあらゆる金食い虫のサイトを救ってやれるぞ」と吹聴する輩、この2つであふれんばかりだ。

プッシュ、コミュニティ、無料メール、3D サイトマップ、オークション – いいたいことはわかっていただけるだろう。

しかし、魔法の弾丸などありえない。たいていのインターネット流行語には、 それなりの中身があって、それをうまく活用できたいくつかのWebサイトに、わずかな利益をもたらす。たいていは、ほとんどのWebサイトが、 最新の流行を取り入れようとして失敗する。こうした流行ものを取り入れるための機会コストは、基本的なカスタマーサービスと使いやすさの充実に向けて、時間と、お金と、マネジメントを注力するより、ずっと高くつく。

来月には、また新しい流行りものが出てくることだろう。期待するのはかまわない。しかし、Jupiterがリポートで取り上げたからといって、すぐに飛び付くのは よした方がいい。

9. サーバのレスポンスの悪さ

レスポンスが遅いというのは、Webの使いやすさにとって最悪の障害だ。オリジナル版『トップ10』における調査でも、有名サイトの数々が、理想的なレスポンス時間規定の、実に恐るべし、84%オーバーというスコアしか出せなかった。

レスポンス時間の分野では、重いグラフィックデザインが悪の元凶である。中には、いまだに必要以上に数多くのグラフィックや、大きなグラフィックを使っているサイトが存在する。普通のHTML、あるいはダイナミックHTMLでできることなのに、わざわざアプレットを使っている場合もある。だから私は、まだまだダウンロード時間短縮のための戦いをやめるわけにはいかないのだ。

Webベースのアプリケーションや、Eコマース、あるいはパーソナライゼーションといったものの進展にともなって、各ページが、必要に応じてそのつど自動作成されるということが珍しくなくなった。 この結果、ページ表示までの待ち時間は、たんにダウンロードの時間(あいかわらずよくないが)だけでなく、サーバのパフォーマンスにも影響を受けるわけだ。時には、バックエンドのメインフレームや、データベースサーバに接続しないとページが作成できないこともあり、一連のプロセスを、なお遅くしている。

ユーザは、なぜ時間がかかるのかなんて理由には興味がない。ただ、そのサイトはサービスが悪いと思うだけだ。レスポンスが遅いと、即、信用の低下に直結することもある。そうなれば、必然的にユーザは別のサイトへ商談を持って行ってしまうから、トラフィックも減る。だから、高速なサーバに投資しなさい。 パフォーマンスエキスパートを呼んできて、システム構成と、コードの品質を見直してもらい、最高のレスポンスが得られるよう最適化してもら いなさい。

10. 広告に見えるものすべて

選択的注意というのは、とても強力なものだ。なんらかのゴールを目指してナビゲーションしている際に、その障害になる邪魔な広告は無視するという能力をWebユーザたちは身に付けた。毎年、クリック率が半減するのも、Web広告はうまくいかないというのも、これが原因だ。

不幸にも、本来のデザイン要素であるにも関わらず、それがよくある広告の形式に似たものだったりすると、ユーザは、これも無視してしまうのだ。 結局、何かを無視するということは、それがいったい何なのか、いちいち調べてみたりはしないということだ。

このため、広告と似たように見えるデザインは、なんであれ避けるのがベストだ。広告のスタイルが変われば、このガイドラインが示す意味も変化する。とりあえず、今のところはこういったルールに従うべきだ。

  • バナーを無視するということは、すなわち、その形態や、ページ中の配置位置がバナー広告のように見えるものには、ユーザは目を止めないということだ
  • アニメーションぎらいのユーザは、ブリンクしたり、光ったりするテキスト、あるいは、その他の攻撃的なアニメーションが置かれたエリアが目に入らない
  • ポップアップ追放家とは、画面に何が表示されるか待つまでもなく、子ウィンドウを閉じて回るユーザのこと; 時にはひどい悪態をつきながら (この仕返しは、Geocities に対してはある種の勝利を収めた)。私は、ポップアップを完全に排斥するわけではない。時には、インターフェイス上の生産的部品になりうるからだ。しかし、一度もポップアップを見たことのないユーザでもサイトが利用できるように、別のナビ ゲーション手段も用意しておくことをお勧めする。

1999年5月30日

公開:1999年5月30日(原文:1999年5月30日)
著者:Jakob Nielsen
原文:The top ten new mistakes of web design

分類キーワード