英文原文：HTML5: The Facts And The Myths

　　你是免不了的。每個(gè)人都在談?wù)揌TML5。自眾人開(kāi)始濫用圓角和漸變效果以來(lái)，HTML5或許是最熱炒的技術(shù)。然而，許多人眼中所謂的HTML5實(shí)際上只是老式的DHTML和Ajax。有關(guān)HTML5的諸多信息中魚(yú)目混珠，因此,JavaScript專家雷米·夏普（Remy Sharp）和Opera公司的布魯斯·勞森（Bruce Lawson）著眼這些流言，對(duì)其中的常見(jiàn)謬誤和事實(shí)做了分類(lèi)整理。

　　首先，一些事實(shí)。

　　很久很久以前，世上有一門(mén)叫做HTML的可愛(ài)語(yǔ)言，這門(mén)語(yǔ)言簡(jiǎn)單易學(xué)，用它寫(xiě)網(wǎng)站真是輕而易舉。因而，所有人都用這門(mén)語(yǔ)言，從此，Web也從一堆物理論文的鏈接變成了今天我們所熟知和喜愛(ài)的模樣。

　　大多數(shù)頁(yè)面并不遵循這門(mén)語(yǔ)言的簡(jiǎn)單規(guī)則（因?yàn)閷?xiě)這些網(wǎng)頁(yè)的人對(duì)內(nèi)容本身要比媒介形式更為關(guān)心），因此所有瀏覽器都必須忽略錯(cuò)的代碼，盡最大努力猜測(cè)作者到底是想怎樣展示內(nèi)容。

　　1999年，W3C決定終止HTML的制定工作，轉(zhuǎn)而制定XHTML。一切都很完美，直到少數(shù)人注意到從XHTML升級(jí)到XHML2的升級(jí)工作幾乎脫離實(shí)際。XML的標(biāo)準(zhǔn)要求瀏覽器一旦碰到錯(cuò)誤，就停止工作。另外因?yàn)閃3C正在起草一種比老式、簡(jiǎn)陋的HMTL更出色的語(yǔ)言，它不贊成（deprecate）使用img和a標(biāo)簽這類(lèi)元素。

　　Opera和Mozilla開(kāi)發(fā)人員不認(rèn)同這種做法，并于2004年給W3C提交了一份報(bào)告，該報(bào)告稱：“我們認(rèn)為網(wǎng)頁(yè)應(yīng)用（Web Applications）是一個(gè)極為重要的領(lǐng)域，但當(dāng)前技術(shù)并未為這一領(lǐng)域提供充分的支持。在多方制定的規(guī)范出來(lái)之前，單一廠商的解決方案存在的潛在風(fēng)險(xiǎn)在不斷增大。”（譯注：暗指Adobe的Flash技術(shù)？）

　　這份報(bào)告提了7條設(shè)計(jì)原則

1. 向后兼容，并有一個(gè)清晰的遷移路線（migration path）
2. 明晰（Well-defined）的錯(cuò)誤處理機(jī)制，類(lèi)似CSS（比如，忽略未知內(nèi)容，繼續(xù)執(zhí)行），相比之下XML錯(cuò)誤處理機(jī)制過(guò)于“苛刻”。
3. 編程錯(cuò)誤不應(yīng)直接暴露給終端用戶。
4. 實(shí)用性：所有最終進(jìn)入網(wǎng)頁(yè)應(yīng)用技術(shù)規(guī)范的性特性都必須有實(shí)際的應(yīng)用案例支撐。但反之則不成立：即所有類(lèi)似的應(yīng)用案例并不必然會(huì)將新特性加入到技術(shù)規(guī)范中。
5. 腳本支持已經(jīng)已得到公認(rèn)（但是當(dāng)有更方便的標(biāo)簽可滿足需求時(shí)，應(yīng)避免使用腳本。）（譯者：類(lèi)似表單輸入數(shù)據(jù)驗(yàn)證。）
6. 避免針對(duì)特定設(shè)備的規(guī)范。
7. 制定過(guò)程必須開(kāi)放。（網(wǎng)絡(luò)本身從開(kāi)放式發(fā)展中受益頗多。郵件列表，存檔，規(guī)范草稿應(yīng)一直對(duì)公眾開(kāi)放。）

