2013年12月5日(木)
iPhoneのWeb表示 #■パソコン・通信

　一通り、勉強したので整理してみた。

　iPhoneの解像度は、下記の通りである。

　iPhone1-3：　320×480px
　iPhone4：　640×960px
　iPhone5：　640×1136px

　ここで重要なのは、Webページでスマホ用の設定を施さなければ、幅980pxで表示されると言うことである。言うまでも無く、小さく表示される。

　スマホ用に追加された記述に、viewportがある。

<metaname="viewport"
content="width=device-width">

　iPhoneでは、"width=320px"と解釈される。つまり、iPhone専用Webページは、表示幅320pxを基調に作成すれば最適となる。

　Webページ幅が指定してあると、その幅に自動的に合わせてくれるようだ。ただし、Webページ高が表示高より短いと、表示幅に収まらない。正式には、initial-sizeプロパティで縮小する。縦置きでは正確に表示するが、横置きにしても自動的に大きさが調整されない問題が生じている。現時点では、initial-sizeプロパティは使えない。

　上記の記述が無ければ、"width=980px"の記述と同じ。文字サイズは、980/320=約３倍でないと読めない。