内容説明
モバイルファーストを容易に実現するフレームワーク「jQuery Mobile」を徹底解説！ フラットデザインに対応した最新バージョン1.4対応。導入前に知っておくべき基本はもちろん、UIパーツを使いこなす法則やページレイアウトをカスタマイズする法則、スマートフォンならではのジェスチャー操作を生かす法則など、モバイル向けのWebサイト制作に役立つ100個ノウハウを解説！
目次
序章
第1章 jQuery Mobileの基本を知る法則
法則1 ページの設定と構成要素を理解する
法則2 Ajaxを使ったページ遷移を理解する
法則3 Ajaxによるページ遷移の不具合を解消する
法則4 jQuery Mobileに用意されているボタンを把握する
法則5 ボタンにアイコンを表示する
法則6 ページのヘッダに「戻る」ボタンを表示する
法則7 複数のボタンをグループ化してユーザビリティを高める
法則8 ヘッダを固定して最大限に有効活用する
法則9 フッタのレイアウトを調整して見やすくする
法則10 複数ページにまたがるコンテンツを自由に行き来する
法則11 リストを使ってコンテンツを階層化する
法則12 読み込み専用のリストを使用する
法則13 リストに自動で区切りを挿入する
法則14 新着リストに更新時間を表示する
法則15 画像と簡単な情報をまとめた商品一覧ページを作成する
法則16 下層ページの情報量をリストに表示してユーザーのストレスを軽減する
法則17 状況に合わせた文字入力フォームを選択する
法則18 スマートフォンらしいタッチパネルを生かしたフォームを利用する
法則19 選択入力可能なメニューを利用する
法則20 必須項目が入力されたら「送信」ボタンをアクティブに変更する
法則21 基本要素を理解してユーザーフレンドリーなアンケートページを作成する
法則22 買い物カートを利用したECサイトを作成する
章末コラム iPhoneとAndroidの違い
第2章 基本的なUIパーツを使いこなす法則
法則23 検索フォームにプレースホルダーとフィルタリング機能を使う
法則24 オートコンプリート機能を利用してユーザーの入力をサポートする
法則25 フォームの入力内容をあらかじめ指定する
法則26 ダイアログボックスの閉じ方やトランジションをカスタマイズする
法則27 ダイアログボックスの「閉じる」ボタンの位置を変更する
法則28 サイトが単調にならないようにダイアログボックスを使い分ける
法則29 ポップアップウィジェットを使用する
法則30 ポップアップウィジェットの位置や見栄えを変える
法則31 オーバーレイポップアップウィジェットを使用する
法則32 パネルウィジェットを使用して複雑なサイト構造を一覧できるようにする
法則33 パネルウィジェットにリストを設置してより多くのリンクを表示させる
法則34 グリッドレイアウトを使った緩急のあるサイトを作る
法則35 レスポンシブグリッドでモニタサイズや端末の向きに応じたレイアウトにする
法則36 レスポンシブテーブルでモニタサイズや端末の向きに応じたレイアウトにする
法則37 カラムトグルのチェックボックスを使ってコンテンツの表示・非表示を切り替る
法則38 開閉式コンテンツを利用して情報を効率的に格納する
法則39 開閉式コンテンツを複数並べてアコーディオンメニューにする
法則40 開閉式コンテンツのアイコンを変更する
章末コラム CSSのマルチクラスの記述方法
第3章 ページレイアウトをカスタマイズする法則
法則41 複雑になりがちなリストを見やすくする
法則42 初期状態の2つのテーマを理解する
法則43 自分で新しいテーマを作成してページに反映する
法則44 ページ遷移のエフェクトを理解して状況によって使い分ける
法則45 ヘッダとフッタを画面外に移動させ、フルスクリーンモードで読みやすくする
法則46 サイト全体に共通でヘッダ、フッタを固定表示する
法則47 ヘッダに複数のボタンを設置してページ全体の情報量を増やす
法則48 レイアウトを工夫してフッタを活用し、サイトをより見やすくする
法則49 ヘッダメニューをプルダウンメニューに変更してボタン数を増やす
法則50 プルダウンメニューに一手間加えて操作感を向上させる
法則51 ページ遷移時に表示されるローダーをオリジナルのものにする
法則52 省略されて「...」と表示される長いテキストを省略しないようにする
法則53 「ホーム画面に追加」をした際のサイトのアイコンをカスタマイズする
法則54 背景にパターン画像を敷いてjQuery Mobileサイトの見栄えを変える
法則55 タブナビゲーションに通知件数アイコンを入れる
法則56 端末の種類や回転方向、解像度を識別してスタイルを反映する
法則57 オリジナルアイコンを作成してサイトのオリジナリティを高める
法則58 CSS3のグラデーションを利用した立体的なボタンを作成する
法則59 CSS3のシャドウを利用した立体的なボタンを作成する
法則60 グローバル設定を利用してサイト全体のレイアウトを統一する
法則61 すべてのページにTwitterとFacebookへの投稿ボタンを設置する
法則62 デフォルトの角丸とドロップシャドウを削除してシンプルなページを作成する
法則63 ページトランジションを自分でカスタマイズする
章末コラム CSSやCSS3の活用
第4章 スマートフォンならではのジェスチャーを生かす法則
法則64 スマートフォン独自のジェスチャーに対するイベントを取得する
法則65 画面の回転のタイミングを取得して縦長画像と横長画像を入れ替える
法則66 背景色をスクロール位置に応じて変える
法則67 ページのロードが完了した結果で成功と失敗のメッセージを表示する
法則68 ページを移動するたびにランダムに画像を切り替える
法則69 スクロール位置が変わったときにページトップボタンを表示する
法則70 どのリンクから移動してきたかによってページ上の文章を変える
法則71 複数の開閉パネルを同時に開いたり閉じたりする
章末コラム マウスで操作するサイトとタッチ端末で操作するサイト
第5章 フレームワークやプラグインを活用する法則
法則72 スマートフォンサイトでGoogleマップを表示する
法則73 Googleマップにマーカーを付けたりクローズアップしたりする
法則74 端末をシェイクして画面を変える
法則75 スワイプで次の画像に移動するフォトギャラリーを作る
法則76 入力された郵便番号をもとに住所を自動表示する
法則77 リスト要素の右肩にバッジを追加する
法則78 データロードの成功時と失敗時に状況に合わせたアラートを表示する
法則79 Webサイト上で効果を見ながらjQuery Mobileのテーマを作成する
法則80 サードパーティ製のデザインを探してページに反映する
法則81 Twitter Bootstrap風のデザインにする
法則82 jQuery Mobile独自のデザインを利用しないようにする
章末コラム オープンソースのプラグインの選び方
第6章 WordPress＆EC-CUBEをカスタマイズする法則
法則83 YouTube RSSフィードからJSONをロードして一覧表示する
法則84 検索結果の一覧にサムネイル画像を表示する
法則85 作成したリストをタブで切り替えられるようにする
法則86 通知プラグインを使用して、RSSのロードに失敗したらアラートを表示する
法則87 WordPressで構築したブログを端末に合わせて振り分ける
法則88 WordPressに対応したjQuery Mobileテーマを作成する
法則89 検索サイトからリンクしてきたときにもトップページに戻れるようにする
法則90 「前の記事へ」「次の記事へ」リンクをテキストからボタンに変更する
感想・レビュー
※以下の感想・レビューは、株式会社ブックウォーカーの提供する「読書メーター」によるものです。
commojun
