レスポンシブデザインって何?
レスポンシブデザインとは
パソコン、タブレット、スマホなど複数の閲覧環境に対してそれぞれに合ったレイアウトに最適化し表示切り替え可能なデザイン仕様のことです。
数年前までは、PC用とは別にスマホサイトを制作し、更新管理も別でした。
レスポンシブデザインは、同じページを横幅に応じてレイアウトを自動調整できます。
ページ更新も同時です。制作費も更新コストも削減できるわけです!
レスポンシブサイトの見分け方
- パソコンでサイトにアクセスします。
- ブラウザ(Chrome、インターネットエクスプローラなど)を全画面から少し小さい表示に変更します。閉じるボタン(×)の左側の小さい□アイコンをクリックするとブラウザが少し小さくなり、背景にデスクトップが見える状態にします。
- マウスでブラウザの右端(又は左端)に触れて、カーソル(矢印)が出たら、左クリックしたままマウスをスライドさせて画面幅を徐々に小さくしていきます。
レスポンシブデザインで作られたサイトは、横幅に応じて画面全体が縮小拡大されます。
(通常のサイトの場合は画像などは縮小されず、横スクロールバーが出ますよね)
さらに横幅を小さくしてスマホサイズになった時点で、今まであったメニューはスマホタイプの横三本線のメニューに収納されます。
この方法でレスポンシブサイトかどうか判別できますよ。やってみてください。