最近スマートフォン、タブレットなどデバイスの進化が著しいです。企業は、ユーザーが利用するデバイスや閲覧環境に合わせて、ホームページの設計を行うことが求められています。
その中でも、デバイスの画面サイズの違いはホームページの印象はもちろん利便性を大きく変える要素です。

今回は、デバイス事にホームページの見え方について比較してみました。

デバイス別で大きく違うホームページの見え方

今回は、デバイス別で比較をする際に以下のツールを活用してデスクトップパソコン、ノートパソコン、タブレット、スマホで見え方の比較を行いました。

今回利用したツール:Am I Responsive?

デバイス別のサイズ比較

デスクトップパソコン:1600x992px
ノートパソコン:1280x802px
タブレット:768x1024px
スマホ:320x480px

スマホ対応・タブレット対応を行っていないホームページを検証用のホームページとして、デバイス別でホームページの表示を確認した画像が下記となります。

Am I Responsive?

デスクトップパソコン、ノートパソコンは、ファーストビューでホームページの大部分は表示されており、全体のイメージとして、どのようなコンテンツなのかが把握しやすい印象を受けます。

一方で、タブレット・スマホで見てみると顕著にホームページの表示されている領域が少なくなりました。
タブレットは、ファーストビューで、かろうじてロゴやコンテンツを把握することが可能ですが、右側のコンテンツは見切れてしまっています。
この見切れているエリアに商品購入のカートボタンや会員登録ボタンがあれば、必ず見落としてしまうようなエリアとなってしまう可能性があります。

特に、スマホに関しては、ロゴと一部のコンテンツのみしか把握することができず、これだけではファーストビューで「なんのサイトなのか?」が分かりません。

このように、ホームページの全体像が把握しにくい場合、初めて訪れたユーザーからすると、「パッと見て分からないホームページ」として離脱する可能性が非常に高くなるのは言うまでもないでしょう。

スマホユーザーの利用シーンを考えると更に使いにくい

スマホを利用して、インターネットを閲覧するユーザーの利用シーンとして多いのは隙間時間(通勤・通学・休憩時間など)にサクっと見るといったケースです。

通勤や通学の際に、閲覧しようとしているユーザーに関しては、移動中にスマホを操作していることを仮定した場合、繊細な操作をすることは難しい可能性が高いです。(移動中の電車やバスによる振動など)

先ほどのようにスマホ対応をしておらず、表示領域が小さいホームページを閲覧するために、縦のスクロール+横にもスクロールを行う操作が必要がある事や、一般的にスマホで閲覧するユーザーの目線は、上から下に流れていくことを考えると快適な閲覧を行うことができません。

このように、デバイス別の(特にスマホ)利用シーンや、閲覧環境を考えると、どんなユーザーでも快適に閲覧できるよう、ホームページ運営者がデバイス別で配慮を行う必要があります。

スマホユーザーの9割がパソコンページにストレスを感じていた

以下の調査データでは、スマホを利用する3000人のユーザーに対して、閲覧している際の印象について調査した結果です。

参照記事:スマホユーザーの9割がPCサイトの閲覧に不満--急速に浸透するLINE

この調査項目の中でも、特に興味深かった内容は、「スマホを利用してPCページを閲覧するユーザーの9割が何らかのストレスや不満を感じている」という点です。

最もストレスを感じることは「文字の小ささ」。しかも、ストレスを感じる割合は7割にも上り、先ほどのAm I Responsive?を使って表示されたような見難さは多くのユーザーにストレスを感じさせているのです。

PCサイトの閲覧に不満
※出典:モバイル利用動向調査(2012年8月調査) | 2012 | プレスリリース | 株式会社D2C