　　該報(bào)告遭W3C的拒絕，因此Opera和Mozilla以及后來(lái)的蘋(píng)果繼續(xù)維護(hù)著一個(gè)叫做網(wǎng)絡(luò)超文本應(yīng)用程序技術(shù)工作組（Web Hypertext Application Technology Working Group，簡(jiǎn)稱WHATWG）的郵件列表（Mail list），繼續(xù)制定他們用以驗(yàn)證概念（ proof-of-concept）的規(guī)范內(nèi)容。這份規(guī)范對(duì)HTML4表單規(guī)范進(jìn)行了擴(kuò)充，在伊恩·希克森（Ian Hickson）的不斷校訂中，這份規(guī)范最終成為一份名叫網(wǎng)頁(yè)應(yīng)用程序1.0（Web Applications 1.0）的規(guī)范。后來(lái)伊恩·希克森離開(kāi)Opera，加入Google。

　　在2006年，W3C終于意識(shí)到自己的錯(cuò)誤，決定重新啟用HTML，向WHATWG索要它的規(guī)范，并將其作為HTML5規(guī)范的基礎(chǔ)。

　　上面這些是史事資料。現(xiàn)在我們來(lái)看看一些流傳甚廣的流言。

　　流言

　　“在2012（或2022）年之前，俺是用不上HTML5的了。”

　　這一流言是從HTML5進(jìn)入到W3C流程的候選推薦階段（Candidate Recommendation，簡(jiǎn)稱REC）的項(xiàng)目日期所誤傳開(kāi)來(lái)的。官方Wiki上寫(xiě)道：

如今一個(gè)規(guī)范要成為候選推薦標(biāo)準(zhǔn)（REC），它需要具備百分之百的可實(shí)施性（interoperable implementations），只有成功通過(guò)上萬(wàn)項(xiàng)的測(cè)試案例（Test Case）后才能驗(yàn)證這點(diǎn)（據(jù)保守估計(jì)，整個(gè)規(guī)范可能需要進(jìn)行2萬(wàn)項(xiàng)測(cè)試）。當(dāng)你在心里默算寫(xiě)這些測(cè)試案例需要多少時(shí)間，實(shí)施每個(gè)新特性又需要多少時(shí)間時(shí)，你就會(huì)明白HTML5規(guī)范制定的時(shí)間跨度為什么這么長(zhǎng)了。

　　因此，按此說(shuō)法，在你能在兩大瀏覽器中用上所有的功能之前，HTML5的規(guī)范是沒(méi)有最終定稿的。

　　當(dāng)然，真正重要的一小部分HTML5的特性已得到瀏覽器的支持，任何瀏覽器的支持情況匯總表單都會(huì)在一周之內(nèi)過(guò)時(shí)，因?yàn)闉g覽器制作廠商的創(chuàng)新速度非常之快。另外，許多HTML5的新特性也通過(guò)JavaScript腳本在不支持HTML5的老瀏覽器中得以重現(xiàn)。Canvas屬性在所有新瀏覽器中得到支持，其中包括IE9，另外在老的IE瀏覽器中，通過(guò)excanvas庫(kù)，我們也可以模擬Canvas的特性。而音頻和視頻標(biāo)簽效果，我們則可以通過(guò)Flash在舊的瀏覽器中實(shí)現(xiàn)。

　　HTML5在設(shè)計(jì)上就可以優(yōu)雅降級(jí)，因此運(yùn)用一些JavaScript代碼和創(chuàng)意，HTML5的所有功能都可以在老瀏覽器上實(shí)現(xiàn)。

　　“俺的瀏覽器支持HTML5，你的不支持。”

　　這一流言認(rèn)定HTML5是一個(gè)整體不可分割的標(biāo)準(zhǔn)。但實(shí)際上不是。正如前文所說(shuō)，HTML5是一組新特性的組合。因此，短期來(lái)講，你不能說(shuō)一個(gè)瀏覽器支持了HTML5的所有內(nèi)容。而當(dāng)瀏覽器能做到這點(diǎn)時(shí)，瀏覽器本身已經(jīng)無(wú)關(guān)緊要了，因?yàn)槟菚r(shí)我們將被新一代的HTML語(yǔ)言所震撼。

　　感覺(jué)HTML5亂的一塌糊涂，是吧？看看CSS2.1，這么多年了它都是一個(gè)尚未最終完成的標(biāo)準(zhǔn)，但是我們每個(gè)人無(wú)時(shí)不在用它。我們用CSS3輕松添加圓角，這點(diǎn)很快就會(huì)得到所有瀏覽器的支持，雖然CSS3的其他特性尚未得到所有瀏覽器的支持。

