CSS Nite in MIYAZAKIに参加して、レスポンシブWebデザインを勉強しました!

CSS Nite in MIYAZAKI

2011.11.12に開催された『CSS Nite in MIYAZAKI, Vol.3』に参加してきました!

このイベントは、Web制作に関わる方のためのセミナーイベント CSS Nite の宮崎版で、今年で3回目の開催でした。

内容は、

  • DreamweaverによるレスポンシブWebデザインの実装
  • 効率と品質を両立するWebサイト制作術
  • ワークショップ

とても興味のある内容でしたが、やはり自分には難易度が高く、半分くらいしかついていけませんでした。
参加者は、ほとんどがWebの制作会社やデザイン会社の方達で、理解されている方はかなり頷かれていました。

しかし、Web制作の第一線で活躍されている方の技術を見ることができるので、とても勉強になりますし、刺激を受けることができます。日南からももっと参加が増えてくれれば良いのにと、参加2回目ながら思いました。

イベントの模様は、カメラマン「くろ。」さんのブログをご覧下さい。

 

さて本題ですが、
今回勉強してきた「レスポンシブWebデザイン」とは、デバイスごとに複数のデザインを用意するのではなく、ブラウザーのウィンドウサイズに合わせてデザインをフレキシブルに調整する制作手法のことです。

つまり、1つのページを、PC・タブレット・スマートフォンなどで、それぞれレイアウトを変えたデザインで表示させる技術のことです。スマートフォンの利用者がかなり多いので、こういう技術はとても興味がありました。

 

Dreamweaverではないですが、MTを使ったこのブログをレスポンシブWebデザインにしてみました!
ブラウザの横幅を変えてみて下さい。3段階で表示が変化します。
※FirefoxやGoogle Chromeなど、インターネットエクスプローラー(IE)以外のブラウザでお試し下さい。

PC版
パソコンで見た時の表示です。
 

タブレット版
タブレット端末の幅で見た時の表示です。

 

 スマートフォン版
スマートフォンの幅で見た時の表示です。

こんなことができるようになっただけでも参加した甲斐があったと感じています。
DreamweaverやFireworksなどのソフトは普段使用していないのですが、便利さがわかったので機会があれば使ってみたいです。

こういうIT系イベントを日南市でも開催してもらえるように頑張ろうと思っています!!!