意識しよう!スマートフォンWebサイトを作るときのポイント

ユーザビリティを考えよう

スマートフォンWebサイトのレイアウトの基本はシンプルな段組みです。というのも、パソコンと比べ画面が小さく表示できる範囲が限られるからです。また、スマホにはさまざまな大きさのものがあるため、横幅を固定値で指定するのではなく、なるべくパーセント指定で可変にする方がさまざまな大きさに対応できます。ボタン要素やテキストリンクに関してはスマホでは指の面で操作するため、要素が小さかったり、要素間のスペースが窮屈だと誤タップをしてしまい、ユーザビリティを下げてしまいます。そのため、ボタンの大きさは十分に取り、テキストリンクも行間を広めに取ることが重要です。そのほか、一つのページでのスクロール量が多い場合などでは、途中で上へ戻るためのボタンを表示させることで、ユーザビリティの向上が期待できます。

表示速度に気をつけよう

特にスマホでは、データ量を削減することが重要になってきます。Webサイトを表示するために受信するさまざまなデータの中でも、画像のデータが多くを占めています。そのため、画像の埋め込みは必要最小限にするようにしましょう。表示速度を上げるためには、見た目のクオリティが変わらない範囲で画像の最適化・再圧縮を行うことが大切です。また、そもそも画像を作成するときに適切なフォーマットを使用することが重要で、写真素材ならJPEG、線画・イラスト系素材ならPNGと、用途に応じて使い分けましょう。画像がシンプルなものでCSSでの再現が可能ならば、なるべくCSSで対応することでデータ量を抑えることができます。

スマホサイトのアプリは、生活に役立つものが多くあり、中でも天気予報や交通情報などは格安価格で利用できます。