レスポンシブ対応ならばサイトを画面幅に合わせられた

デバイスでサイトのレイアウトを保持するにはmetaタグでviewportを設定すれば良い。

<meta name="viewport" content="width=device-width, initial-scale=1.0">

HTML編集のhead内に追加すると画面幅に合わせてサイトが表示されるので、デバイスが変わってもデザインが崩れることはなくなるんだ。

レスポンシブ対応といわれる。Googleのビューポートを設定するによればソースコードを、一行、追加するだけで、とても容易い。

画像はCSSでwidthを100%など画面に収まるように指定しなくてはならないにせよ、スマホでサイトのコンテンツが小さく表示されてしまうような事態は避けられる。

metaタグのviewportは本当に有り難いと思う。サイト作成でオススメしておきたい。