目 錄

第1章 利用HTML5製作網站 1
1.1 大多數人不瞭解HTML5時代的網頁設計 1
1.2 HTML5帶來的網頁結構、設計風格及理念的變化 3
1.2.1 HTML 4時代的幾個特徵 4
1.2.2 一個典型的HTML5頁麵 4
1.2.3 小結 6
1.3 HTML5帶來的標簽變化 6
1.3.1 什麼是標簽 6
1.3.2 標簽的分類 7
1.3.3 近十幾年來的HTML 9
1.3.4 Web的變化趨勢 9
1.4 HTML5帶來的錶單數據內容進化 9
1.4.1 數據提交格式的變化 10
1.4.2 數據提交範圍的變化 11
1.4.3 錶單數據類型的增加 12
1.4.4 錶單屬性和驗證方式的進化 13
1.4.5 文件上傳控件和重復模型的應用 14
1.4.6 小結 14
1.5 HTML5與SEO 15
1.5.1 技術趨勢 15
1.5.2 搜索引擎服務商麵臨的問題 16
1.5.3 SEO從業人員麵臨的問題 17
1.5.4 SEO麵臨的幾個社會問題 18
1.6 HTML5的開發環境與調試環境 18
1.6.1 HTML5編寫工具 18
1.6.2 JavaScript開發 19
1.6.3 HTTP監控 19
1.6.4 調試環境 20
1.7 案例：HTML5網站建設 22
1.7.1 需求的提齣 22
1.7.2 需求分析 22
1.7.3 係統分析 22
1.7.4 工程實現 23
1.7.5 小結 27
第2章 用CSS3完善網站 28
2.1 文字模塊 29
2.1.1 文字陰影：text-shadow 29
2.1.2 文字溢齣：text-overflow 30
2.1.3 文字換行：word-wrap 30
2.2 顔色模塊 31
2.2.1 透明度：opacity 31
2.2.2 HSL 33
2.2.3 HSLA和RGBA 33
2.3 邊框模塊 34
2.3.1 邊框圓角：border-radius 34
2.3.2 邊框顔色：border-color 36
2.3.3 邊框圖像：border-image 37
2.3.4 盒陰影：box-shadow 40
2.4 用戶界麵模塊 41
2.4.1 盒倒影：box-reflect 41
2.4.2 盒大小：box-sizing 41
2.5 背景模塊 42
2.5.1 背景漸變 42
2.5.2 background-origin 45
2.5.3 background-clip 46
2.5.4 background-size 47
2.5.5 多背景 48
2.5.6 遮罩 49
2.6 動畫模塊 51
2.6.1 transform 51
2.6.2 transition 53
2.6.3 animation 55
2.7 區域模塊 57
2.7.1 故事綫 58
2.7.2 區域樣式 60
2.7.3 內容形狀和環繞 60
2.7.4 小結 62
2.8 選擇器 62
2.8.1 結構僞類 63
2.8.2 否定僞類 65
2.8.3 狀態僞類 65
2.8.4 目標僞類 66
2.8.5 其他選擇器 66
2.9 其他模塊 68
2.9.1 多欄布局 68
2.9.2 彈性盒子布局 68
2.9.3 網絡字體 69
2.9.4 媒介查詢 70
2.9.5 濾鏡效果 70
2.9.6 著色器 70
2.10 使用CSS3美化網站 72
2.10.1 右上角文字 73
2.10.2 下載盒子 74
2.10.3 圖片格子 74
2.10.4 中間盒子 74
2.10.5 左右盒子 75
2.10.6 居中背景 76
2.10.7 載入效果 76
2.10.8 頁腳 77
2.11 小結 77
第3章 劃時代的Web API 79
3.1 傳統Web模型與Web OS架構模型 79
3.2 Web API的概要介紹 81
3.3 Drag & Drop API 82
3.3.1 以前的解決方案 82
3.3.2 Drag & Drop API的優點 83
3.3.3 如何檢測瀏覽器是否支持
Drag & Drop API 83
3.3.4 Drag & Drop API的主要操作 84
3.3.5 文件拖放上傳實例 86
3.4 History API 87
3.4.1 以前的解決方案 87
3.4.2 現在的History API 87
3.5 Communication API 89
3.5.1 以前解決跨源通信的方案 89
3.5.2 XMLHttpRequest Level 2 90
3.5.3 iframe和sandbox 91
3.5.4 跨文檔消息通信 92
3.6 Notification API 97
3.6.1 如何檢測瀏覽器是否支持Notification API 97
3.6.2 Web的Notification的狀態 97
3.6.3 讓你的Web App帶著Notification跑 97
3.7 audio標簽和video標簽 99
3.7.1 audio標簽 100
3.7.2 video標簽 102
3.8 Canvas API 108
3.8.1 以前的同類解決方案 109
3.8.2 Canvas的優點 109
3.8.3 檢測瀏覽器是否支持Canvas 109
3.8.4 Canvas主要操作 109
3.9 WebSocket API 110
3.10 Web Worker API 111
3.11 Web Storage API 111
3.12 MicroData和語義網絡 111
3.12.1 MicroData的常見屬性 112
3.12.2 MicroData的例子 112
3.12.3 MicroData與SEO——人類需要有序的信息 113
3.12.4 語義網絡的基本概念 113
3.12.5 語義測試工具 114
3.13 通用Base64方法 114
3.13.1 編碼 114
3.13.2 解碼 115
3.13.3 應用 115
3.14 Web Database API 117
3.14.1 Web SQL API 117
3.14.2 Indexed DB API 121
3.15 WebGL 124
3.16 Device API 係列 125
3.16.1 Geolocation API 125
3.16.2 File API 128
3.16.3 FileWriter API 132
3.16.4 Media Capture API 132
3.16.5 Contact API 133
3.16.6 System Information API 134
3.16.7 Calendar API 137
3.16.8 Messaging API 137
3.17 小結 138
第4章 Canvas 2D 139
4.1 什麼是Canvas 139
4.2 Canvas 2D原理 140
4.2.1 坐標係統說明 141
4.2.2 屬性說明 142
4.3 繪製 143
4.3.1 各類綫條 143
4.3.2 矩形 151
4.3.3 三角形 152
4.3.4 圓與扇形 153
4.3.5 圖片 155
4.3.6 文字 158
4.4 特效 160
4.4.1 漸變 160
4.4.2 陰影與透明 162
4.5 基礎操作中比較復雜的部分 162
4.5.1 保存和恢復 163
4.5.2 坐標轉換 163
4.5.3 鏇轉 164
4.5.4 縮放 164
4.5.5 變形 164
4.5.6 組閤 166
4.5.7 裁剪 167
4.5.8 像素操作 170
4.6 動畫 172
4.6.1 左右運動 172
4.6.2 上下運動 173
4.6.3 圓心鏇轉運動 174
4.6.4 拋物綫運動 175
4.6.5 漸變運動 175
4.7 事件感應 176
4.8 關於Canvas的一些經驗 177
4.8.1 迴答兩個問題 177
4.8.2 避開浮點運算 178
4.8.3 資源載入與雙緩衝問題 178
4.8.4 圖片抗鋸齒的原理及辦法 179
4.8.5 粒子係統的使用 181
4.9 Web開發復古流 181
4.10 小結 182
第5章 HTML5和移動互聯網開發 183
5.1 移動互聯網的現狀與需求 183
5.1.1 市場容量 184
5.1.2 移動設備的特點 184
5.1.3 移動設備的現狀 185
5.1.4 開發者生態圈 185
5.1.5 可供選擇的移動互聯網開發平颱 185
5.2 HTML5在移動互聯網上的開發示例 187
5.2.1 一個HTML5開發者的基本配置 187
5.2.2 歐朋瀏覽器H5版介紹 188
5.2.3 重力傳感設備 191
5.2.4 電子羅盤開發 199
5.2.5 Geolocation與LBS應用開發 203
5.2.6 網頁攝像與網絡相冊 207
5.2.7 移動設備中的離綫存儲 214
5.3 小結 215
第6章 WebSocket開發應用 216
6.1 WebSocket的那些事兒 216
6.1.1 WebSocket的技術背景 217
6.1.2 WebSocket的定義 218
6.1.3 WebSocket通信模式解析 219
6.1.4 WebSocket檢測瀏覽器支持代碼 220
6.2 WebSocket API的內容 220
6.2.1 屬性 220
6.2.2 URL 221
6.2.3 事件 221
6.3 客戶端樣例程序 222
6.4 服務器端樣例程序 222
6.5 Ajax、長輪詢、Comet之間的那些事兒 223
6.5.1 Ajax 223
6.5.2 長輪詢 225
6.5.3 Comet 226
6.5.4 Ajax與WebSocket的多角度對比 227
6.6 與WebSocket相關的幾個概念 227
6.6.1 SSJS 228
6.6.2 Node.js 228
6.7 開發基於WebSocket的通信示例 235
6.7.1 聊天室 235
6.7.2 服務器監控 239
6.7.3 聯機作圖 243
6.8 免費的WebSocket資源 247
6.9 小結 248
第7章 瘦服務器戰略與雲 249
7.1 戰略觀察與未來10年的思考 249
7.1.1 Web瘦服務器戰略 249
7.1.2 雲 253
7.1.3 計算能的思考 254
7.2 Web Storage 255
7.2.1 Web Storage的概念 255
7.2.2 localStorage介紹與示例 255
7.2.3 sessionStorage的介紹與示例 258
7.2.4 瀏覽器端存儲的方案和局限性 260
7.3 離綫應用 265
7.3.1 判斷瀏覽器是否在綫 266
7.3.2 離綫應用的屬性與方法 266
7.3.3 manifest文件 267
7.4 Web Worker 269
7.4.1 Worker 270
7.4.2 Shared Worker 273
7.4.3 Web Worker小結 275
7.5 一個雲記事本的案例 276
7.5.1 客戶端邏輯分析 276
7.5.2 客戶端的實現 277
7.5.3 工程實現的聯想 279
7.6 小結 279
附錄A HTML5標簽、事件屬性及其
相關網站 281
附錄B 審慎對待各種框架 287
附錄C 統一開發常用交流術語 289
附錄D WebGL 294
附錄E CSS3模塊列錶 299
· · · · · · (收起)