パソコンとスマホで見え方を切り変えるには?

パソコンの画面とスマホの画面では、大きさも形も違いますよね?
だからこそ、パソコンではきちんと綺麗に表示されているのに、 スマホで見ると見切れたり、ぐちゃぐちゃになってしまったりします。 それを防ぐために、レスポンシブという概念が登場します。

レスポンシブ対応をしないとどうなる?

レスポンシブ

百聞は一見にしかず、というわけで、画像で見ていきましょう。
レスポンシブ対応をきちんとしていると、以下のように、 パソコン版とスマホ版でぞれぞれ見やすい大きさで見やすい位置にオブジェクトが配置されます。

SP版レスポンシブ対応
▲パソコンで見た時
SP版レスポンシブ対応
▲スマホで見た時

上記の画像のように、スマホの幅に合わせて要素のサイズが調整され、画像も見やすい位置に移動してくれる。

さて、一方で、レスポンシブ対応をしないと・・・

SP版レスポンシブ対応
▲あらら・・・スマホで見ると、画像は小さいし、空白が謎に広いし、とても不格好・・・

お分かりいただけただろうか?
このように、パソコンやスマホのサイズに合わせて、サイズや配置を調整するのがレスポンシブ対応です。
ほとんどみんながスマホを持っている現代では、必須と言っても過言でない技術です。

ホームページ制作を依頼したら、レスポンシブはデフォルトで対応してくれるもの?

さて、このレスポンシブ対応ですが、制作を会社や個人のクリエイターにホームページ制作を依頼すると、 特に希望せずとも勝手にやってくれるものなのでしょうか?

一概には言えませんが、別途費用がかかる場合が多いです。 しかし私は、スマートフォン版のレスポンシブ対応は別料金無しで対応させていただいます。
ぜひ、あなたの素敵なホームページ作りを手助けさせてください(^^)/