レスポンシブの注意点


今後は必須のスキル

WEBデザインを手がけるうえで必ず習得しておきたいスキルとしてあげられるのが、レスポンシブデザインです。
以前のWEBサイトはパソコンから閲覧するユーザーを想定して作成するのが一般的で、その後はモバイルサイトも少しずつ増えてきました。
最近ではスマホユーザーが増えて、携帯電話を所有している人の6割ほどの方がスマホユーザーになるとも言われています。
スマホも機種によってブラウザのサイズが異なりますし、タブレット端末ではもっと大きな画面で閲覧することになります。
つまり、以前よりも様々な大きさの画面で閲覧するユーザーを想定してWEBサイトを作成しなければいけない状況になりました。

そこで最近は、様々なデバイスからでもユーザーが快適に閲覧できるように対応可能なレスポンシブWEBデザインの導入が一般的になっています。
以前はパソコン用とモバイル用のURLを分けて用意し、それぞれのデバイスユーザーに適したページを表示するようにしていましたが、レスポンシブデザインではURLを分けることなく表示できる仕組みなのでメリットは大きいと考えられています。
今後はレスポンシブWEBデザインのスキルが必須になると考えられますが、レスポンシブを導入する際の注意点を確認しておきましょう。

パソコンとスマホの表示速度を考える

一般的にパソコンを使用している環境はインターネット回線を有線または無線LANで使用しているケースが多いです。
安定した速度で表示されるため、障害が起こらない限りは特に不具合を感じないものです。
しかし、スマホの場合は以前よりも安定したと言われていますが、やはりパソコンで使用するインターネット回線よりも不安定であまり速くありません。
あまり画像をたくさん使っていると、スマホユーザーにとってはなかなか表示されないため苛立ちを感じる大きな原因になります。
画素数が大きな画像はリサイズすること、cssで画像の代用ができる場合には積極的に活用することで表示速度を速くすることができます。
WEBアイコンやWEBフォントを上手に活用することで、これまで画像を使って表示していた部分を軽くすることも可能になります。

ただし、ブラウザによってはcssではうまく表示されない場合があるため注意しなければいけません。
全てのユーザーが新しいブラウザを使用しているとは限らず、以前のバージョンをそのまま使用している可能性があります。
せっかくデザイン性の高いサイトに仕上げたのに、全てのユーザーに正しく表示されていない状態では意味がありません。
css3の技術を活用する場合には、古いブラウザを想定したサイトを構築しましょう。

レスポンシブに対応できるサイトを構築できるようになるまでにはある程度慣れが必要なので、何度も反復練習を兼ねてサイトを作成しましょう。