ユーザビリティを考えたデザインに
最近はスマホユーザーが急増していることで、クリエイターにもスマホ対応のサイトを作成するスキルが求められています。
従来のパソコン用サイトをスマホで閲覧することも可能ですが、ユーザビリティを考えるとスマホサイトに特化したデザインで作ることが求められます。
スマホサイトのデザインについて注意すべきことを確認しておきましょう。
レイアウトは極力シンプルな構成がベスト！
スマホユーザーに良い利便性を考えると、とにかくシンプルな構成にすることが大切です。
例えばパソコン向けサイトの場合は、2列または3列にしてサイトメニューをサイドバーに表示させるレイアウトのサイトが多いですが、スマホの場合は小さな画面の中に収めようとするのは難しいです。
できるだけユーザーが使いやすい構成にするなら、段組を使わないようにしてシンプルなサイト構成を目指したいものです。
パソコンではサイドバーに入れていたサイトメニューについては、開閉式のアコーディオンメニューにするとスッキリとしたデザインになります。
使いやすさを追求する場合に注意したいのが、スマホは指を使って操作するものだという点です。
リンクの大きさがあまりにも小さいと意図していない部分を間違えてクリックして関係のないページへ飛んでしまう可能性があります。
操作性があまりにも悪いサイトはユーザーからも嫌われてしまうため、せっかく良い内容のサイトなのにもったいない結果になります。
適切なリンク構成にすることも大切だと覚えておきましょう。
スマホのキレイな画面を活かして、サイトの中にも色々な画像を使いたいという場合もあるでしょう。
デザイン的には素晴らしい仕上がりになっても、表示するまでの時間がかかるとイライラするユーザーも多いです。
あまり画像を多用するのではなく、CSS3を上手く活用することをおすすめします。
例えば指定したボックス内の背景色をグラデーションにしたい場合もCSS3を使って指定するだけでOKです。
以前よりも簡単になったHTML5と組み合わせてサイトを構成することが必要です。
スマホ用ブラウザを想定する
スマホは新機種が登場する度に進化を遂げており、初期の頃とは比べ物にならないほどの解像度を誇っています。
様々な機種によって解像度が異なるため、横幅を固定して作成しないように注意してください。
ユーザーによっては使いやすさを考慮して横向きで使用する方もいます。
この場合はかなり幅が広くなってしまうため、レイアウトが崩れないように注意しなければいけません。
どのような幅でも対応できるようなリキッドデザインを心がけると良いでしょう。
また、iPhoneはFlash未対応で、Androidも別途インストールが必要になることから、スマホサイトではFlashを使わない方が良いでしょう。