優化HTML5編碼的8個最佳實踐

 種種跡象代表，2012年絕對是HTML 5爆發之年。 就前端編碼而言，HTML以它獨有的方式席捲整個Web開發行業，它已經成爲一門最「IN」的技術，做爲一名前端開發人員，若是不學習也不懂HTML5網站編碼，那麼你就OUT啦！

2012年絕對是HTML5爆發之年，HTML5給開發人員/設計師帶來了許多方便。它不但很容易理解並且效果也是使人興奮的。

就前端編碼而言，HTML以它獨有的方式席捲整個Web開發行業，它已經成爲一門最「IN」的技術，做爲一名前端開發人員，若是不學習或者不懂HTML5網站編碼，那麼你就OUT啦！在開始學習以前，你必須搞清楚CSS3與HTML5之間的區別。今天，咱們主要來討論一下精通HTML5代碼的最佳實踐，看完這篇後，絕對會讓你收穫滿滿，不虛此行！

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

開發人員/設計師在開發一個新網站以前，每每都會從頭作起。他們會根據每一個需求，建立一個基本的模板，顯然，這樣作會花費大量的時間。使用HTML5（代碼/編碼）生成器將會幫你節省不少時間，無需爲每一個頁面編寫新的代碼。對於HTML5（代碼/編碼）生成器來講，最棒的地方就是簡單而且很容易上手。確切地說，你只須要根據需求來填寫表單、建立HTML5模板，從而無需爲每一個頁面從新編寫代碼。

顯然，你會發現有各類各樣的HTML5（代碼/編碼）生成器，你能夠根據需求選擇一個適合你的。固然，你也能夠選擇一些現成的模板直接應用。

推薦幾款Generators

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

2.正確認識文檔類型聲明

若是你對自動編碼不滿意，打算親自爲網站編寫代碼，那麼理解HTML5的doctype（文檔類型聲明）是很是重要的。請記住，修改doctype標籤是不可取的，因此在作出決定和改變以前，要保證你已經很好的理解了doctype，最終不會以慘劇收場。

3.使用Cheat Sheet

衆所周知，科技發展是突飛猛進的。因此無需恐慌，若是你不能記住不斷變化的HTML5全部特徵。你可使用HTML5的Cheat Sheets。

點擊查看大圖

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

4.向後兼容性計劃

目前，全部的Webkit（內核）瀏覽器都在支持HTML5。即便沒能支持全部的(HTML5)新特性，也能支持大部分。對於HTML5來講，另外一個積極的方面是backwards compatibility(向後兼容)，意味着HTML5的新功能對於開發者來講是沒什麼學習負擔，便可無師自通。

5.儘可能避免兼容性問題

在平常開發中，你可能會面臨一些兼容性問題，雖然HTML5是一門新技術，但有些新特性和功能可能不被支持。然而，這算不上是個問題，你能夠在Can I Use.com網站上輕易發現你所使用的瀏覽器支持哪些元素。不只如此，你還能夠在上面找到其餘重要的技術術語，例如CSS3和JavaScript兼容性圖標。因此，若是你正在使用HTML5開發，最好把Can I Use.com網站添加到書籤中。

6.負責任的使用每一個元素

話說，知己知彼，百戰百勝。在使用元素以前，必須理解每一個元素的用途以及效果，挑選適合你的元素。下面讓咱們來看一下HTML5的基本組成元素而且理解每一個元素的用途。

 

 

 

7.在老版本的IE裏面啓動HTML5

誠實講，對於開發者和設計師來講，IE一直是讓人頭疼的瀏覽器。IE8和之前版本的瀏覽器根本不支持HTML5。然而，你能夠在這些版本的IE瀏覽器裏面使用以下腳本，幫助你啓動支持HTML5：

 

8.編碼驗證

使用HTML5進行網站開發，代碼驗證是很是重要的，最好的方式是使用W3C 驗證器。這確實是個驗證代碼質量和檢查代碼錯誤優秀工具。

最後，但願上面提到的這些方法能夠幫助你更有效地使用HTML5。