BLOG

レスポンシブ


今日はWEBにあまり詳しく無い方に向けて、レスポンシブについてお話してみようかと思います。
よく耳にするワードなので、ご存知の方も多いかもしれませんね。
最近のWEB制作において最も多い仕様なのではないでしょうか?
 
ガラケー時代はパソコン版とは別に携帯用のサイトをわざわざ用意していましたが、スマホが登場初期の頃もその延長にありました。
ですが、タブレットが登場し、様々な画面サイズのスマホが登場し…と時代が進むにつれて、WEBの仕様も年々バージョンアップしてゆき、「レスポンシブ」が登場してきました。「レスポンシブ」とは、デバイスの画面サイズに応じて適切な表示をさせる仕組みのことを言います。(だいぶざっくり…)

ガラケー時代は 「携帯用のファイル」「パソコン用のファイル」 と別々に管理していたものを「レスポンシブ」の仕様では、1つのファイルで管理することが可能となりました。それによって何が便利になったかって、別々に更新していた2つのファイルが1つに減って、更新の手間がかからなくなった!これは非常に大きいメリットですね。
現在この「レスポンシブ」の仕様で作られているサイトが非常に多いです。この流れはもうしばらくは続くのかなと思います。と言うのも、年々、携帯の性能や画面サイズも大きくなっていて、パソコンと大差がないので分ける理由も必然的に少なくなってしまうんですよね。
 
ただ制作側の話としては、携帯用とパソコン用のファイルが1つになったからと言って、制作が楽になった…ワケでは無いと思います。デザインの方ではちゃんとそれぞれのデバイスに合わせて記述する必要があるんですね。ですので、パソコン版のデザインがあればスマホ版は別に要らないよね?と言うわけでもありません。もちろんベースのデザインはパソコン版を踏襲して制作したりすることがほとんどなので、多少の手間は減りますが、スマホ用に改めて使い易い用にデザイン・レイアウトを再構築・再考する必要はあるのです。
 
僕のクライアント様にも必ず伺うことですが、レスポンシブでサイトを制作する際は、対応デバイスを確認します。今の世間の主たるデバイスは、パソコン、タブレット、スマホですが、これ、タブレットが微妙なところで、タブレット用に改めて適正なデザイン表示にさせる。となると、その手間が一つかかってしまいます。
 
分岐点、「ブレイクポイント」と言って、例えば、タブレット用とスマホ用にデザインをそれぞれフィットさせる。とすると、ブレイクポイントは2箇所と言うことになります。ただその分作業の手間と費用がかかってしまいますので、ブレイクポイントは1箇所のみで、パソコンとスマホ表示のみ適正にさせる。とさせるクライアント様も多いです。

他にレスポンシブのデメリットとして、基本的にはパソコンと同じ画像ファイルを読み込んだりするので、通信量が多くなったり回線速度の問題がありますが、これらはインフラや更なるデバイスの進化で、そこまで大きな問題では無いのかなぁとは思います。が、意識はしておかなければいけない点です。
 
また、現在レスポンシブに対応していないサイトで、「レスポンシブにしてよ!」的なお願いをしようかと思われている方もいらっしゃるかもしれませんが、レスポンシブサイトを作る際は、基本的に「レスポンシブで作る前提」でサイトを構築してゆきますので、その前提が無いサイトは、場合によってはゼロから作るよりも手間と費用が掛かってしまうかもしれないので、注意が必要です。
 
Googleでは検索結果の順位付けにおいて、「モバイルファーストインデックス」を導入しており、端的に言うと、レスポンシブ対応していたら高評価ですよ!と言う基準になります。(またざっくり…)なぜレスポンシブかと言うと、パソコンとスマホで表示されているコンテンツに差異がある場合は評価がされないようです。パソコンと携帯用のサイトを別々に管理されていると、コンテンツの内容も若干違ったりすることもあるのでは無いでしょうか? レスポンシブの場合だと、デザイン表示の差異はあれど、基本的なコンテンツは全て同じになりますからね。
 
レスポンシブでお悩みの方がいらっしゃいましたら、気軽にご相談してみてくださいね♪