スマートフォン用の見やすいWebサイトで気をつけること



スタイルシートで見やすいサイトを作る

スマートフォンを使うと、パソコンと同じようにインターネットで検索したりWebサイトを閲覧することができます。しかし、スマートフォンで使用する画面はパソコンに比べると一般的に小さいです。同じサイトでも見え方がだいぶ変わってしまうので、パソコン用とは別にスマートフォンで閲覧するためのサイトを用意する人は少なくありません。わざわざ二つのWebサイトを作るので、大変そうと思う人もいるでしょう。文字の大きさや色を指定するためのスタイルシートを使いこなせば、簡単に2種類のサイトを作ることができます。まずはパソコン向けと同じように作成し、スタイルシートで指定するフォントのサイズを変えるだけで問題は解決です。

デザインする上で気をつけること

基本的にパソコン用と作り方は同じですが、スマートフォン用サイトではページ内の構成に気をつけなくてはいけません。パソコンサイトではページ内を縦に区切ってメニューボタンやイラストを表示することがあります。大きな画面の場合、この方法にするとページ内が整理されてとても見やすくなるでしょう。しかし、スマートフォンのように小さな画面ではページを分割してしまうと文字が必要以上に小さくなってしまうなどの問題が生じます。スマートフォン用サイトでは、閲覧するときに縦方向にスクロールすればページ全体が見られるようにしておくことが大切です。縦と横にスライドしないと見えないページは、閲覧する人が面倒に感じるかもしれません。

スマホサイト制作のコツとしては、タイトルを最上部において、文字数を短くすることです。また、動作が重くなる画像は極力少なくして、タップで移動しやすい構成にすることも大切です。