　　要提防那些瀏覽器“評(píng)分”網(wǎng)站。這些網(wǎng)站測(cè)試的內(nèi)容經(jīng)常與HTML5無(wú)關(guān)，比如CSS，SVG，甚至是網(wǎng)頁(yè)字體（web fonts）。你手頭需要完成的工作才是要緊的，你客戶受眾瀏覽器所支持的技術(shù)才是用得上的技術(shù)。

　　HTML5實(shí)際上正式認(rèn)可了一些常見(jiàn)的書(shū)寫(xiě)錯(cuò)誤（Tag Soup）

　　HTML5在語(yǔ)法方面要比XHTML松散很多：比如，你可以用純大寫(xiě)或小寫(xiě)字母書(shū)寫(xiě)標(biāo)簽，甚至大小寫(xiě)混用也無(wú)妨。你無(wú)需對(duì)img這類(lèi)的標(biāo)簽做自封閉處理（self-close），因此下面這兩種寫(xiě)法都是合法的：

　　<img src=”nice.jpg”/>

　　<img src=”nice.jpg”>

　　標(biāo)簽屬性也無(wú)需用雙引號(hào)括起來(lái)，因此下面這兩種寫(xiě)法都是合法的：

　　<img src=”nice.jpg”>

　　<img src=nice.jpg>

　　使用大寫(xiě)或小寫(xiě)（甚至混用）字母都可以，所以下面三種寫(xiě)法也都是合法的:

　　<IMG SRC=nice.jpg>

　　<img src=nice.jpg>

　　<iMg SrC=nice.jpg>

　　這與HTML4毫無(wú)差異，但是如果你用習(xí)慣了XHTML，你碰到這種寫(xiě)法時(shí)還是會(huì)很震驚的。現(xiàn)實(shí)中，如果你使用HTML和文本內(nèi)容書(shū)寫(xiě)頁(yè)面，而非使用XML（你極有可能是混用文本和HTML書(shū)寫(xiě)頁(yè)面的，因?yàn)镮E8并不能真正的渲染XHTML頁(yè)面），那么上述細(xì)微差別也無(wú)關(guān)緊要：瀏覽器會(huì)忽略尾部的斜杠，雙引號(hào)，以及大小寫(xiě)。

　　HTML5語(yǔ)法看似松散，但實(shí)際的解析規(guī)則要嚴(yán)格的多。因而HTML5中，常見(jiàn)的書(shū)寫(xiě)錯(cuò)誤（Tag Soul）將不復(fù)存在;HTML5的規(guī)范對(duì)這些無(wú)效標(biāo)記做精確的描述和定義，因此所有遵循規(guī)范的瀏覽器都會(huì)生成同樣的文檔對(duì)象模型（DOM）。如果你曾寫(xiě)過(guò)JavaScript來(lái)遍歷DOM，那么你就會(huì)對(duì)DOM不一致所帶的恐怖經(jīng)歷有所體會(huì)。

　　但這種修正不應(yīng)導(dǎo)致無(wú)效代碼泛濫。HTML5為你創(chuàng)建的DOM可能并不是你想要的那個(gè)，因此對(duì)書(shū)寫(xiě)的HTML5代碼進(jìn)行驗(yàn)證仍然至關(guān)重要。隨著新特性的大量涌入，對(duì)細(xì)小語(yǔ)法錯(cuò)誤的忽視會(huì)讓你的腳本失效，或是CSS樣式出錯(cuò)，這也是我們?yōu)槭裁葱枰?a >HTML5驗(yàn)證器的原因之所在。

　　HTML5遠(yuǎn)不僅僅只是讓一些常見(jiàn)的書(shū)寫(xiě)錯(cuò)誤合法化，而且讓這些常見(jiàn)錯(cuò)誤（Tag soup）成為歷史。贊！

　　“我需要把我的網(wǎng)站從XHTML轉(zhuǎn)換HTML5。”

　　HTML5對(duì)松散語(yǔ)法的包容性是敲響了XHTML的喪鐘嗎？制定XHTML2規(guī)范的工作組已經(jīng)解散，對(duì)吧。

