GALAXY Note SC-05DのWeb解像度を店頭で見てきた。
結論：どうやら640×400ピクセル
（WEBブラウザ解像度）
スマホデザインは幅320ピクセルで作ればいいといった常識は通用しない。
GALAXY Noteは縦で持って幅400ピクセルである。
機種の画面解像度は1280×800ピクセルなのでWEB解像度は丁度半分になる。この仕様として公開されている解像度とブラウザ解像度は別なので、調べる必要が出てくるところが厄介です。これで思い悩んでいるデザイナーは多いのではと思います。
レスポンシブルWEBデザインとかマルチデバイスデザインが求められるようになって、タブレットやらスマホの解像度がどんどん多様になってきて、WEBデザイナーはどのような対応策をとっていけばいいのかのご提案です。
- ユーザーエージェントでPCサイトと振り分ける
- CSS3のデバイス幅でCSSを振り分ける
携帯サイトも結構やっていたので、その歴史を語ると最初は
- IPアドレスで振り分ける（徐々に機種が増えすぎて対応しきれず）
- ユーザーエージェントUAで振り分ける（スマホになってマルチデバイス化が必要で）
- 横に傾けた時にWEB解像度が広がる（縦横両方に対応せねば…）
- タブレットも相当増えてきて（デバイス幅で指定が求められるGALAXY Noteのような中途半端なデバイスへの対応）
といった流れではないでしょうか。iPhoneやiPadなどのアップル製品はそんなに製品ラインを変えたりしないが、Androidや各種キャリアのスマホは今後どうなっていくか進化はバラバラだろう。だからiPhoneやAndroid Mobileといったユーザーエージェントだけではそのデザインの対応が難しくなってくることは容易に想像がつく。
ということで今後求められるのはデバイス幅とPCサイトとの両方の対応をどれだけ的確に出来るかが腕の見せ所となっている。 縦と横で解像度が異なることにも頭を悩ませて、そのまま320ピクセルのスマホ解像度でやろうとしてもいいがGALAXY Noteだとかなり大きくなり過ぎてしまう。
でもCSS3のデバイス幅の機能（max-width/min-width）はよくこの未来を考えられていると思った。これからはデバイス幅でCSS3を駆使してマルチデバイスデザインとレスポンシブルデザインをしていくことが主流になることは間違いないだろう！