202510/06

iPhone 17シリーズとiPhone Airがレスポンシブ化に与える影響は?

今年もiPhoneの新機種が先月9月19日(金)に発売されてしばらく経ちました。
ブレークポイントがヤバい!?
という、前回の懸念はどうなったのか?
今回はiPhone 17シリーズ(Apple公式サイト:https://www.apple.com/jp/iphone-17/)とiPhone Air(Apple公式サイト:https://www.apple.com/jp/iphone-air/)のWEB制作現場への影響を見ていくことにします。

ブレークポイントは変える必要なし

結論から言うと、今回登場したiPhone 17もiPhone Airも、480pxの壁を超えることはなく、ホームページ制作のコーディングにおけるブレークポイントの見直しは必要ありませんでした。
各機種のCSSピクセルは以下のようになっています。

新機種のCSSピクセル

  • iPhone 17:402×874(ピクセル解像度は1,206×2,622)
  • iPhone 17 Pro:402×874(ピクセル解像度は1,206×2,622)
  • iPhone 17 Pro Max:440×956(ピクセル解像度は1,320×2,868)
  • iPhone Air:420×912(ピクセル解像度は1,260×2,736)

この中ですと、ヒヤッとするのがiPhone 17 Pro Maxの440×956ですが、これもCSSピクセル、ピクセル解像度共に去年発売されたiPhone 16 Pro Maxと一緒の値となっています。
今回はiPhoneにもAirが登場したこともあり、コンパクトなサイズ感も大事にされていて、大きさとの兼ね合いからもCSSピクセルに大きな変更はなかった様子。

いよいよブレイクポイントを見直す時が来るのか?と身構えていたジャンプスのスタッフも、胸をなでおろすことができました。

今回登場したiPhone 17シリーズとiPhone Airでは解像度、CSSピクセル、アスペクト比ともに従来のiPhoneからの大幅の変更はなく、レスポンシブ化への影響はほぼ無視できると言って良いかと思います。
ただし、噂されている折り畳みスマホのiPhoneは、今回こそ登場しなかったものの、来年あたり……という可能性があります。
そうなってくると、これまではあくまで特殊デバイス扱いで無視してきた折り畳みスマホについても、レスポンシブ化で考慮していく必要が生じるかもしれません。

今や、個人レベルのユーザーでは、パソコンよりスマートフォンのほうがホームページを閲覧するツールとしては一般的で、一人暮らしの世帯や若者ではパソコンはそもそも持っていないという人が多い状態です。
圧倒的iPhoneユーザー数を誇る日本のホームページにおいては、やはり制作現場もiPhoneの仕様に左右されることが多々あります。
今後も引き続き、注意深くiPhoneの動向を見守っていきたいと思います。