HTML5 規格最新發展現況 (HTML5 趨勢發展與技術應用論壇)
57 likes•13,398 views
文档详细记录了HTML5的发展历程，包括其起源、与W3C的合作、主要更新和发布、技术特点和应用等。HTML5不断进化，已有许多著名公司和网站在使用这一技术，未来也将继续发展。读者应关注HTML5的最新动态及其在各种环境中的应用。
![All services from your imperative.
9
2011 / 更多廠商加入 HTML5 陣營
Disney (迪士尼)
併購一家以 HTML5 技術為主的遊戲公司 [ News ]
Pandora Internet Radio ( http://www.pandora.com/ )
線上音樂公司，改採 HTML5 技術為其撥放器
Amazon
Kindle 電子書改用 HTML5 技術
Twitter
其 iPad 版本改用 HTML5 為主
Alexa Top100 網站中有 34% 使用 HTML5
Adobe 宣布在行動裝置上的 Flash 不再更新](https://image.slidesharecdn.com/html5-131003003049-phpapp02/85/HTML5-HTML5-9-320.jpg)
HTML5 規格最新發展現況 (HTML5 趨勢發展與技術應用論壇)
- 1. 1 HTML5 規格最新發展現況 多奇數位創意有限公司 技術總監 黃保翕 ( Will 保哥 ) 部落格：http://blog.miniasp.com/ 擁抱 HTML5 就趁現在
- 2. All services from your imperative. 2 HTML5 發展歷史 The history of HTML5
- 3. All services from your imperative. 3 2004 / WHAT 工作小組誕生 WHATWG Web Hypertext Application Technology Working Group 推動網路 HTML 5 標準為目的而成立的組織 WHATWG 成立的原因是 W3C 意圖放棄 HTML，而力圖發展 XML/XHTML 技術。 工作小組的成員 (都是瀏覽器廠商) Opera, Mozilla Foundation, Apple 歷史事件 WHATWG 郵件列表公佈於 2004/6/4，在 Opera 與 Mozilla 宣布 加入後的 2 天，便否決了由 W3C 成員在W3C Workshop 的 Web 標準。
- 4. All services from your imperative. 4 2006 / W3C 宣布將與 WHATWG 合作 W3C 力圖發展的 XHTML 大勢已去 決定改與 WHATWG 合作發展 HTML 技術 WHATWG 主力發展項目 Web Forms 2.0 逐步改善 HTML4.01 的表單特性 Web Apps 1.0 發展以 HTML 為主的應用程式特性 Web Controls 1.0 發展各種互動式 UI 介面
- 5. All services from your imperative. 5 2007 / 正式命名 "HTML5" 2007/4/10 Mozilla Foundation, Apple, Opera 聯手建議 W3C 的 HTML 工作小組採納 WHATWG 的 HTML5 規格，並將 該規格當成未來 HTML5 的發展起點。 2007/5/9 W3C 同意了這個建議 http://lists.w3.org/Archives/Public/public- html/2007May/0909.html
- 6. All services from your imperative. 6 2008 / 第一個公開的 HTML5 草案出爐 2008/1/22 第一個公開的 HTML5 草案出爐 部分規格已經實作於部分瀏覽器 (P.S. 定制這份規格的成員都是瀏覽器廠商) Firefox 3 是當時第一位宣稱HTML5相容的瀏覽器 Chrome, Safari 與最後 IE 也都加入行列 Ian Hickson 為當時的文件編輯者 重要觀念 HTML5 是一個不斷修定的規格，甚至不會有所謂 「完成」的一天！
- 7. All services from your imperative. 7 2009 / W3C 宣告 XHTML 2.0 停止更新 W3C 宣告 XHTML 2.0 停止更新 FAQ about the future of XHTML 包括以下文件： XHTML 2.0 CURIE XFrames HLink XHTML+MathML+SVG Profile XHTML Modularization 1.0 Second Edition
- 8. All services from your imperative. 8 2010 / HTML5 大躍進 YouTube 提供 HTML5 撥放器 透過 TestTube 提供測試版 (TestTube) 賈伯斯 (Jobs) 對外宣布放棄 Flash 支援 "Flash was designed for PCs using mice, not for touch screens using fingers." – Steve Jobs 這讓許多人開始擁抱 HTML5 技術! 知名電子書商 Scribd 轉往 HTML5 技術 所有電子書改以 HTML5 為呈現技術 更易於在平板上閱讀文件 Chrome Web Store 正式開張 完全以 HTML5 為主要開發技術
- 9. All services from your imperative. 9 2011 / 更多廠商加入 HTML5 陣營 Disney (迪士尼) 併購一家以 HTML5 技術為主的遊戲公司 [ News ] Pandora Internet Radio ( http://www.pandora.com/ ) 線上音樂公司，改採 HTML5 技術為其撥放器 Amazon Kindle 電子書改用 HTML5 技術 Twitter 其 iPad 版本改用 HTML5 為主 Alexa Top100 網站中有 34% 使用 HTML5 Adobe 宣布在行動裝置上的 Flash 不再更新
- 10. All services from your imperative. 10 2012 / 更多網站使用 HTML5 技術 Flickr 改用 HTML5 為照片上傳機制 (含大檔上傳) LinkedIn 其 iPad 版本改用 HTML5 為主 Wix.com 2012 六月發佈 HTML5 網站產生器 發佈 90 天後建立超過一百萬個 HTML5 網站
- 11. All services from your imperative. 11 2013 / 更廣泛的佈署 HTML5 HTML5 更加普及 "HTML5 Popularity Among Fortune 500 Companies" -- INCORE. Retrieved 5 August 2013. 美國財星 500 大企業中已有 153 家採用 HTML5 技術 HTML 5.0 規格將有大幅進展 今年已將規格狀態變更為：Call for Review 驚人的行動力 今年初統計，全球已賣出超過 10 億支支援 HTML5 瀏覽器的智慧型手機。
- 12. All services from your imperative. 12 HTML5 發展現況 The status of HTML5
- 13. All services from your imperative. 13 推出 HTML 5.0 正式版 Plan 2014 http://dev.w3.org/html5/decision-policy/html5-2014-plan.html W3C CEO 要求在 2014 年底前將 HTML 5.0 變 更為 REC (推薦版本) 狀態。 里程碑規劃 CR: 2012 Q4 (移除不穩定的HTML5功能) LCf: 2014 Q3 (最終版本確定) PR: 2014 Q4 (提交推薦版本) Rec: 2014 Q4 (正式公告推薦版本)
- 14. All services from your imperative. 14 HTML5 規格發展準則 永不停歇的發展規格 由工作小組成員提交草案 由各家瀏覽器選擇性進行實作與實驗 發布正式規格的準則 有哪些瀏覽器已經實作哪些功能 每個功能特性的穩定性如何 每個功能之間的交互性是否可靠 新增功能有哪些潛在的風險
- 15. All services from your imperative. 15 HTML 5.0, HTML 5.1, HTML 5.2, … HTML5 的發展計畫 http://en.wikipedia.org/wiki/HTML5#Plan_2014
- 16. All services from your imperative. 16 HTML 5 有哪些可用的技術 Which features can I use in the HTML5?
- 17. All services from your imperative. 17 HTML5 包括哪些內容？ 標籤 + APIs CSS 3
- 18. All services from your imperative. 18 HTML5 語意標籤
- 19. All services from your imperative. 19 HTML5 語意標籤
- 20. All services from your imperative. 20 HTML5 標籤 非語意標籤 <div> <span> 被 CSS 取代的標籤 <basefont> <font> <big> <center> <strike> <tt> 語意標籤 <header> <footer> <nav> <article> <aside> <section> <hgroup> <figure> <figcaption>
- 21. All services from your imperative. 21 HTML5 APIs 與相關技術
- 22. All services from your imperative. 22 HTML4 vs HTML5 新舊技術比較表 網頁性能 使用外掛的技術 對應於 W3C 的技術 (HTML5) 影音功能 Flash, Apple QuickTime, Silverlight HTML5 video, HTML5 audio 繪圖功能 Flash, Apple QuickTime, Silverlight, Java applets HTML5 canvas , Scalable Vector Graphics (SVG), WebGL, 離線儲存 Flash, Java applets, Google Gears Web storage, File API, IndexedDB, AppCache API 網路通訊, 資源共享, 檔案上傳 Flash, Java applets HTML5 Web Messaging , WebRTC, Cross-origin resource sharing (CORS)
- 23. All services from your imperative. 23 影音功能：<video> 示範 http://html5demos.com/video 全螢幕撥放 ( Fullscreen API / 支援度 ) 影音同步示範 http://html5demos.com/two-videos 控制 playbackRate 與 currentTime 屬性
- 24. All services from your imperative. 24 影音功能：<audio> 示範 http://www.apple.com/html5/showcase/audio 支援度 / audio · WebPlatform.org
- 25. All services from your imperative. 25 繪圖功能：<canvas> 示範 模擬撕裂衣服的效果 三萬片顆粒顯示在螢幕上 模擬光線的散射效果 HTML5 遊戲: Canvas Rider Z-Type video 與 canvas 互動 http://html5demos.com/video-canvas http://www.craftymind.com/factory/html5vide o/CanvasVideo.html
- 26. All services from your imperative. 26 繪圖功能：SVG 示範 vlog.it SVG Demo | Demo Studio | MDN
- 27. All services from your imperative. 27 繪圖功能：WebGL ( 3D ) 示範 visualEYEzer Interactive Globe: Small Arms Imports & Exports Lights | Ellie Goulding Cube – a game about Google Maps HelloRun ( Canvas 2D/3D + WebGL ) 與 WebCam 搭配運用 WebCamMesh Pixelate Optic Flow
- 28. All services from your imperative. 28 HTML5 綜合示範：WebRTC + reveal.js + CSS 3D 轉換 Gestures + Reveal.JS (Link) http://revealjs.herokuapp.com/
- 29. All services from your imperative. 29 More demos Dev Derby | MDN https://developer.mozilla.org/en-US/demos/devderby HTML 5 Demos and Examples http://html5demos.com
- 30. All services from your imperative. 30 HTML 5 有哪些需關注的議題 pay attention to the issues
- 31. All services from your imperative. 31 瀏覽器相容性 瀏覽器相容性 使用 Modernizr 使用 Polyfills 技術 無縫提升舊版瀏覽器對 HTML5 的支援能力 IETester http://my-debugbar.com/wiki/IETester/HomePage
- 32. All services from your imperative. 32 HTML5 開發工具支援 瀏覽器 使用瀏覽器內建的開發者工具 Chrome, IE, Firefox, Safari, … 設計工具 Adobe Edge Microsoft Expression Web Google Web Designer
- 33. All services from your imperative. 33 HTML5 測試工具 The HTML5 test http://html5test.com/ Acid3 http://acid3.acidtests.org modern.IE http://www.modern.ie/zh-tw
- 34. All services from your imperative. 34 瀏覽器相容性 / HTML5 支援度 Can I use Support tables for HTML5, CSS3, etc http://CanIuse.com Mobile HTML5 compatibility on iPhone, Android, Windows Phone, BlackBerry, Firefox OS and other mobile devices http://mobilehtml5.org Internet Explorer Testing Center http://samples.msdn.microsoft.com/ietestcenter/
- 35. All services from your imperative. 35 結語 Summary
- 36. All services from your imperative. 36 總結 HTML5 持續發展中，不會停止 HTML5 發展計畫每兩年一個週期 應當全面了解 HTML5 的能力與限制 關注你所使用的 HTML5 技術，而非整體發展
- 37. All services from your imperative. 37 聯絡資訊 The Will Will Web 記載著 Will 在網路世界的學習心得與技術分享 http://blog.miniasp.com/ Will 保哥的技術交流中心 (臉書粉絲專頁) http://www.facebook.com/will.fans ★ ★ ★ Will 保哥的噗浪 ★ ★ ★ http://www.plurk.com/willh/invite