先日、WordPressのパソコン用ホームページをスマホで見た時に画面が大きく表示されてしまう、ということがありました。
私が作成したホームページでは、そのようになってしまうケースとならないケースがあり、原因はよく分からないのですが、WordPressのプログラムが親切心からそういう仕様が効いてしまうケースがあるのかなと思います。
解決方法は下記2点で解決出来ることがわかりました。
1). スタイルシートのbodyの欄に下記のタグを追加
body {
-webkit-text-size-adjust: 100%;
}
2). viewportの設定
<meta name=”viewport” content=”target-densitydpi=device-dpi, width=device-width, maximum-scale=1.0, user-scalable=yes”>
をheadタグ内に置く。
ホームページの横幅が950pxの場合は、widthを960pxくらいに設定して、下記のようにしておくとよいと思います。
<meta name=”viewport” content=”target-densitydpi=device-dpi, width=960, maximum-scale=1.0, user-scalable=yes”>
以上で解決しました。
PS
なお、レスポンシブWebデザインによるスマホ対応の場合は、上記2).のviewportの設定を
<meta name=”viewport” content=”width=device-width,user-scalable=no,maximum-scale=1″>
に設定になります。(widthに数値を指定しないようになります。)