metaタグのviewportを使って自動縮小させないようにしてみた

metaタグのviewportを使って自動縮小させないようにしてみた

おまじないのようにコレを入れていたので、ちゃんと調べてみた。

<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no" />

そもそもviewportとは？

コンテンツの表示領域を設定するもの。

各属性値について

今回の設定について

属性	意味
width	表示領域の幅
initial-scale	初期のズーム倍率
user-scalable	ズーム操作OKか

なので今回の設定では

• 表示領域はデバイスに合わせる(device-width)※ここはpixel数でもOKらしい
• 初期のズーム倍率は1.0倍
• ズーム操作させない

となる。
(初期のズーム倍率は必要ないかも…？)

他にも属性値があるので必要なら調べるけど、「モバイルは考慮しないけどそれなりに見れるといいな」ぐらいならこの設定でOKそう。