Html 5開始大熱標志性的事件是Apple 前CEO Steve Jobs 公開炮轟Flash,并指出Flash在移動終端的不利因素,而且Html5將獲得勝利。頓時it界,數字營銷界,數字媒體界等相關領域的人開始一窩蜂的議論,追捧,打擊,HTML 5成了當仁不讓的明星(就在不久前Adobe宣布停止對Mobile端flash的開發與更新)。但是很多人,都在問:HTML5是什么?如何鑒定HTML5產品?
我們這次的《知識普及》欄目就來看看初步的探索下HTML5。
一、什么是HTML,以及HTML 5
1. HTML
HTML是超文本標記語言的英文縮寫,這是一種標記語言,不需要進行編譯,直接由瀏覽器執行。
語言就必須有一個語法的規則,如果沒有規則,誰知道應該把一個HTML元素以怎樣的形式展現給用戶呢?目前HTML語言的標準是由 W3C(World Wide Web Consortium)負責制定的。依照規則,無論是何種瀏覽器,對于相同的HTML代碼,應當展現給用戶相同的效果。
目前HTML語言最新版本為4(HTML 4),此外還有一個可擴展超文本標記語言(XHTML)作為其擴展版本,提供更為豐富的功能和更嚴謹的語法規范。
2. HTML 5
HTML 5草案的前身名為Web Applications 1.0。於2004年被WHATWG提出,於2007年被W3C接納,并成立了新的HTML工作團隊。2008年1月22日,W3C發布了最新的HTML5工作草案,HTML工作組包括AOL、Apple、Google、IBM、 Microsoft、Mozilla、Nokia、Opera等數百個開發上。HTML5中增加了許多新特性,例如嵌入音頻、視頻和圖片的函數、客戶端存 儲數據、交互式文檔等,通過制定如何處理所有HTML元素以及如何從錯誤中恢復的精確規則,HTML5進一步增強了互動性,并有效減少了開發成本。
二、HTML5 有哪些特質
我們來看看W3.org列舉出來的8個Class技術描述:
A. 語義特性(Class:Semantic)
HTML5賦予網頁更好的意義和結構。更加豐富的標簽將隨著對RDFa的,微數據與微格式等方面的支持,構建對程序、對用戶都更有價值的數據驅動的Web。
B. 本地存儲特性(Class: OFFLINE & STORAGE)
基于HTML5開發的網頁APP擁有更短的啟動時間,更快的聯網速度,這些全得益于HTML5 APP Cache,以及本地存儲功能。Indexed DB(html5本地存儲最重要的技術之一) 和API說明文檔。
C. 設備兼容特性 (Class: DEVICE ACCESS)
從Geolocation 功能的API文檔公開以來,HTML5為網頁應用開發者們提供了更多功能上的優化選擇,帶來了更多體驗功能的優勢。HTML5提供了前所未有的數據與應用接入開放接口。使外部應用可以直接與瀏覽器內部的數據直接相連,例如視頻影音可直接與microphones及攝像頭相聯
D. 連接特性(Class: CONNECTIVITY)
更有效的連接工作效率,使得基于頁面的實時聊天,更快速的網頁游戲體驗,更優化的在線交流得到了實現。HTML5擁有更有效的服務器推送技術,Server-Sent Event和WebSockets就是其中的兩個特性,這兩個特性能夠幫助我們實現服務器將數據’推送’到客戶端的功能。
E. 網頁多媒體特性(Class: MULTIMEDIA)
支持網頁端的Audio、Video等多媒體功能, 與網站自帶的APPS,攝像頭,影音功能相得益彰。
F. 三維、圖形及特效特性(Class: 3D, Graphics & Effects)
基于SVG、Canvas、WebGL及CSS3的3D功能,用戶會驚嘆于在瀏覽器中,所呈現的驚人視覺效果。
G. 性能與集成特性(Class: Performance & Integration)
沒有用戶會永遠等待你的Loading——HML5會通過XMLHttpRequest2等技術,幫助您的Web應用和網站在多樣化的環境中更快速的工作。
H. CSS3特性(Class: CSS3)
在不犧牲性能和語義結構的前提下,CSS3中提供了更多的風格和更強的效果。此外,較之以前的Web排版,Web的開放字體格式(WOFF)也提供了更高的靈活性和控制性。
Apple 官方對HTML5的各個特性做了詳細并且動態的展示:http://www.apple.com/html5/showcase
三、Html 5與Html 4的區別
A.簡化的語法
更簡單的doctype聲明是HTML5里眾多新特征之一。現在你只需要寫,這就行了。HTML5的語法兼容HTML4和XHTML1,但不兼容SGML。
B. 一個替代Flash的新”canvas”標記
對于Web用戶來說,Flash既是一個驚喜,也是一種痛苦。有很多的Web開發人員對HTML5對Flash產生的威脅很不滿。但對于那些忍受著要花幾年時間加載和運行的臃腫的Flash視頻的人來說,用新的 “canvas” 標記生成視頻的技術已經到來。
目前, “canvas” 標記并不能提供所有的Flash具有的功能,但假以時日,Flash必將從web上淘汰。我們拭目以待,因為很多人還并不認同這種觀點。
C. 新的 “header” 和 “footer” 標記
HTML5的設計是要更好的描繪網站的解剖結構。這就是為什么這些”header” 和”footer” 等新標記的出現,它們是專門為標志網站的這些部分設計的。在開發網站時,你不在需要用”div”標記來標注網頁的這些部分。
D. 新的 “section” 和 “article” 標記
跟”header” 和 “footer”標記類似,HTML5中引入的新的”section” 和 “article” 標記可以讓開發人員更好的標注頁面上的這些區域。
據推測,除了讓代碼更有組織外,它也能改善SEO效果,能讓搜索引擎更容易的分析你的頁面。