モバイルユーザーエクスペリエンスの現状

モバイルユーザビリティについての最新の調査から、モバイルのUXが改善していることが明らかになった。レスポンシブデザインの流行の影響により、サイトやアプリでUI要素よりコンテンツが重視されるようになり、重要なコンテンツや機能がモバイルにも取り入れられるようになってきている。

モバイルのUXガイドラインについてのレポート第3版では、この分野が過去7年間でどう変化してきたかについて、深く考えさせられた。2009年当時、ニールセン博士はモバイルユーザビリティという言葉は表現として矛盾していると判断した。つまり、ほとんどのモバイルサイトのユーザビリティはひどいものだった。デザイナーがデザイン空間を探索して、さまざまな選択肢を試しているところだったからである。しかし、今や、モバイルのユーザビリティは改善され、携帯電話での利用時でも多くのサイトのユーザビリティはそれなりになっている、と自信を持って言えるようになった。

ファッション同様、UIデザインのトレンドにも繰り返しがあり、毎年、新たな「スタイル」がシェアを獲得する。スキューモーフィズムやフラットデザイン、アコーディオン、タブ、ハンバーガー、ジェスチャー、無限リスト、ミニIA等、我々がここ数年間、見てきたのは、こうしたスタイルの多くが現れては消え、その後、復活する様子である。中にはモバイルWebが始まって以来ずっと存在し続けているものもあるが。

では、モバイルユーザビリティにおける現在の変化は何によってもたらされているのだろうか。

その原因の1つは、単に、メディアに対する経験である。モバイル向けのデザインを始めたのがiPhone発売時の2007年までさかのぼれるなら、今や我々は9年間、経験を積んできたことになる。これはデスクトップWebでの経験に比べればかなり短いものだが、それでもデザインの選択肢を探り、試してみるには十分な時間だろう。

モバイルに合ったエクスペリエンスを提供する必要があることを大半のサイトがついに理解した、というのも理由の1つである。旧版のモバイルレポートでは、我々はある程度のページを費やし、モバイル用にエクスペリエンスを微調整することの必要性を企業に納得させようとした。しかし、もはやこうしたことは必要ないだろう。フルサイトのエクスペリエンスはモバイルではそう簡単に提供できないことをほとんどの企業が理解したからである。したがって、ユーザーエクスペリエンスをなぜモバイルに最適化しなければいけないかについて、我々は論じなくてもよい。

最後の理由として、レスポンシブWebデザイン(RWD)の人気がモバイルのユーザビリティに全体的に良い影響を与えているということも特に言っておきたい。

レスポンシブデザインのモバイルユーザビリティへの影響

つい最近、Twitterで、今でも「2015年時点のレスポンシブデザインよりも、モバイルサイトのほうが好きですか」と聞いてきた人がいた。このやりとりは我々の書籍、「モバイルユーザビリティ 使いやすいUIデザインの秘訣」と、論争の的となり、よく誤解されているJakob Nielsenの記事、「モバイルサイト vs. フルサイト」がベースになっている。

端的に言えば、私の答えは「いいえ」だ。モバイルサイトとレスポンシブなサイトのどちらかがより好きというわけではないからだ。私が本当に良いと思うサイトとは、モバイルにとっての最適なユーザーエクスペリエンスを提供しているものであり、サイトの種類は問題ではない。そして、最高のエクスペリエンスはモバイル専用サイトによって提供されることもあれば、レスポンシブサイトによって提供されることもある。

実際のところ、サイトがレスポンシブかどうかはユーザーにはどうでもよいことである。というのも、単純に言って、彼らにはモバイル専用サイトとレスポンシブなサイトの違いがわからないからである。彼らにとっては、デスクトップサイトと見た目が異なるサイトはすべてモバイルサイトとなる。そして、モバイルサイトのユーザビリティが悪ければ、それは「モバイルに最適化」されてないサイトなのである。(ほんのひと月前のことだが、レスポンシブデザインを採用していることで非常に有名なサイトの1つであるBoston Globeのサイトに対して、調査参加者の1人が、モバイルに最適化されていない、と不満を言っていた。なぜならばページが長すぎて、あるページで探していたものを何も見つけられなかったからである)。

