The Modern Web: Multi-Device Web Development With HTML5, CSS3, and JavaScript

The Modern Web: Multi-Device Web Development With HTML5, CSS3, and JavaScript

読書メモ


-nilog: ちょっとワラタ( ´∀`) 「当初このAPIはバイブレーターAPIと呼ばれていましたが、間もなく現在の名称に変更されました (理由は聞かないでください)」 (2015-06-21)
--http://www.nilab.info/nilog/?type=twitter&id=612445734583951360
--

-nilog: <script> 要素の defer 属性と async 属性。スクリプト実行のタイミングを制御できる。 (2015-06-21)
--http://www.nilab.info/nilog/?type=twitter&id=612455682915172352
--

書籍情報


-Amazon.co.jp: モダンWeb ―新しいWebプラットフォームの基盤技術: Peter Gasston, 牧野 聡: 本
--http://www.amazon.co.jp/exec/obidos/ASIN/4873116929/nilabwiki-22/ref=nosim/
--->誕生から四半世紀を経てWebはその姿を大きく変えています。
--->かつてのWebは単に科学技術文書を公開するためだけの仕組みでしたが、現在ではマルチメディア、ショッピング、アプリケーション、ひいてはオペレーティングシステムさえも包含する技術へと成長しています。
--->このようなWebの最新技術動向を鋭く切り取り、わかりやすく解説したのが本書です。
--->近年脚光を浴びているレスポンシブWebのためのCSSをはじめ、位置情報やバッテリーの状態を取得するためのAPI、プラグインに頼らないマルチメディア再生などを紹介します。
--->さらに、近い将来に普及するであろう注目のWebコンポーネント技術についてもいち早く解説します。

-Amazon.co.jp: The Modern Web: Multi-Device Web Development with HTML5, CSS3, and JavaScript 電子書籍: Peter Gasston: Kindleストア
--http://www.amazon.co.jp/exec/obidos/ASIN/B00CFS5V3Q/nilabwiki-22/ref=nosim/

目次


-O'Reilly Japan - モダンWeb
--http://www.oreilly.co.jp/books/9784873116921/
--->目次
--->賞賛の声
--->まえがき
--->
--->1章 Webプラットフォーム
---> 1.1 用語について
---> 1.2 想定される読者と、読者が知っておくべきこと
---> 1.3 用語の再確認
---> 1.4 HTML5とは
---> 1.4.1 HTML5のひな形
---> 1.4.2 新しいベストプラクティス
---> 1.5 CSS3とその将来
---> 1.5.1 ベンダーごとの接頭辞
---> 1.5.2 CSSのフレームワークとプリプロセッサ
---> 1.6 ブラウザの対応
---> 1.7 テスト、テスト、またテスト
---> 1.8 まとめ
---> 1.9 参考資料
--->
--->2章 HTMLの構造とセマンティックス
---> 2.1 HTML5の新しい要素
---> 2.1.1 新しい要素のポイント
---> 2.1.2 セクショニングコンテンツの要素の欠点
---> 2.2 WAI-ARIA
---> 2.3 意味に基づくマークアップの重要性
---> 2.4 マイクロフォーマット
---> 2.5 RDFa
---> 2.6 マイクロデータ
---> 2.6.1 マイクロデータのAPI
---> 2.6.2 マイクロデータ、マイクロフォーマット、RDFa
---> 2.6.3 Schema.org
---> 2.6.4 リッチスニペット
---> 2.7 データ属性
---> 2.7.1 データ属性のAPI
---> 2.7.2 jQueryとデータ属性
---> 2.7.3 データ属性の利用状況
---> 2.8 Webコンポーネント(未来のマークアップ?)
---> 2.9 まとめ
---> 2.10 参考資料
--->
--->3章 デバイスに応じたレスポンシブなCSS
---> 3.1 メディアクエリ
---> 3.1.1 大きさに関するメディアフィーチャー
---> 3.1.2 メディアクエリの組み合わせや否定
---> 3.1.3 ちょっと寄り道(ピクセルについて)
---> 3.1.4 解像度に関するメディアクエリ
---> 3.1.5 デバイスへの適応
---> 3.1.6 入力に関するメディアクエリ
---> 3.1.7 その他のメディアフィーチャー
---> 3.2 メディアクエリとJavaScript
---> 3.3 アダプティブとレスポンシブの違い
---> 3.3.1 box-sizingプロパティ
---> 3.3.2 大きさの動的な算出
---> 3.4 ビューポートに対する比率
---> 3.4.1 ルート要素に対する比率
---> 3.4.2 モバイルファーストとコンテンツのブレイクポイント
---> 3.5 レスポンシブなデザインとオブジェクトのリサイズ
---> 3.5.1 画像での問題
---> 3.5.2 HTML5での解決策
---> 3.6 まとめ
---> 3.7 参考資料
--->
--->4章 新しいCSSレイアウトのアプローチ
---> 4.1 複数のカラム
---> 4.1.1 余白と罫線
---> 4.1.2 全カラムへの表示と改カラム
---> 4.2 Flexbox
---> 4.2.1 Flexboxモデルの定義
---> 4.2.2 コンテンツの順序の変更
---> 4.2.3 Flexコンテナ内での整列
---> 4.2.4 さらに柔軟なレイアウト
---> 4.2.5 折り返しとフロー
---> 4.3 GridLayoutモジュール
---> 4.3.1 グリッドの宣言と定義
---> 4.3.2 グリッドトラックの繰り返し
---> 4.3.3 グリッド項目の配置
---> 4.3.4 表示位置と重なり
---> 4.3.5 2012年9月版のGridLayoutの構文
---> 4.3.6 GridLayoutでの用語について
---> 4.3.7 グリッドテンプレート
---> 4.4 さらに遠い未来
---> 4.5 まとめ
---> 4.6 参考資料
--->
--->5章 モダンJavaScript
---> 5.1 JavaScriptの新機能
---> 5.1.1 async属性とdefer属性
---> 5.1.2 addEventListenerメソッド
---> 5.1.3 DOMContentLoadedイベント
---> 5.1.4 入力イベント
---> 5.1.5 JavaScriptでのCSSセレクタ
---> 5.1.6 getElementsByClassName()メソッド
---> 5.1.7 クラスの操作
---> 5.2 JavaScriptライブラリ
---> 5.2.1 jQuery
---> 5.2.2 YepNope
---> 5.2.3 Modernizr
---> 5.2.4 Mustache
---> 5.3 ポリフィルとシム
---> 5.4 テストとデバッグ
---> 5.5 まとめ
---> 5.6 参考資料
--->
--->6章 デバイス操作API
---> 6.1 位置情報の取得
---> 6.2 OrientationAPI
---> 6.3 フルスクリーン表示
---> 6.4 バイブレーション
---> 6.5 バッテリーの状態
---> 6.6 ネットワークの情報
---> 6.7 カメラとマイク
---> 6.8 Webストレージ
---> 6.9 ドラッグ&ドロップ
---> 6.10 ファイル操作
---> 6.11 MozillaのFirefoxOSとWebAPI
---> 6.12 PhoneGapとネイティブアプリケーションのラッパー
---> 6.13 まとめ
---> 6.14 参考資料
--->
--->7章 画像とグラフィック
---> 7.1 ベクターとビットマップ
---> 7.2 SVG
---> 7.2.1 SVGデータの構造
---> 7.2.2 リンクされたSVGファイル
---> 7.2.3 埋め込みのSVG
---> 7.2.4 SVGのフィルター
---> 7.2.5 SVGとCSSの統合
---> 7.2.6 SVGの欠点
---> 7.3 canvas要素
---> 7.3.1 画像の操作
---> 7.3.2 WebGL
---> 7.4 SVGとキャンバスの使い分け
---> 7.5 まとめ
---> 7.6 参考資料
--->
--->8章 新しいフォーム
---> 8.1 新しい種類のinput要素
---> 8.2 新しい属性
---> 8.2.1 autofocus属性
---> 8.2.2 placeholder属性
---> 8.2.3 autocomplete属性
---> 8.2.4 spellcheck属性
---> 8.2.5 multiple属性
---> 8.2.6 form属性
---> 8.3 datalist要素
---> 8.4 ウィジェット
---> 8.4.1 数値
---> 8.4.2 日時
---> 8.4.3 色
---> 8.5 ユーザーへの情報表示
---> 8.5.1 progress要素
---> 8.5.2 meter要素
---> 8.5.3 output要素
---> 8.6 クライアント側での値の検証
---> 8.7 ConstraintValidationAPI
---> 8.8 フォームとCSS
---> 8.9 まとめ
---> 8.10 参考資料
--->
--->9章 マルチメディア
---> 9.1 メディア要素
---> 9.1.1 video要素だけの属性
---> 9.1.2 複数のソースファイル
---> 9.1.3 代替表示
---> 9.1.4 サブタイトルとキャプション
---> 9.1.5 エンコード
---> 9.2 メディアフラグメント
---> 9.3 メディアAPI
---> 9.3.1 ネットワークの状況とreadyState
---> 9.3.2 音声や動画に固有のプロパティ
---> 9.4 メディアイベント
---> 9.5 メディアとの高度なインタラクション
---> 9.5.1 WebオーディオAPI
---> 9.5.2 WebRTC
---> 9.6 まとめ
---> 9.7 参考資料
--->
--->10章 Webアプリケーションの作成
---> 10.1 Webアプリケーション
---> 10.1.1 ホスト型とパッケージ型のWebアプリケーション
---> 10.1.2 マニフェストファイル
---> 10.1.3 W3Cのウィジェット
---> 10.2 ハイブリッドアプリケーション
---> 10.2.1 PhoneGap
---> 10.2.2 Titanium
---> 10.3 テレビアプリケーション
---> 10.4 Webinos
---> 10.5 AppCache
---> 10.5.1 マニフェストファイル
---> 10.5.2 キャッシュの手順
---> 10.5.3 AppCacheのAPI
---> 10.6 まとめ
---> 10.7 参考資料
--->
--->11章 将来のWeb
---> 11.1 Webコンポーネント
---> 11.1.1 テンプレート
---> 11.1.2 デコレーター
---> 11.1.3 カスタム要素
---> 11.1.4 シャドーDOM
---> 11.1.5 Webコンポーネントの全体像
---> 11.2 未来のCSS
---> 11.2.1 リージョン
---> 11.2.2 エクスクルージョン
---> 11.2.3 さらに未来のレイアウト
---> 11.2.4 フィーチャークエリ
---> 11.2.5 カスケード変数
---> 11.3 まとめ
---> 11.4 参考資料
--->
--->付録A 各ブラウザの対応状況(2014年7月時点)
---> A.1 ブラウザについて
---> A.2 実験的機能の有効化
---> A.3 1章 Webプラットフォーム
---> A.4 2章 HTMLの構造とセマンティックス
---> A.5 3章 デバイスに応じたレスポンシブなCSS
---> A.6 4章 新しいCSSレイアウトのアプローチ
---> A.7 5章 モダンJavaScript
---> A.8 6章 デバイス操作API
---> A.9 7章 画像とグラフィック
---> A.10 8章 新しいフォーム
---> A.11 9章 マルチメディア
---> A.12 10章 Webアプリケーションの作成
---> A.13 11章 将来のWeb
---> A.14 更新履歴
--->
--->付録B 参考資料一覧
---> B.1 まえがき
---> B.2 1章 Webプラットフォーム
---> B.3 2章 HTMLの構造とセマンティックス
---> B.4 3章 デバイスに応じたレスポンシブなCSS
---> B.5 4章 新しいCSSレイアウトのアプローチ
---> B.6 5章 モダンJavaScript
---> B.7 6章 デバイス操作API
---> B.8 7章 画像とグラフィック
---> B.9 8章 新しいフォーム
---> B.10 9章 マルチメディア
---> B.11 10章 Webアプリケーションの作成
---> B.12 11章 将来のWeb
--->
--->索引