　　沒(méi)錯(cuò)，XHTML2的工作組在2009年年末的時(shí)候解散了。他們起草的這個(gè)規(guī)范是用來(lái)與HTML5競(jìng)爭(zhēng)的，但尚未得到執(zhí)行實(shí)施，然而，同時(shí)保留兩隊(duì)人馬是對(duì)W3C組織資源的一種浪費(fèi)。另外XHTML1已經(jīng)是一個(gè)業(yè)已完成的規(guī)范，得到所有瀏覽器的廣泛支持，并在必須的時(shí)限內(nèi)仍將得到所有瀏覽器的支持。因此你用XHTML書(shū)寫(xiě)的網(wǎng)站也將免受折騰之苦。

　　HTML5將會(huì)干掉XML

　　根本不會(huì)，如果你需要使用XML，而不是HTML，你可以選用XHTML5，它幾乎包含所有HTML5的優(yōu)點(diǎn)，只是要必須遵循嚴(yán)格XHTML語(yǔ)法（比如，要標(biāo)簽屬性中的雙引號(hào)不能省，自封閉元素的末尾斜杠不可省，必須用小寫(xiě)字母書(shū)寫(xiě)標(biāo)簽等等諸如此類(lèi)。）

　　現(xiàn)實(shí)情況是XHTML5并不完全包含所有HTML5的特性。譬如<noscript> 就失效了。但你想想，這古董玩意兒還有人在用嗎？

　　HTML5會(huì)干掉Flash和插件

　　<canvas> 標(biāo)簽可以讓腳本根據(jù)鍵盤(pán)輸入操縱圖像實(shí)現(xiàn)動(dòng)畫(huà)效果，因此在一些簡(jiǎn)單的應(yīng)用場(chǎng)景下可以與Adoble Flash競(jìng)爭(zhēng)。HTML5還有對(duì)Video和Audio播放的原生支持。

　　正因?yàn)镃SS Web字體尚未得到廣泛支持，以Flash為基礎(chǔ)的sIFR技術(shù)將會(huì)填補(bǔ)這一空白，F(xiàn)lash也因逆向兼容HTML5視頻內(nèi)容而挽救局面。因?yàn)镠TML5設(shè)計(jì)時(shí)“照顧”了老瀏覽器，Video標(biāo)簽之間的其他標(biāo)記將會(huì)被支持HTML5的瀏覽器所忽視，因此可以用老式的<object>或<embed> 標(biāo)簽，用Flash嵌入所有瀏覽器支持的視頻內(nèi)容，克羅克·卡門(mén)（ Kroc Camen）在他的《全兼容的視頻》一文中就倡導(dǎo)這種做法。（見(jiàn)下面截圖。）

　　但也并是不所的應(yīng)用場(chǎng)合都是可以用HTML5取代Flash的。比如HTML5中就沒(méi)辦法進(jìn)行數(shù)字版權(quán)的管理。Opera，F(xiàn)irefox和Chrome這類(lèi)瀏覽器允許簡(jiǎn)單的右鍵點(diǎn)幾下就將視頻保存的本地電腦上。如果你不想用戶保存視頻文件，你就需要使用插件。另外捕捉麥克風(fēng)或是攝像頭的信號(hào)就只能通過(guò)Flash實(shí)現(xiàn)。（不過(guò)<device> 元素已經(jīng)出現(xiàn)到HTML5以后的規(guī)范中），因此如果你想寫(xiě)一個(gè)可以終結(jié)聊天輪盤(pán)（Chatroulette）網(wǎng)站的東西來(lái)，那么HTML5并不適合你。

　　HTML5在可訪問(wèn)性（Accessibility）方面做得比較差

　　關(guān)于HTML5的討論中有不少是嘮叨HTML5可訪問(wèn)性的。這點(diǎn)很好，應(yīng)該歡迎：因?yàn)?a href=/pingce/wangluo/ target=_blank class=infotextkey>網(wǎng)絡(luò)的基礎(chǔ)語(yǔ)言已經(jīng)做了太多了的改變，因此確保網(wǎng)頁(yè)對(duì)于那些殘障人士的易訪問(wèn)性極其重要。另外，更為重要的是在技術(shù)方案的制定過(guò)程中就將其考量進(jìn)入，而非事后修補(bǔ)。畢竟大多數(shù)開(kāi)發(fā)人員甚至沒(méi)有為圖片標(biāo)簽添加Alt屬性，所以提供現(xiàn)成可用的易訪問(wèn)性（accessibility）相比人們手動(dòng)添加更容易成功。