ユーザビリティの観点から言うと、サイトがどのように実装されているかというのは重要ではない。レスポンシブであろうと、モバイル専用であろうと、どのデザインもモバイルデザインに関する同じルールに従う必要があるからだ。レスポンシブかモバイル専用かの違いとは、コンテンツと機能にパリティ(訳注:サイトを閲覧する端末の種類を問わず、同様の内容を提供すること)があるかどうかだと主張する人もいるかもしれない。しかし、これは当てはまらないこともある。レスポンシブなサイトの中にもデスクトップサイトで利用可能な機能やコンテンツをすべては表示しないものもあるし、モバイルサイトにもコンテンツと機能のパリティをしっかり持っているものはあるからだ。さらに言うと、多数のサイトにとっては、コンテンツと機能のパリティは正しい解である。しかし、モバイルの良質なエクスペリエンスを実現するには、コンテンツや機能を削減しなければならないサイトもある。

RWDとモバイル専用の主な違いは戦略や実装の次元の話である。つまり、レスポンシブなサイトの背後には独自のコンテンツリポジトリと統一された戦略が必ずある。そして、そうした観点からすれば、取り組みが重複するのを避け、どのデバイスでも同じコンテンツを提供するというのが理にかなっているのは間違いない

しかし、私はレスポンシブデザイン自体についての話をしたいわけではない。私が論じたいのは、ここ数年間にレスポンシブデザインがモバイルユーザビリティに及ぼした影響についてだからである。そして、私の考えでは、その影響は全体としては良いものであり、この数年間でその影響は大きく増してきている。

というのも、RWDはモバイル向けのデザインをするところから始めることが多いため、モバイルユーザビリティの基本的な原則への意識が高まってきているからである。こうした原則はモバイルWebのごく初期の頃から存在してはいた。しかし、RWDの人気から焦点が当てられるようになり、より重視されるようになってきたと言えるだろう。

RWDによる1つめの影響に関して言うと、先ほど述べたように、モバイル専用サイトとレスポンシブサイトを区別するものはコンテンツと機能のパリティではない。実際、すべてのレスポンシブサイトがモバイルでもフルサイト同様の機能とコンテンツを提供しているわけではない。とはいえ、RWDによって、少なくともなんらかの形でコンテンツと機能のパリティを提供するほうが望ましい場合が多いことがはっきりした。結果として、モバイルでもそれなりのエクスペリエンスを提供する必要があるということ、つまり、無作為に選んだ2、3個のコンテンツではごまかせないということをほとんどの企業が理解するようになった。ほんの数年前、IKEAのモバイルサイトのベッドルーム家具のリストに表示されるのはシングルベッドが1種類だけだった。しかし今では、好き勝手にモバイルのコンテンツを限定してはならない、ということを大半のサイトがしっかりと理解している。質問がモバイル、デスクトップ、タブレットのどこから投げかけられたものであれ、それに対する回答は同じであるべきだからである。

レスポンシブデザインが持つ大きな意義の2つめは、モバイルではコンテンツがクロームよりも優先されなければならない、ということをサイト側がついに理解したことである。(「クローム」とはボタンやメニュー、リンク等のすべてのUI要素のことである)。しかし、これはデザイナーがコンテンツ対クローム比のモバイルにおけるスイートスポットを見つけたということではない。つまり、ナビゲーションをハンバーガーメニューの下に隠すほうがいいのか、そうではなく、タブバーに表示したり、短縮して細いナビゲーションバーに入れるほうがいいのかを彼らは引き続き調査・実験中である。しかし、モバイルではコンテンツを優先する必要があるということについては、デザイナーたちはついに一致したようだ。

