iPhone11の画面サイズ何ピクセル？

こんにちは、Teresaです(‘◇’)ゞ

”iPhone11シリーズ”11/20発売でしたね。
とワクワクしているように思われた？かも？
なのですけれど、

わたしのiPhoneはＸのままですｗ

そして11に買い替える予定も今のトコないですｗ

だってサイト作る時に必要だから。

iPhoneの各シリーズのサイズ
▼Monday Voice！で読み上げたよｗ▼

なのでiPhoneの新リリーズ出る度やっている
画面サイズの比較画像作ってみました。
（✤今回もまた懲りずにねｗｗｗｗｗｗ）

iPhoneのCSSピクセル
比較画像作ったよ

実物大で作ってあります。
✤ただスマホでは縮小されますが。。。

あ、小見出しの通りですね、
画面のサイズとは言いましても、
Retinaの何インチとかには興味ないので、
一切入れていません(￣▽￣)

わたしが「チェックする必要あり！」
と考えているのは、サイト作成に必要な
CSSで設定するピクセルだけなので。

そして今回のiPhone11シリーズの画面サイズで
改めて決めたコトは。

2種類の横幅に対応すればいいと思う

画像は横幅100%に設定すればいいだけなので、
特に細かい指定はしなくてもよいのですが、

Tableタグで作る表だとか、

横並びに置くボタンだとか、

横並びのメニューだとかには、

それぞれ細かく設定してあげる方がいい。

え？縦幅は気にしてない？

なぜなら、画像やTableタグ、メニュー作成、
どれも調整が必要なのは「横幅」だけで、
縦幅の調整は必要ないから。

だから縦幅のサイズは基本気にしていないけど、
ファーストビューを考える時には、
「ココまでは見せたい」という観点で作るコトは
当然あります。

「横幅」は2種類だけど、
「縦幅」はマチマチだよね？

そうなのですよねぇ。

「横幅」は375pxと414pxの2種類で調整すれば、
まぁ大丈夫だと考えています。
（✤320pxの横幅はムシしちゃってます💦）

で、ファーストビューのコトを考えた時は、
「縦幅667pxに収まるのが理想的」と考えてる。

(/・ω・)/ええぇぇぇえええ！
バカなの？アンタ馬鹿でしょうーｗｗｗ
「大は小を兼ねるんだよｗｗｗ」って
思わず叫んでしまったあなた(￣▽￣)

縦幅最大の896pxに合わせて作ったらね、
例えば6s/7/8の縦幅667pxのiPhoneだと？
896px-667px=229px分隠れるワケですよねぇ？

でも6s/7/8の縦幅667pxに合わせて作れば、

6sPlus/7Plus/8Plusでも

X/XS/11Proでも

XR/11/XS Max/11Pro Maxでも

等しく見れる表示領域が決まる。

それ以降(668px以降896pxまで)の表示領域は、
各シリーズで違うけれど、
その部分はファーストビューとして考えなくて
全然よいワケですよ。

ま、そんなに熱弁揮うほどのコトでもないけどｗ
わたしはそんな風に考えて、
サイト作成していますよーってお話しでした。