Web制作会社の役立つコラム

この記事では、スマホサイトが、パソコンサイトと比べて何が違うのか？
ユーザビリティーで配慮すべきポイントや、スマートフォンサイト独自の機能について、分かりやすく解説します。

スマートフォンサイトの特徴

画面が小さい

まず、スマートフォンサイトの特徴としては、「画面が小さい」ことが挙げられます。
パソコンのブラウザを開いた時、ユーザーは掲載されている情報を一気に見渡せますが、スマートフォンの場合は表示される画面が小さいため、画面内に表示される情報が少なく、スクロールしなければ、全体を見渡すことができません。
画面内の情報が見づらいと、ユーザーにとって利便性が悪くなり、サイトとして有効に機能しません。

クリックする箇所が小さい

パソコンはマウスのカーソルを使って画面のボタンやバナーをクリックします。
スマートフォンは、指を使ってボタンやバナーにタッチするので、タッチされるボタンやバナーのサイズが小さければ、指でタッチしづらくなり、他のページまで見てもらえる確率が低くなります。

それを防ぐために、バナーやボタンは「大きく」「タッチしやすい」適切なサイズで表示することが大切です。

 

スマートフォンサイト専用のバナー

同じキャッチコピー、文章が使われているバナーでも、大きく表示されるパソコンサイトと、小さく表示されるスマホサイトでは、表示にこんなに差があります。

なので、多くのホームページが、デバイスに合わせた画像をそれぞれ用意している場合も少なくありません。

読み込みに時間がかかる

最近では少しずつ高速になってはいますが、それでもパソコンと比べると、屋外など回線速度の遅い環境でスマートフォンを利用する人がほとんどです。
読み込みが遅いスマホサイトは敬遠されるので、表示される画像や文章をなるべく軽量化して、表示速度が速いサイトを心がけることが必要です。

Googleの「PageSpeed Insights」は、あなたのサイト速度を調べて改善点を指摘してくれるので、サイト速度が気になる方は、ぜひ活用してみましょう。

▼PageSpeed Insights
https://developers.google.com/speed/pagespeed/insights/?hl=JA

地図アプリや電話アプリとの連携機能

サイト閲覧から、すぐに実際の行動（詳細な場所を調べたり、電話をかける）などにそのまま移行できるのが、スマホサイトの便利な点です。

たとえば、気になる店を調べて、その情報をわざわざ他に書き写してからアクションに移るのではなく、スマホサイトのリンクから地図アプリを起動させたり、電話をかけたりできるように、住所や電話番号には特殊なリンクを埋め込むことで、ユーザーにとってより使いやすいサイトになります。

スマホサイト独自のインターフェースがある

スマートフォンサイトには、独自のインターフェースを持つものがあります。
その一例として「ハンバーガーメニュー」があります。
ハンバーガーメニューとは、スマートフォンサイトやタブレットサイト、最近ではPCサイトでもよく見かける、三本線のナビゲーションメニューのことです。

他にも、小さなアイコンなどがよく使用されていたりしますが、これらは、画面サイズの小さいスマホページのスペースを有効活用し、必要なアクションにすぐにアクセスできるよう考案されたものです。

 

 

結論

このように、スマートフォンサイトでは、パソコンサイトをただ縮小すればいいというものではなく、独自のインターフェースや設計が必要になります。そのような設計は、やはりプロである制作会社に相談して作ってもらうことが最善で、ユーザビリティにも繋がります。
スマホサイトでお困りの場合は一度ご相談ください！