　　這也是為什么HTML5添加了類(lèi)似滑塊（<input type=range>，目前僅Opera和Webkit內(nèi)核的瀏覽器支持）原生控件和日期選定控件（<input type=date>，僅Opera支持）——因?yàn)橹埃覀冎荒苡?a href=/itjie/Javajishu/ target=_blank class=infotextkey>JavaScript和圖片來(lái)模擬，并添加鍵盤(pán)支持和WAI-ARIA的Role屬性。

　　而Canvas標(biāo)簽則又是另一番情況，該標(biāo)簽原本是蘋(píng)果獨(dú)創(chuàng)的，后遭其他瀏覽器廠商的逆向工程破解，繼而被吸納為HTML5規(guī)范的一部分，因此Canvas技術(shù)本身在可訪問(wèn)性方面并未做考量。如果你只是用它制作一些視覺(jué)美化，那問(wèn)題不大，你大可把它看成圖片，只是不能添加ALt屬性來(lái)指定替換的文本內(nèi)容（已有人建議在規(guī)范中作此增添，但目前尚未得到實(shí)施）。因此，確保Canvas之中的信息在頁(yè)面的其他地方有替代信息，從而增強(qiáng)頁(yè)面的可訪問(wèn)性。

　　Canvas中的文本變成了像素，如圖片中的文本。因此，輔助技術(shù)和屏幕閱讀器來(lái)可以讀出其中的信息。可考慮用W3C的可縮放適量圖像標(biāo)準(zhǔn)（SVG）替代，尤其對(duì)于動(dòng)態(tài)圖像和文本內(nèi)容來(lái)說(shuō)。SVG目前得到了主流瀏覽器的支持，其中包括IE9（IE8及以下的瀏覽器不支持，不過(guò)SVGWeb庫(kù)通過(guò)Flash技術(shù)可以在老式瀏覽器中模仿SVG。）

　　<video> 和<audio>標(biāo)簽也很有前途。盡管這兩個(gè)標(biāo)簽的規(guī)范尚未完全確定（而且許多瀏覽器還不支持）。HTML5已經(jīng)添加了一個(gè)新的<track> 的標(biāo)簽，可以包含帶時(shí)間軸的文本（歌詞和外文媒體的字幕），你可以在視頻下面用JavaScript來(lái)添加時(shí)間軸字幕，并與視頻內(nèi)容同步。

　　“當(dāng)我第一次用HTML5的時(shí)候，HTML5的大師會(huì)助我一臂之力”

　　如果是真的那該多好。不過(guò)保羅·艾瑞士（Paul Irish）和迪維亞·梅麗亞（ Divya Manian）打造的HTML5模板文件對(duì)你來(lái)說(shuō)就足以很好。模板文件包含一系列的文件，你可以作為模板用在你的項(xiàng)目中。模板文件包含了你所必須的JavaScript，方便在IE中添加新元素；它從Google的CDN上引用jQuery，另外如果Google服務(wù)器出問(wèn)題了，還可降級(jí)引用你自己服務(wù)器上的JS庫(kù)。

　　它也添加了適用ios，Android和Opera手機(jī)版的標(biāo)簽，并用一個(gè)易于理解的CSS reset文件搭建了一個(gè)基本的CSS骨架。它甚至還一個(gè).htaccess文件，以便為HTML5視頻提供正確的MIME類(lèi)型。如果你不需要全部的內(nèi)容，你可刪除對(duì)你項(xiàng)目無(wú)用的內(nèi)容，精簡(jiǎn)文件。

　　深入閱讀材料

　　HTML5的話題很寬泛。下面是是我們手工挑選的幾個(gè)鏈接。披露提醒（Disclosure）：本文的作者參與了下面的一些項(xiàng)目。

• W3C規(guī)范：HTML5

  寫(xiě)網(wǎng)站的同學(xué)都應(yīng)該看看的資料。

• HTML5的演示例子

  HTML5 API在瀏覽器中的實(shí)際效果示范例子

• HTML5 Doctor

  這個(gè)博客上都是些短小精悍的文章，“幫你馬上運(yùn)用HTML5技術(shù)”

• html5-shims

  上面會(huì)分享一些腳本，教你如何在瀏覽器中模仿再現(xiàn)HTML5的功能特性。

　　英文原文：HTML5: The Facts And The Myths

it知識(shí)庫(kù)：有關(guān)HTML5的流言與真相，轉(zhuǎn)載需保留來(lái)源！

鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。