投稿

7月, 2011の投稿を表示しています

興味本位でSwap Skillsへ参加したら非常に楽しいことになりました

イメージ
勉強会をよくされているSwapSkillsさんの「One Web」へ参加してきました。

普段Webデザインの流行りをあまり追っていませんでしたが、本当に興味深い内容が議論されているということがわかりました。現在ネットに接続しているデバイス数はうなぎのぼり。そしてそのデバイスの解像度がばらばらで、従来のようにPCサイト、モバイルサイト、スマートフォンサイトなどをUA等で区別してサイトを立ち上げるのには限界があります。

運用増からくる帰宅困難者を増加させるだけで、全くメリットがありません。

そこで!現在海外で注目されているのが

Progressive Enhancement
Responsive Design
OS/Device Specific

の3つ。

特に最初の2つがとても重要です。
Progressive Enhancementは、各ブラウザで全く同じデザインにしなければいけないという考え方ではなく、各ブラウザで適切なデザインを表示するというもの。そして、Responsive Designはブラウザの大きさによって表示内容を動的に変更するということです。

Responsive Designということは、One Sourceでマルチデバイス対応をするという概念ですが、Responsive Designをするにあたって考えなければならないのがモバイルファーストという概念。

従来のPCサイトをモバイルやスマートフォンに最適化するという流れではなく、逆にモバイル、スマートフォンで見せたい内容・コンテンツを第一に考え、そこからPCやさらにはWebTVまで視野に入れたデザインをするという考え方です。これにより、どんなコンテンツを見せればいいのか、訪れたユーザーが見たいコンテンツとは何かをまず考える事になり、それをもとにモバイルページが構築できるわけです。

モバイルファーストの考え方だと、コンテンツにフォーカスがいき、そこからPC画面での導線の構築にもつながっていくという意味で、本来のWebのありかたにもっと近づくのではないかと思います。

Responsive Designについては、例えば、jQuery Mobileのページを見てください。

あるwidthまでは1カラムで表示されています。


しかし、ある程度のwidthを超えると2カラムになります。


このようなデザインは、…