第２回　レスポンシブWebデザインとは

オープンガバメントコンソーシアム　顧問　木寺祥友

 前回HTML5への期待からレスポンシブWebデザインの流れになった話をしたが、今回はレスポンシブWebデザインとは何かをお話ししたい。

iPadをはじめとするタブレットや、iPhone、Androidの各社端末など様々なスマートフォンの登場で、スクリーンサイズは多様化してきた。

今後、次から次と新しい製品が出る度に端末に合わせたWebページを構築するのがますます困難となってきている。さらにアプリはダウンロード式なので、機種を変えただけでその機種に合ったアプリをダウンロードしなければならない。そしてデベロッパーは新しい機種が出ればそれに合わせたアプリを制作しなければならない。その解決策として登場したレスポンシブwebデザインは、ブラウザの横のウインドウサイズに合わせてフレキシブルに最適なレイアウトに変化させて表示するための新しい制作手法だ。

簡単に説明すると複数のスタイルシート（CSS）を用意して、表示するコンテンツは同じだが、ブラウザの横のサイズに合った適正なスタイルシートを表示させるのである。ちょうどいいサイズのスタイルシートがなく、スタイルシートよりブラウザが小さいサイズの場合は、テキストは横のサイズに合わせて折り返しされ、画像も縮小させて表示するようにさせるのである。つまりデバイス（SmartWatch、iPhone、Android、Kindle、 iPad 、 PC、 HDTV、SmartTV）毎に複数のサイズのページを用意してそれぞれ更新するという手間が省けるという大きなメリットがある。1つのHTMLを更新するだけで全てのデバイスに対応するサイトを更新することができる。端末のメモリ容量やスペックに頼ったアプリと対局にいる、正にクラウドコンピューティング時代に合ったWebページ制作手法である。

ここまでお話するととても難しい新しい手法のように感じるが、プログラミングとしてはHTML5&CSS3のみ、W3C完全準拠である。はじめは無料だが普及したら有料にしたAndroidのように、特定のデベロッパーに依存することがない。１URLなのでSEO対策もOK、モバイルとPC用のURLが異なるということもない。フロント（HTML）だけでマルチデバイス対応になるので、サーバー環境を変更する必要がない。どのようなクラウド環境にも対応可能である。マルチデバイスからのアクセスが一般的になったWebにとって、正にアプリに反旗をひるがえした革命である。(2013/4/25)

次回、Web標準化の歴史

◎シリーズ予定
第１回　HTML5への期待
第２回　レスポンシブWebデザインとは
第３回　Web標準化の歴史
第４回　レスポンシブWebデザインの事例
第５回　レスポンシブWebデザインの課題
第６回　レスポンシブWebデザインの未来

木寺祥友（きでら・よしとも）
株式会社エル・カミノ・リアル（http://www.ecreal.co.jp/pc/top/index.html）　代表
パソコン黎明期よりＩＴ業界へ足を踏み入れ、1995年日本初のJavaプロジェクトにかかわり日本人としてはじめてJavaをプログラムする。サン・マイクロシステムズの協力により『Javaを創った人々』を執筆。2001年、携帯電話にJavaが搭載されることを機にNTTドコモｉアプリのプラットフォーム作りに携わる。2006年ラスベガスで開催されたCTIAで講演。著書『アンドロイド・ジャパン ―日本企業の命運を握るプラットフォーム―』『Javaを創った人々』『マックユーザーのための目標ナビゲーション』『川柳で覚えるビデオ撮影術』『今すぐできるiアプリプログラミング』