【ウェブユーザビリティ洞察】自動送りカルーセルとアコーディオンは、ユーザーをいらつかせ、可視性を下げる……ニールセン博士のAlertbox

ブロードバンドウェブ

注目記事

2013.7.7（日）10:00

■アコーディオンのような大きなカルーセル：無視される

　上のスクリーンショットが示すように、このページの大きなボックスには2点賛成しかねる点がある。利用しているのが（無視されがちになる）派手な体裁であることと、少しバナーのように見えることである。

　しかしながら、コンバージョンを実際に下げる要因を特定するには、静止画のスクリーンショットからは推定できないもう1つのヒントが必要になる

・そのボックスはアコーディオンのように見えるが、むしろカルーセルに近い動きをする。というのも、5秒ごとに自動送りによって新しいパネルを表示するからである。

　これは致命的である。アコーディオンやカルーセルはユーザーがそうして欲しいときにのみ、新しいパネルを表示すべきだからだ。そうでないかぎりは、静止し、そこにある情報をユーザーが落ち着いて読めるようにすべきであって、このユーザーがSiemensの大きなボックスについて言っていたように、彼らの邪魔をしてはならない。「読む暇がありませんでした。あっという間にどんどん行ってしまうものですから」。

　自動送りによって引き起こされるユーザビリティ上の問題は多い：

・UI要素が動くと、通常、アクセシビリティは損なわれる。それが行ってしまう前にクリックするのが難しい、運動技能に障害のあるユーザーにとりわけこれは当てはまる。

・識字能力の低いユーザーがその情報が消える前に読むには、時間が足りないことが多い。

・外国人のユーザーはサイトが母国語でない場合は読むスピードが遅くなることが多い。したがって、表示時間がごく短いとパネルの意味を理解できないだろう。

・常時、1つのものしか表示されないと、ユーザーが必要とするアイテムの見当をつける確率は大幅に減少する。例えば、Siemensの例では、お得な割引キャンペーンが見える確率は20％しかない。

・物事があちこち勝手に動いているときに、ユーザーがユーザーインタフェースのコントロールができないというのはイライラさせるだけである。

　最も重要なのは、それが動くことから、頭からユーザーにこれは広告だろうと決めつけられ、無視されがちになってしまうことである。

　今回の例では、ユーザーがページ上部を1回目に見直す間、100ポンドの割引というのは彼女の目には入らなかった。そして、彼女は少しスクロールダウンした後、残りの時間でホームページを見る間に二度とそのボックス全体を見ることはなかった。

　こうした大きなボックスの、機能不全を起こしたデザインは、中身のないコンテンツを不適切に利用することで、小さなボックス以上に悪影響を受けてしまう。例えば、アコーディオンでは、Rewarding.Life.Style（：実りのある、生活、スタイル）という意味不明な語句が、割引キャンペーンを表示するボタンのリンクテキストとして使用されている。

　役に立たない文字というのは常にもったいないものだが、ユーザーがいかにウェブサイトでテキストを読まないかを考えると、役に立たない言葉をリンクに使用するというのは大損害としか言いようがない。、情報の匂いはナビゲーションを成功させるための主要な要因の1つだからである。つまり、人々がクリックするのは、(a) 意味の理解できる、(b) 彼らの欲しいものを説明しているリンクだけなのである。

　例に使ったこのデザインには多くの欠点がある。しかし、最も重い罪は、静止させておくべきものを動かしていることだろう。有害な機能を使ってこのデザインを飾り立てることに、無駄に追加のお金が使われたかと思うと悲しい。そうではなく、企業のバリュープロポジションを明確に伝えるシンプルなコンテンツを作り出すことにのみ、そのお金は使われるべきだったのに。

【さらに詳しく】
■ウェブデザインの間違い・トップ10
■ミニIA： 1つの概念の情報を構造化する
■うまくいっていないメガメニュー
■アルファベット順は（たいていは）やめたほうがよい
■メガメニューはサイトナビゲーションに効果あり

※この記事は、ユーザビリティ研究者ヤコブ・ニールセン博士が運営するサイトuseit.comで連載中のコラム『Alertbox』の転載・翻訳記事です。株式会社イードが運営する「U-Site」では、博士からの正式な許可を得て同コラムの全編を日本語訳し公開しています。

最新コラムや詳細情報は「U-Site」で閲覧できます。