《HTML5敏捷實踐》是2013年電子工業出版社出版的圖書,作者是[美]奎文(Cravens,J.)、[美]巴特福德(Burtoft,J.)。
基本介紹
- 書名:HTML5敏捷實踐
- 作者:[美]奎文(Cravens,J.)/[美]巴特福德(Burtoft,J.)
- 譯者:豆葆坤
- ISBN:9787121217029
- 頁數:504
- 定價:89.00元
- 出版社:電子工業出版社
- 出版時間:2013-11-1
- 裝幀:平裝
內容簡介,作者簡介,目錄,
內容簡介
HTML5敏捷實踐》共分10章,包括了HTML5中的語義化、新的樣式、多媒體支持、新的圖形實現方式、更易用互動功能、瀏覽器客戶端存儲、地理定位、Web Worker API、Node.js 伺服器端開發等方面。貫穿全書,作者都在解釋HTML5規範的發展方向和目前規範的成因,這讓讀者更容易理解和正確套用這些規範。作者還向讀者提供了很多非常實用的開發思想,例如分而治之、前後兼容等。本書提供了90個實用的例子,為開發者遇到的常見實際問題提供了比較優雅的解決方案。全書內容源於兩位資深工程師的工作經驗,貼近開發者的實際需要。
作者簡介
Jesse Cravens 是 Frog 公司的高級工程師。Frog 是一家和世界頂級公司合作,提供設計、工程、服務的公司。他有很豐富的網頁套用開發經驗,最近關注於單頁面網頁套用架構、移動網際網路和 HTML5 。
之前,他擁有 USAA 的高級開發和技術管理職位。領導一支移動套用開發團隊,負責USAA領先的iOS、安卓、黑莓和其他移動網頁套用的規劃、設計、開發、測試、實施和維護。這些套用在全球有大約八億用戶。
Jesse 擁有美國萊斯大學的藝術學士學位和位於聖東安尼奧的美國德州大學的課程與教學碩士學位。他目前和妻子和兩個小孩生活在德克薩斯州奧斯汀。他的個人網站是 jessecravens.com。
Jeff Burtoft 是微軟公司的 HTML5 傳教士,每天都很高興地和 HTML5 社區工作在一起。他的部落格地址是 HTML5Hacks.com 。並且自己開發了多款流行移動套用。
Jeff 在網頁套用開發社區有超過 10 年的經驗。他的工作經歷很豐富,做過創業公司的網路管理員和美國國防部的多媒體顧問。Jeff 在位於德克薩斯州聖安東尼奧的財富 500 公司做了超過 5 年的首席前端工程師。Jeff 擁有美國杜肯大學的修辭研究學士學位和位於波多黎各聖胡安的美洲大學的拉丁美洲商業證書。在過去的幾年中,Jeff 主要關注於網際網路:HTML、JavaScript、CSS,現在關注 HTML5。
目錄
第1章 用語義化的方式實現 1
實例01 使用正確的<DOCTYPE>來簡化你的網頁 1
實例02 採用常見結構 2
實例03 使你的HTML5新標籤在舊的瀏覽器里正確渲染 5
實例04 新定義的<INPUT>標籤 11
實例05 不使用JAVASCRIPT實現表單驗證 16
實例06 使用新控制項提高表單的易用性 24
實例07 新的DOM事件 37
實例08 在標記上添加豐富的上下文數據 40
實例09 使用自定義數據跟蹤用戶事件 44
實例10 使機器人和人類能夠像微數據一樣訪問你的頁面 47
第2章 使用樣式 53
實例11 通過瀏覽器前綴實現試驗期CSS功能 54
實例12 使用自定義網路字型設計頁面 56
實例13 使用GOOGLE網路字型來實現簡單的@FONT-FACE 61
實例14 使用CSS3的字型特效美化頁面 70
實例15 不改變透明度來讓元素顯得透明 73
實例16 使用MEDIA QUERY來實現回響式設計 76
實例17 使網頁套用回響設備的方向變化 81
實例18 使用偽類實現對DOM的完全控制 85
實例19 圖片聚合和通過圖片數據URI內聯圖片 87
實例20 通過簡單的方式實現漸變效果 92
實例21 拯救框線,讓框線變得有趣 98
實例22 在同一元素上設定多個背景圖片 103
實例23 使用CSS3變換從傳統空間解放頁面元素 106
實例24 使用CSS3轉換實現變換動畫 110
實例25 使用變換和轉換來實現IOS樣式的翻卡效果 113
實例26 使用RESPOND.JS在IE中模擬MEDIA QUERY 117
實例27 通過VIEWPORT<META>標籤來控制移動網頁布局 121
第3章 實踐多媒體 125
實例28 使用HTML5視頻直接在套用里嵌入視頻 125
實例29 為視頻檔案選擇合適的編碼/解碼器 128
實例30 用視頻API定製視頻播放控制器 130
實例31 使用<CANVAS>標籤為HTML5視頻添加背景 135
實例32 在HTML5視頻元素上添加字幕 139
實例33 美化HTML5視頻字幕 142
實例34 使用CUEPOINT.JS在不支持HTML5的瀏覽器上實現視頻字幕功能 146
實例35 使用BUZZ輕鬆構建複雜的音頻套用 149
實例36 使用MEDIAELEMENT.JS簡化HTML5媒體 153
第4章 使用CANVAS和SVG來做圖形 157
實例37 使用<CANVAS>標籤在HTML5頁面上繪圖 158
實例38 在CANVAS元素上使用樣式 164
實例39 使用圖片檔案修飾CANVAS元素 171
實例40 使用HTML5<CANVAS>標籤創建高清晰度、支持視網膜螢幕的圖形 177
實例41 使用CANVAS圖形加速動畫 180
實例42 使用SVG實現“原生”圖形 187
實例43 使用CSS修飾SVG元素 191
實例44 使用SVG製作動畫 198
實例45 直接在HTML中嵌入SVG 202
第5章 用戶互動 207
實例46 將網頁套用里的所有對象變得可拖放 208
實例47 使用拖放數據傳輸對象更新DOM 212
實例48 在網頁套用中拖入/拖出檔案 218
實例49 通過EDITABLE CONTENT將頁面的每個元素都變得可編輯 224
實例50 將網頁變為一個WYSIWYG編輯器 227
實例51 通過HTML5會話歷史控制瀏覽器的歷史按鈕 230
第6章 實踐客戶端數據存儲 237
實例52 在內聯URL中嵌入二進制數據 237
實例53 將數據URI轉換為BLOB並通過XHR2嵌入到表單數據中 242
實例54 使用WEBSTORAGE API實現用戶數據的持久化 244
實例55 通過YEPNOPE.JS和STORAGE.JS模擬LOCALSTORAGE 250
實例56 使用FILESYSTEM API在本地快取多媒體資源 253
實例57 使用INDEXEDDB和FULLCALENDAR.JS構建里程碑日曆 262
第7章 實踐地理定位 271
實例58 使用地理位置API在移動網頁套用里顯示經緯度 272
實例59 使用GOOGLE的反向地理編碼API反查用戶的位置 278
實例60 在GOOGLE地圖上更新用戶的當前位置 284
實例61 使用GEOLOQI服務構建地理圍欄 289
實例62 使用GEOLOQI實時流服務來廣播遠程用戶的移動 296
實例63 使用WEBSHIMS模擬地理位置API 300
第8章 WEBWORKER API 305
瀏覽器如何執行JAVASCRIPT 305
實例64 使用BLOBBUILDER界面創建內聯工作執行緒 307
實例65 在專有工作執行緒中執行昂貴的數組操作 313
實例66 使用定時器將套用的狀態傳遞給工作執行緒 323
實例67 在獨立WORKER中通過像素操作處理圖片數據 336
實例68 使用引用腳本創建TWITTER的JSONP請求 341
實例69 在多個瀏覽器視窗中同時連線共有WORKER 345
第9章 實踐HTML5連線 349
實例70 使用KAAZING的遠程WEB SOCKET伺服器為瀏覽器返回簡單的回聲訊息 350
實例71 使用NODE.JS和WS模組構建WEBSOCKET伺服器 358
實例72 使用WEB SOCKET、PUSHER API和PHP構建捐贈進度指示器 365
實例73 為JWEBSOCKET創建外掛程式 381
實例74 通過SERVER-SENT EVENTS向瀏覽器推送通知 392
實例75 配置AMAZON S3支持跨域共享網路字型 402
實例76 使用ROBODECK控制HTML5幻燈片 411
實例77 查看SOCKET.IO連線確定它是原生的還是模擬的 432
實例78 使用NODE-SPDY構建簡單的SPDY伺服器 432
第10章 使用NODE.JS實現高級HTML5套用 435
HTML5套用設計的考慮 435
實例79 在瀏覽器中顯示“HELLO HTML5” 436
實例80 通過REQUEST對象檢測用戶代理(UA)字元串 444
實例81 使用NODE.JS的RESPONSE對象向客戶端返回為設備定製的數據 445
實例82 使用NODE.JS包管理器添加一個WEB套用開發框架作為第三方模組 447
實例83 使用EXPRESS套用生成器創建基礎套用 448
實例84 定製模組處理路由 451
實例85 配置EXPRESS啟用視圖引擎 452
實例86 啟用JADE布局使套用視圖遵守DRY 454
實例87 使用JADE視圖部件在視圖中創建簡單的導航條 456
實例88 使用JADE MIXIN在視圖中填充數據 458
實例89 使用STYLUS書寫富有表現力、動態、容錯的CSS 462
實例90 使用HTML5樣板作為默認初始模板 465
成為一個HTML5高手 471
索引 473
實例01 使用正確的<DOCTYPE>來簡化你的網頁 1
實例02 採用常見結構 2
實例03 使你的HTML5新標籤在舊的瀏覽器里正確渲染 5
實例04 新定義的<INPUT>標籤 11
實例05 不使用JAVASCRIPT實現表單驗證 16
實例06 使用新控制項提高表單的易用性 24
實例07 新的DOM事件 37
實例08 在標記上添加豐富的上下文數據 40
實例09 使用自定義數據跟蹤用戶事件 44
實例10 使機器人和人類能夠像微數據一樣訪問你的頁面 47
第2章 使用樣式 53
實例11 通過瀏覽器前綴實現試驗期CSS功能 54
實例12 使用自定義網路字型設計頁面 56
實例13 使用GOOGLE網路字型來實現簡單的@FONT-FACE 61
實例14 使用CSS3的字型特效美化頁面 70
實例15 不改變透明度來讓元素顯得透明 73
實例16 使用MEDIA QUERY來實現回響式設計 76
實例17 使網頁套用回響設備的方向變化 81
實例18 使用偽類實現對DOM的完全控制 85
實例19 圖片聚合和通過圖片數據URI內聯圖片 87
實例20 通過簡單的方式實現漸變效果 92
實例21 拯救框線,讓框線變得有趣 98
實例22 在同一元素上設定多個背景圖片 103
實例23 使用CSS3變換從傳統空間解放頁面元素 106
實例24 使用CSS3轉換實現變換動畫 110
實例25 使用變換和轉換來實現IOS樣式的翻卡效果 113
實例26 使用RESPOND.JS在IE中模擬MEDIA QUERY 117
實例27 通過VIEWPORT<META>標籤來控制移動網頁布局 121
第3章 實踐多媒體 125
實例28 使用HTML5視頻直接在套用里嵌入視頻 125
實例29 為視頻檔案選擇合適的編碼/解碼器 128
實例30 用視頻API定製視頻播放控制器 130
實例31 使用<CANVAS>標籤為HTML5視頻添加背景 135
實例32 在HTML5視頻元素上添加字幕 139
實例33 美化HTML5視頻字幕 142
實例34 使用CUEPOINT.JS在不支持HTML5的瀏覽器上實現視頻字幕功能 146
實例35 使用BUZZ輕鬆構建複雜的音頻套用 149
實例36 使用MEDIAELEMENT.JS簡化HTML5媒體 153
第4章 使用CANVAS和SVG來做圖形 157
實例37 使用<CANVAS>標籤在HTML5頁面上繪圖 158
實例38 在CANVAS元素上使用樣式 164
實例39 使用圖片檔案修飾CANVAS元素 171
實例40 使用HTML5<CANVAS>標籤創建高清晰度、支持視網膜螢幕的圖形 177
實例41 使用CANVAS圖形加速動畫 180
實例42 使用SVG實現“原生”圖形 187
實例43 使用CSS修飾SVG元素 191
實例44 使用SVG製作動畫 198
實例45 直接在HTML中嵌入SVG 202
第5章 用戶互動 207
實例46 將網頁套用里的所有對象變得可拖放 208
實例47 使用拖放數據傳輸對象更新DOM 212
實例48 在網頁套用中拖入/拖出檔案 218
實例49 通過EDITABLE CONTENT將頁面的每個元素都變得可編輯 224
實例50 將網頁變為一個WYSIWYG編輯器 227
實例51 通過HTML5會話歷史控制瀏覽器的歷史按鈕 230
第6章 實踐客戶端數據存儲 237
實例52 在內聯URL中嵌入二進制數據 237
實例53 將數據URI轉換為BLOB並通過XHR2嵌入到表單數據中 242
實例54 使用WEBSTORAGE API實現用戶數據的持久化 244
實例55 通過YEPNOPE.JS和STORAGE.JS模擬LOCALSTORAGE 250
實例56 使用FILESYSTEM API在本地快取多媒體資源 253
實例57 使用INDEXEDDB和FULLCALENDAR.JS構建里程碑日曆 262
第7章 實踐地理定位 271
實例58 使用地理位置API在移動網頁套用里顯示經緯度 272
實例59 使用GOOGLE的反向地理編碼API反查用戶的位置 278
實例60 在GOOGLE地圖上更新用戶的當前位置 284
實例61 使用GEOLOQI服務構建地理圍欄 289
實例62 使用GEOLOQI實時流服務來廣播遠程用戶的移動 296
實例63 使用WEBSHIMS模擬地理位置API 300
第8章 WEBWORKER API 305
瀏覽器如何執行JAVASCRIPT 305
實例64 使用BLOBBUILDER界面創建內聯工作執行緒 307
實例65 在專有工作執行緒中執行昂貴的數組操作 313
實例66 使用定時器將套用的狀態傳遞給工作執行緒 323
實例67 在獨立WORKER中通過像素操作處理圖片數據 336
實例68 使用引用腳本創建TWITTER的JSONP請求 341
實例69 在多個瀏覽器視窗中同時連線共有WORKER 345
第9章 實踐HTML5連線 349
實例70 使用KAAZING的遠程WEB SOCKET伺服器為瀏覽器返回簡單的回聲訊息 350
實例71 使用NODE.JS和WS模組構建WEBSOCKET伺服器 358
實例72 使用WEB SOCKET、PUSHER API和PHP構建捐贈進度指示器 365
實例73 為JWEBSOCKET創建外掛程式 381
實例74 通過SERVER-SENT EVENTS向瀏覽器推送通知 392
實例75 配置AMAZON S3支持跨域共享網路字型 402
實例76 使用ROBODECK控制HTML5幻燈片 411
實例77 查看SOCKET.IO連線確定它是原生的還是模擬的 432
實例78 使用NODE-SPDY構建簡單的SPDY伺服器 432
第10章 使用NODE.JS實現高級HTML5套用 435
HTML5套用設計的考慮 435
實例79 在瀏覽器中顯示“HELLO HTML5” 436
實例80 通過REQUEST對象檢測用戶代理(UA)字元串 444
實例81 使用NODE.JS的RESPONSE對象向客戶端返回為設備定製的數據 445
實例82 使用NODE.JS包管理器添加一個WEB套用開發框架作為第三方模組 447
實例83 使用EXPRESS套用生成器創建基礎套用 448
實例84 定製模組處理路由 451
實例85 配置EXPRESS啟用視圖引擎 452
實例86 啟用JADE布局使套用視圖遵守DRY 454
實例87 使用JADE視圖部件在視圖中創建簡單的導航條 456
實例88 使用JADE MIXIN在視圖中填充數據 458
實例89 使用STYLUS書寫富有表現力、動態、容錯的CSS 462
實例90 使用HTML5樣板作為默認初始模板 465
成為一個HTML5高手 471
索引 473