ビューポート
サイト制作時の想定View Port
世の中にはスマホやタブレットの種類がたくさんあるわけですが、それぞれ画面のサイズが異なれば解像度も異なるわけで。制作時には全機種に対応したいところですが、やればやるほど大変なのは悩ましいところ。正確にはそれぞれの画面解像度に対応ではなく、それぞれの機種のView Portを考慮することになります。メモ代わりに一覧表をおいておきます。
ちなみに、中の人は実機を持ってないのと日本ではシェアが低いのでAndroid固有のサイズ対応はスルーです。それでも、320、375、414、768、1024、1920の6種類は実機チェックするので手間はかかります。
Apple
| View Port 値（横幅） | 機種 |
| 320 | iPhone 5 iPhone 5s iPhone 5c iPhone SE |
| 375 | iPhone 6 iPhone 6s iPhone 7 iPhone 8 iPhone SE(2世代) iPhone X iPhone XS iPhone 11 Pro iPhone 12 mini iPhone 13 mini |
| 390 | iPhone 12 iPhone 12 Pro iPhone 13 iPhone 13 Pro |
| 414 | iPhone 6 Plus iPhone 6s Plus iPhone 7 Plus iPhone 8 Plus iPhone XR iPhone 11 iPhone XS Max iPhone 11 Pro Max |
| 428 | iPhone 12 Pro Max iPhone 13 Pro Max |
| 768 | iPad mini iPad mini 2 iPad mini 3 iPad mini 4 iPad mini(5世代) iPad iPad 2 iPad 3 iPad 4 iPad Air iPad Air 2 iPad Pro 9.7 |
| 810 | iPad(7世代) |
| 820 | iPad Air(4世代) |
| 834 | iPad Pro 10.5 iPad Air(3世代) iPad Pro 11 |
| 1024 | iPad Pro 12.9 |
| 1920 | フルHD |
Android
| View Port 値（横幅） | 機種 |
| 320 | Andoroid モバイル Sサイズ |
| 360 | Andoroid モバイル Mサイズ |
| 480 | Andoroid モバイル Lサイズ |
| 600 | Andoroid タブレット Sサイズ |
| 768 | Andoroid タブレット Mサイズ |
| 800 | Andoroid タブレット Lサイズ |
View Port まとめ
一覧表の内容からすると、「現在のところ」モバイル（スマホ）端末はAndroidの480、タブレットはiPad Proの1024が最大値となってますね。ただし1024というサイズはもはやユーザーが幅調整したPCブラウザの横幅を超えてる可能性もあるので、このサイズをタブレットの範疇に入れるかどうかは悩ましいところです。
中の人は現在のところ、500pxでモバイル（スマホ）、768pxでタブレット、それ以上のサイズはPCだと想定し各種設定（メディアクエリ値）することが多いです。
※ただし、クライアントは神様なのでクラ様が最新のiPad Proで閲覧してる場合なら1024でタブレットブレークポイントする場合もあるます（笑）