2012年12月15日開催のCSS Nite LP25 Shift6 「デザイントレンド」のセッションで発表したインフォグラフィックコーナーの資料です。制作環境であるPCが最も表示結果の荒いデバイスになってしまっていることと、大きさでなく密度に多様性が広がっている点にご注目ください。

1. iPad mini Nexus 7 Nexus 10 2560 × 1600
Screen 768 x 1024 800 x 1280
for Design
163dpi 300dpi
216dpi
128dpi
devicePixelRatio 1.5
13inch Laptop devicePixelRatio 3
1440x 900 px
iPad 2048 x 1536
720 x 1280
Galaxy Nexus
163dpi
233dpi
118dpi 326dpi
320 x 480
iPhone3
480 x 800
Galaxy S
316dpi
264dpi
15inch Laptop
640 x 960
iPhone4
1600 x 900 px
devicePixelRatio 1 devicePixelRatio 2
96dpi
PC で制作したビットマップが Screen
23inch Desktop
1920 x 1080 px
ボケないのは dpx 比率1 のみ for Browsing