レスポンシブWebデザイン

とあるWebの制作の話があり、参考にいろいろなWebを見ていました。
その中で、気になったのが、レスポンシブWebデザイン
いつの間にか、WebはPCだけでなく、携帯、スマートフォンタブレット端末などいろいろなデバイスから見られるようになり、作る側はそれぞれの画面サイズの違いを無視できなくなっています。
そこで使われている方法の一つが「レスポンシブWebデザイン」です。

すでに、いい感じのデザインをまとめられているWebもあるので、そこからいくつか紹介します。


Cantina Dorigati

Cantina Dorigati

メニューのレイアウトの変化に注目。



Atlanta Ballet

Atlanta Ballet

サイズに合わせて、小さな画像のサイズも変化。



AIDS.gov

AIDS.gov

画面サイズによってボタンを減らしたり、テキストの段組みを大きく変えたり。



JSDay 2012

JSDay 2012

テキスト中心でも、読みやすく。




そして、話題になっていた日本のWeb。


NHKスタジオパーク

NHKスタジオパーク

ブロックが組み換わっていく感じがいいです。



どのタイミングでどんなサイズでレイアウトしたらいいのか、そろそろパターンもできてきているのでしょうか。

とにかくいろいろ見ていて思いました。


画面を伸び縮みさせるのが面白い!(ポイントを間違ってますかね。)


これからもいろいろ参考にしてみたいと思います。



【参考】
DesignM.ag:40 More Brilliant Mobile Responsive Website Layouts


かんざわ