最後になるが、レスポンシブなサイトにメリットをもたらすことが多いテクニックの一部が、違うタイプのサイトやアプリにも採用されはじめており(たとえば、スティッキーナビゲーションやページトップに戻るボタン、アコーディオン、また、盛んに論じられているハンバーガーメニューも)、結果的に採用先のユーザビリティもたいていは改善されていることは言っておきたい。(ナビゲーション用のハンバーガーメニューについての注意: ハンバーガーメニューを利用することで、モバイルにおいてさえ、ナビゲーションの発見しやすさは必ず損なわれる。しかし、サイトやアプリの中には、それでもなお、それがソリューションとして最適と思われるものもある)。

デザイナーが今も学ばなければならないこと

では、RWDがモバイルユーザビリティの改善に役立っているというなら、レスポンシブサイトのほうがモバイルではよりユーザブルということになるのだろうか。必ずしもそうとは限らない。RWDのおかげでコンテンツが優先されるようになり、コンテンツパリティが議論されるようになって、モバイルデザインは全体に恩恵を受けている。しかし、RWDがモバイルのユーザビリティにもたらした影響にはマイナスのものもある。そのもっとも重大なものがたぶん超長尺なページによる影響だろう。ページの折り目は重要ではないとデザイナーは教わってきた。モバイルの画面は非常に小さいので、スクロール以外にユーザーにはできることがない、というのがその理由である。そして、そう、ユーザーはスクロールをする。しかし、それは彼らがそうしたいと思う場合に限られるのだ。長いページの問題点を解決する方法というのは存在しており、良質なサイトではそうしたやり方をうまく利用している。たとえば、長いページはミニIA(ページ冒頭に置かれるミニ目次)と相性が良い。それによって、何についてのページであるかがユーザーに伝わるし、さまざまなセクションへのダイレクトアクセスが実現するからだ。また、モバイルの長いページはアコーディオンやスティッキーナビゲーション、ページトップに戻るボタンと組み合わせるとうまくいく。レスポンシブであるかどうかにかかわらず、こうした構成をうまく利用するサイトがますます増えてきている。とはいえ、これらはまだハンバーガーメニューのような主流のコンセプトにはなってないが。

デザイナーにいまだによく理解されていない重要な課題に、モバイルのコンテンツは階層になっている必要がある、というものがある。これはコンテンツを好き勝手にカットしたり、非表示にしたりするということではなく(残念ながら多くのサイトではこういうことが行われている)、要点を優先し、詳細は補助的なページに先送りしなければならない、という意味である。

そして、最後に重要なこととして指摘しておきたいのは、デスクトップベースの階層の深い情報アーキテクチャを2階層のナビゲーション(モバイルでのユーザブルなナビゲーション)に収める方法も知る必要がある、ということだ。深さのある情報アーキテクチャ(デスクトップでは階層メニューによってサポートされていることが多い)のモバイルへの移植は難しい。コンテンツにたどり着くのにあまりにも多くのステップをユーザーに強いることが多いからである。

デスクトップユーザーにとってのレスポンシブWebデザイン

残念ではあるが、レスポンシブWebデザインのデスクトップサイトのユーザビリティへの影響については、ほぼ正反対の内容の記事を書くことになるだろう。モバイル向けのデザインからRWDをスタートするという考え方はモバイルにとってはすばらしいものだが、デスクトップにとってはかなり悲惨なものだからである。最近、長いデスクトップページで、情報が不足していて、ナビゲーション検索が非表示だったり、大きな画像が置かれ、コンテンツをクロームよりも重視するということの意味をよくわかってないようなものを見かける。ユーザーが複数のプラットフォームにわたって存在している場合には、残念ながら、1種類のデバイスだけを念頭に置いたデザインはできない。つまり、我々は各デバイスの特徴と長所を考慮し、コミュニケーションチャネルの容量がそのデバイスに合うように自分たちのデザインを微調整する必要があるのである。

調査の最新レポート

モバイルのユーザーエクスペリエンスに関する新レポートには、モバイルユーザビリティについての我々の調査結果やガイドラインが多数収録されている。最新のこの第3版はまったく新しい全面改訂版である。ガイドラインの多くは現在のモバイルのパターンやインタラクションを反映したものだが、従来からのガイドラインで引き続き残されたものについても新しい事例によって刷新が行われている。

さらに学ぶ

調査レポート(英文)