なぜ、クロスデバイス対応は必要なのか?

「クロスデバイス」や「マルチデバイス」と言うと、どんな種類の端末(PC、携帯電話、スマートフォン、タブレット、テレビ、音声ブラウザなどなど様々)からでもアクセスできるように、ウェブサイトをデザインすることを指す。

クロスデバイス対応ウェブの具体的なデザイン手法については、現在のところ様々な試みがあるが、「クロスデバイス対応がなぜ必要なのか」、「クロスデバイス対応されていないと何が困るのか」を考えることで、クロスデバイスのあるべき姿に迫ってみたいと思う。

Twitterはクロスデバイスなメディア

TwitterやFacebookやmixiなどなどなど、ソーシャルメディアといえば数多あるが、その代表としてTwitterを例に取る。

例えば、とても気に入ったブーツがあって、それをTwitterで知らせたいとき、そのブーツの詳細ページのURLを貼り付けてつぶやく。これをみたフォロワーたちは、そのURLにアクセスして詳しい情報を得ようとするが、Twitterのユーザがみな自分と同じ端末でアクセスするとは限らない。携帯電話の人、PCの人、スマホの人、様々だ。

欲しいコンテンツは全員一緒、ブーツの詳細な情報であることは明白だ。詳細な情報を得られたあとにやりたいことは、それについての意見やコメントを発信することだ。しかし、ユーザのアクセス環境によってアクセスできなかったり、伝わるメッセージが変わってしまったりと、全員が同じ体験を得ていなければ、後の会話は繋がらないか、少なくてもそこで止まってしまい、広がることはない。

RSSもクロスデバイス

Twitterの例と同様に、RSSフィードも様々なデバイスから利用される。ここでも、1件のエントリーに対して提供されるURLは1つだけだ。

ブックマークもクロスデバイス

自分にとって重要な情報は、メモを残す。ブックマークはその方法の1つであり、そこで扱われる単位はURLだ。

1人のユーザは、インターネットを利用するに当たり、状況に応じて複数の端末を使い分けている。しかし、いつ、たまたまどの端末を使ったときに出会った情報だろうと、自分にとって重要な情報なら、1つのメモ領域に記録したいはずだ。

そうして、ブックマークはクラウド化し、クロスデバイス化した。

このとき、端末によってアクセスできないことがあれば不便なのは言うまでもないが、その情報のURLが1つでない(端末別に違うURLを用意してリダイレクト処理する場合など)と、ユーザは前に別端末でメモした情報でもそうと気づきにくく、重複してブックマークしてしまうなど、不便を被る場合がある。

さらに、ソーシャルブックマークサービスに発展するとより問題が大きくなるのは、Twitterの例と同じだ。

検索エンジンもクロスデバイス

Googleでは、PCサイト用クローラ(googlebot)とモバイルサイト用クローラ(Googlebot-Mobile)があり、PCサイト検索とモバイルサイト検索のサービスが別々に提供されている。しかし、PCサイトもモバイルサイトも、同じインターネット空間上に混在していて、ほぼ同じ言語(HTML)で実装されているものなので、実はそれを明確に区別できる方法はない。

近頃流行りのスマートフォンやタブレットなどではなおさらのこと。ソースコードからどんなデバイス向けのページなのか判断することは不可能と言って良いくらい、言語は共通化されているし、境界線は曖昧だ。つまり、検索エンジンはデバイスを区別できない

ということは、PC向けGoogle一本で、全てのデバイスに共通の検索結果を提供せざるを得ない。結果的に、検索エンジンはクロスデバイスにならざるを得ないということだ。

そして、検索結果として提供される情報とは、1件につき1つのURLである。

結論:1つのURLで、1つの共通のユーザ体験が流通できること

なぜ、クロスデバイス対応は必要なのか? 一言で言うと、これに尽きるだろう。

1つのURLで、1つの共通のユーザ体験を流通させるためである。

ここで言う「1つの共通のユーザ体験」とは、同じ情報や印象を得たり、機能を使えること。

1つのURLで同じ体験が得られることなど当たり前のように感じるかもしれないが、それは、ウェブが個人のものであった時代の話。それが、TwitterやFacebookなどのソーシャルメディアを介することで、状況が変わってきている。

まとめ

クロスデバイス対応の一般的な要件

一般論として、クロスデバイス対応としてのあるべき要件を、次のようにまとめてみる。

  • 全てのデバイスに1つの共通のURLで対応すること。
  • 全てのデバイスに共通のユーザ体験を提供することを目指すこと。

「共通のユーザ体験」には、例えば次のようなことが含まれる。

  • 共通の情報が得られる。
  • 共通の機能を利用できる。
  • 共通の印象や感情、モチベーションを得られる。(トーン&マナーの共通化)

もちろん、端末の性能や技術的制約などによって、無理な部分があり得るのは仕方がない。その中でも、可能な限り共通化することが目指されるべきだ。

望ましくない実装の例

例えば次のような実装は望ましくないか、注意が必要な可能性がある。

* User-Agentによって、端末別に用意されたURLにリダイレクトする

ソーシャルブックマークに複数のURLで登録される可能性がある。これは、ページランクにおいてもパワーが分散され、もったいない。
mod_rewriteや1URLの出し分けに対応したCMSなどを用いて、単一URLに見える方法で対応する方がよい。

また、クローキングを疑われるリスクもないとは言いきれないので、注意が必要。

* 小型端末向けに、情報を削る

1つのURLで共通の情報が得られなくなるため、ソーシャルメディア上でのコミュニケーションが破綻する怖れがある。
情報量が多すぎるなど、技術的な障壁がある場合はいた仕方ないが、その場合は、内容を別ページに分割して同じ情報を提供しておくなど、何らかの代替手段を用意して共通の情報にリーチできる配慮がなされるべきだ。

ウェブデザイン構築の手順として、グレースフル・デグレデーションだとこれが起こりやすく、プログレッシブ・エンハンスメントでは起こりにくい。

* 小型端末向けに機能を絞る

これは特にウェブアプリケーションのUIにおいて言えることだが、端末によって達成できないタスクがあってはならない。どんな端末でも、たとえどんなに使い勝手が悪かったとしても、最低限目的を達成できる方法が用意されることが求められる。

ウェブデザイン構築の手順として、グレースフル・デグレデーションだとこれが起こりやすく、プログレッシブ・エンハンスメントでは起こりにくい。

* デバイスによってデザインが異なる

色やデザインのテイストを変えてしまうと、ユーザの受ける印象は大きく変わってしまい、同じ内容でも同じものとして認識できない場合すらある。

「誰が発信した情報か」を直感的に把握できることも重要なポイントだ。デバイス固有のUIデザインに似せたデザインが流行する傾向にあるが、ウェブページから個性を奪い、誰の何を読んでいるか把握できない。これは、良い選択とは言い難い。

デバイスを問わずトーン&マナーを可能な限り揃え、キーとなる画像も、可能な限り同等の表現を用いることが望ましい。

関連記事

まとめページ クロスデバイス対応ウェブ も参考までに。


プロフィール

ときにはデザイナ、ときにはディレクタ、ときにはプログラマ、ときには何でも屋と、ウェブの世界で未熟ながらもいろいろやっている、コヤナギトモヤです。

ツイッター上ではこのヒト。
@tomk79

RSSフィード

ページの先頭へ戻る