iPhoneページの設計ポイント
ページサイズ
・ページサイズは横幅320pxを基準に設計
・デスクトップ･･･740〜960px前後で想定して設計するのか一般的
・iPhone･･･横320px × 縦480px
向きをかえると 横480px × 縦320px
・iPhoneは通常縦表示のときの横幅320pxを基準にしてページ設計する
画像サイズ
・画像のサイズも横幅320pxまで
・サイトの幅が320pxなので、画像サイズも横幅320px以内に収める
■ファイル形式の制限
| ファイルの種類 | 制限 |
|---|---|
| GIF,PNG,TIFF | 3メガピクセル(width×height≦1024px×1024px×3) |
| JPEG | 32メガピクセルまで |
| HTML,CSS,JavaScriptなど 個別のファイル |
10メガピクセルまで |
・ファイルサイズだけでなく、大きさ（ピクセル数）が制限の対象になるので要注意！
・ファイルサイズを小さくすれば、それだけページ表示速度が向上する
文字サイズ
・文字サイズ（font-size）は、デスクトップよりもやや大きめの14px〜16px
が読みやすい
行間
・文字サイズの1.4(140%)〜1.6(160%)倍程度で指定
・文字量が多きときなどは、font-size:14px, line-height: 1.4;程度に調整して、スクロールする手間を減らすこともできる。。。
ページの左右の余白
・コンテンツの左右の余白に10px程度あける
・窮屈感･･･スペースを空けると窮屈にも見えず丁度いいバランスになる
・きれいに見せる
ナビゲーションリンク
・ボタンやリスト型のリンクの場合、縦幅を44px前後にするとタップしやすくなるとされている
・ページによっては大きすぎることもあるので、縦幅をやや小さくしたり、リンクの周囲の余白を広げたりするのもよい
