モバイルユーザビリティガイド－モバイルサイトのユーザビリティ向上支援サイト

■モバイルサイトとPCサイトの違い

モバイルサイトは、PCサイトに比べて以下の制約を受けます。

・画面が小さい
・キャリアや端末により利用可能なHTMLタグや画像などの機能が異なる
・マウス操作・カーソル操作ができない

■モバイルは画面が小さい

モバイルサイトとPCサイトでの最も大きな違いは、画面の大きさです。携帯端末の画面は、パソコンの画面に比べると非常に小さくなります。

2008年6月現在、DoCoMoの最新端末906iシリーズで最も液晶の大きいSH906iTVでも3.3インチ、その他の機種は主に3.0インチです。さらに、実際にはスクロールバー等も表示されるため、モバイルサイトの表示自体は、さらに狭い範囲で行われることになります。

携帯端末の画面が小さいことは、余りにも当たり前過ぎるため、見落とされがちですが、モバイルサイトのユーザビリティを考えるにあたって非常に重要な要素と言えます。

携帯端末ではファーストビューで確認できる範囲が小さいため、初めてサイトを訪れたユーザーに「このサイトがどのようなサイトなのか」を理解してもらいにくくなります。そこで初回訪問者のためのファーストビュー設計に工夫が必要となります。しかし同時に、リピーターにとっては目的のアクションをすぐに起こせるような設計も必要となります。

この制約の重要性を軽視してしまいPCサイトを基準にモバイルサイトを制作してしまうと、非常にユーザビリティの低いサイトになってしまいコンバージョン率の低下を招いている可能性が高くあります。

■キャリアや端末により利用可能なHTMLタグや画像などの機能が異なる

キャリアや携帯端末によって利用可能なHTMLタグ、スタイルシート、画像が異なります。

また、スタールシートの記述についても、DoCoMoでは外部スタイルシートが利用できないため一括でCSSを指定することができませんが、auやSoftBankでは外部スタイルシートが利用可能といった差異があります。

また、DoCoMo端末では数年程度前の端末では表組みのレイアウトに対応していない端末が存在します。それらの端末ではtable内に背景色の設定ができません。このように、キャリア・端末によって利用可能なCSSやフォントが異なります。

そのため、キャリア・端末を判別し、キャリア毎・端末毎にコンテンツを出し別ける対応が一般的になされていますが、この際に、出し別けたパターン毎に「サイトがどのように表示されるのか」を考慮することが必要です。この点の考慮を怠ると、あるキャリア・端末では文字が小さすぎてユーザーにストレスを与えていた、などの事態が発生する可能性があります。