レスポンシブWebデザインとjQuery Mobile｜1日でマスターjQuery Mobile初心者の記 (6)

今回の講座の中で、jQuery Mobile 1.3で新しく追加された機能、 表示幅に対応して自動的にフォーマットが変化する「Responsive tables」や「Responsive grids」、新しいウィジェットの「Panel」についても説明がありました。

「Responsive tables」はレスポンシブデザインでは必ず一度は壁になる部分だと思いますが、jQuery Mobileではスクリーンサイズによって列数が変化したり、表示が変化するなど簡単に実装できます。

「Panel」はサイドメニューなど横からスライドしてくるメニューで大きいスクリーンサイズでページ本体の右側が切れない様になっています。

また、「Responsive grids」では、MediaQueriesでブレイクポイントがデフォルト設定されており、横方向に余裕がある場合には設定通りに横方向にグリッドが並びます。

今回はすっかりmobileサイトのことだけと思って参加しましたが、jQuery Mobileでレスポンシブなサイトが作れるんですね。

ただ、jQuery Mobileで全てを作ろうとすると、制作内容によっては向き不向きがあるのではなでしょうかとお聞きしたところ、吉川先生はjQuery Mobilesの機能を部分的に使う手法が多いとの事で、これから先そんな内容の講座があったらいいなと思いました。

「スマートフォン向けのサイトが手軽に作れるけどクライアントはテンプレートで満足しないだろうな。」これがjQuery Mobileに対するわたしの先入観念でしたが、最後にはどんなサイトに適しているだろうか。この部分の機能は使えないだろうかなど、実践に向けて考える事ができました。

独学ではできないであろうこの盛りだくさんの内容でしたが、順序よく練られた講座内容は流れる様にスムーズに頭に入ります。また聞きたいところで聞くことができる少人数制のため、わからないまま進むという事がなくストレスがありません。

jQuery Mobile中（上）級編もぜひお願いします！