モバイルフレームワークの大本命が来た！
jQuery作者が明かす「jQuery Mobile」の魅力
2010年11月11日 14時31分更新
JavaScriptをWebデザイナーでも扱える身近な存在に変えた「jQuery」。世界中の有名サイトで使われている人気フレームワークの作者＝ジョン・レッシグ（John Resig）氏が次に注目したのが「モバイル」です。2010年10月に最初のアルファ版がリリースされた「jQuery Mobile」は、モバイルWebアプリケーションフレームワークの本命として、多くの開発者の関心を集めています。
本稿では、11月13日に開幕するWeb Directions East 2010に合わせて来日予定のジョン・レッシグ氏が、jQuery Mobileの魅力（の一部）を紹介します。（編集部）
 |
|---|
| アルファ版がリリースされた「jQuery Mobile」。iPhone、Androidをはじめとするさまざまなモバイルデバイスに対応するフレームワークだ |
クロスブラウザーやブラウザー固有の問題を避け、高いインタラクションを手軽に組み込むには jQueryのようなJavaScriptライブラリーの利用が欠かせません。jQueryはDOMへアクセスしたり、イベントを付け足したり、Ajaxを実行したりといったWebアプリケーションの開発に欠かせない重要な機能を備えています。数えきれないほどの便利な機能を持つjQueryは、どのようなWebアプリケーションの構築においても最適なツールとなりました。
jQuery Mobileは、jQueryで培われたノウハウを生かして開発したフレームワークです。jQuery MobileはjQueryをベースに作り上げられていますが、優れたモバイルアプリケーションの作成に欠かせないウィジェットやレイアウトの仕組みをすべて備えています。jQuery Mobileで作成したページは、iPhoneやAndroidといったスマートフォンのモバイルブラウザーではもちろん、タブレット上でもデスクトップ・コンピューター上でも、機能が限られているモバイルデバイス上でもうまく動作します。
jQuery Mobileには便利な要素がたくさん組み込まれていますが、1つにはHTML5とCSS3を組み合わせた機能があります。たとえば、jQuery MobileではHTML5のdata-*属性を活用してさまざまなGUIを簡単に生成できます。一例を挙げると、あるテキストリンクをボタンにしたいときは、
<a href="index.html" data-role="button">削除</a>
のように、a要素にdata-role="button"を加えるだけで完成します。
 |
|---|
アイコンを追加するときも、data-icon="delete"などのdata-*属性を使って
<a href="index.html" data-role="button" data-icon="delete">削除</a>
のような表現を書き加えるだけ。
 |
|---|
ラッパーでdata-role="controlgroup"を使えば、複数のボタンを簡単にグループ化できます。
<div data-role="controlgroup" data-type="horizontal"> <a href="index.html" data-role="button"data-icon="arrow-u">上へ</a> <a href="index.html" data-role="button"data-icon="arrow-d">下へ</a> <a href="index.html" data-role="button"data-icon="delete">削除</a> </div>
 |
|---|
さらに、jQuery MobileはCSS3の機能を活用することで画像の使用を減らし、モバイル端末に送るファイルサイズを小さくしていいます。通信回線が速くなってきているとはいえ、モバイル向けに可能な限りファイルサイズを抑えられれば、ユーザーの使い勝手を向上できます。
jQueryとQuery Mobileについてさらに知りたい方はぜひ、14日に東京で開催される私のワークショップに参加してください。会場でお会いできることを楽しみにしています。
日本で最初にjQuery Mobileを学ぶ！
作者本人が直接指導するワークショップの開催迫る!!
11月14日に都内で開催される「Web Directions East 2010」では、jQuery/jQuery Mobileの作者であるジョン･レッシグ氏本人が直接指導するワークショップが開催されます。ワークショップでは、jQueryの基本から、コーディングのベストプラクティス、jQuery UIのカスタマイズやプラグインの作成などのTips、jQueryを使ったWebアプリ開発のツボを解説します。
また、後半ではWDEが作成したオリジナルの日本語版仕様書を使って、jQuery Mobileの概要と基本的な使い方も紹介する予定です。日本で一番早く、正しくjQuery Mobileをマスターする絶好のチャンスです。ぜひご参加ください。
お申し込み
著者：John Resig（ジョン・レッシグ）
 |
|---|
米モジラ・コーポレーションのJavaScriptツールデベロッパー。ボストン在住。 Webデザイナー・デベロッパーから圧倒的な支持を集めるJavaScriptフレームワーク「jQuery」 の開発者として世界的に知られる。2010年、「Pro JavaScript Techniques」に続く２冊目の著書「Secrets of the JavaScript Ninja」を上梓予定。Twitter(@jeresig)でも積極的に発言中。
