摘要：種種跡象表明，2012年絕對(duì)是HTML 5爆發(fā)之年。 就前端編碼而言，HTML以它獨(dú)有的方式席卷整個(gè)Web開(kāi)發(fā)行業(yè)，它已經(jīng)成為一門(mén)更“IN”的技術(shù)，作為一名前端開(kāi)發(fā)人員，如果不學(xué)習(xí)也不懂HTML5網(wǎng)站編碼，那么你就OUT啦！

2012年絕對(duì)是HTML5爆發(fā)之年，HTML5給開(kāi)發(fā)人員/設(shè)計(jì)師帶來(lái)了許多方便。它不但很容易理解而且效果也是令人興奮的。
 
就前端編碼而言，HTML以它獨(dú)有的方式席卷整個(gè)Web開(kāi)發(fā)行業(yè)，它已經(jīng)成為一門(mén)更“IN”的技術(shù)，作為一名前端開(kāi)發(fā)人員，如果不學(xué)習(xí)或者不懂HTML5網(wǎng)站編碼，那么你就OUT啦！在開(kāi)始學(xué)習(xí)之前，你必須搞清楚CSS3與HTML5之間的區(qū)別。今天，我們主要來(lái)討論一下精通HTML5代碼的更佳實(shí)踐，看完這篇后，絕對(duì)會(huì)讓你收獲滿滿，不枉此行！


1.HTML5（代碼/編碼）生成器

開(kāi)發(fā)人員/設(shè)計(jì)師在開(kāi)發(fā)一個(gè)新網(wǎng)站之前，往往都會(huì)從頭做起。他們會(huì)根據(jù)每個(gè)需求，創(chuàng)建一個(gè)基本的模板，顯然，這樣做會(huì)花費(fèi)大量的時(shí)間。使用HTML5（代碼/編碼）生成器將會(huì)幫你節(jié)省很多時(shí)間，無(wú)需為每個(gè)頁(yè)面編寫(xiě)新的代碼。對(duì)于HTML5（代碼/編碼）生成器來(lái)說(shuō)，更棒的地方就是簡(jiǎn)單并且很容易上手。確切地說(shuō)，你只需要根據(jù)需求來(lái)填寫(xiě)表單、創(chuàng)建HTML5模板，從而無(wú)需為每個(gè)頁(yè)面重新編寫(xiě)代碼。

顯然，你會(huì)發(fā)現(xiàn)有各種各樣的HTML5（代碼/編碼）生成器，你可以根據(jù)需求選擇一個(gè)適合你的。當(dāng)然，你也可以選擇一些現(xiàn)成的模板直接應(yīng)用。

推薦幾款Generators

• Shikiryu HTML5 Generator
• Switch to HTML5 Generator
• Quackit HTML5 Generator

推薦幾篇好文

• 10 Essential HTML5 Frameworks
• 25 Useful HTML5/CSS3 Tools, Cheat Sheets and Resources

2.正確認(rèn)識(shí)文檔類型聲明

如果你對(duì)自動(dòng)編碼不滿意，打算親自為網(wǎng)站編寫(xiě)代碼，那么理解HTML5的doctype（文檔類型聲明）是非常重要的。請(qǐng)記住，修改doctype標(biāo)簽是不可取的，所以在做出決定和改變之前，要保證你已經(jīng)很好的理解了doctype，更終不會(huì)以慘劇收?qǐng)觥?/P>

3.使用Cheat Sheet

眾所周知，科技發(fā)展是日新月異的。所以無(wú)需恐慌，如果你不能記住不斷變化的HTML5所有特征。你可以使用HTML5的Cheat Sheets。

點(diǎn)擊查看大圖

文章推薦：This Ultimate HTML5 Cheatsheat [Infographic]

4.向后兼容性計(jì)劃

目前，所有的Webkit（內(nèi)核）瀏覽器都在支持HTML5。即使沒(méi)能支持所有的(HTML5)新特性，也能支持大部分。對(duì)于HTML5來(lái)說(shuō)，另一個(gè)積極的方面是backwards compatibility(向后兼容)，意味著HTML5的新功能對(duì)于開(kāi)發(fā)者來(lái)說(shuō)是沒(méi)什么學(xué)習(xí)負(fù)擔(dān)，即可無(wú)師自通。

5.盡量避免兼容性問(wèn)題

在日常開(kāi)發(fā)中，你可能會(huì)面臨一些兼容性問(wèn)題，雖然HTML5是一門(mén)新技術(shù)，但有些新特性和功能可能不被支持。然而，這算不上是個(gè)問(wèn)題，你可以在Can I Use.com網(wǎng)站上輕易發(fā)現(xiàn)你所使用的瀏覽器支持哪些元素。不僅如此，你還可以在上面找到其他重要的技術(shù)術(shù)語(yǔ)，例如CSS3和JavaScript兼容性圖標(biāo)。所以，如果你正在使用HTML5開(kāi)發(fā)，更好把Can I Use.com網(wǎng)站添加到書(shū)簽中。

6.負(fù)責(zé)任的使用每個(gè)元素

話說(shuō)，知己知彼，百戰(zhàn)百勝。在使用元素之前，必須理解每個(gè)元素的用途以及效果，挑選適合你的元素。下面讓我們來(lái)看一下HTML5的基本組成元素并且理解每個(gè)元素的用途。

用于任何網(wǎng)站的頭部。

對(duì)網(wǎng)頁(yè)或區(qū)段（section）的標(biāo)題進(jìn)行組合。

7.在老版本的IE里面啟動(dòng)HTML5

誠(chéng)實(shí)講，對(duì)于開(kāi)發(fā)者和設(shè)計(jì)師來(lái)說(shuō)，IE一直是讓人頭疼的瀏覽器。IE8和以前版本的瀏覽器根本不支持HTML5。然而，你可以在這些版本的IE瀏覽器里面使用如下腳本，幫助你啟動(dòng)支持HTML5：