武林網(wǎng)(www.survivalescaperooms.com)文章簡介：減少代碼和語義化標(biāo)簽.

如果你在生成頁面的時候過多的使用div，那你有必要閱讀這篇文章了。本文主要關(guān)注如何通過語義化的標(biāo)簽、減少div使用等方法來簡化代碼。你是否在修改某人的頁面時，被他的亂七八糟的代碼搞暈乎？簡潔的代碼不但方便自己，同時方便你的團隊成員。他在你調(diào)試頁面或編輯的時候節(jié)省你的時間（尤其對于大的項目來說）。
一、去掉不必要的div標(biāo)簽
我看到好多人都在form或ul列表的外面嵌入一個div結(jié)構(gòu)，為什么要嵌入這個你不需要的div那？你可以通過給相應(yīng)的語義化的標(biāo)簽定義、引用新的css就可以達到同樣的效果。
實例1：
一下案例展示的是如何去掉div標(biāo)簽并定義一個新的樣式給form標(biāo)簽。

二、使用語義化的標(biāo)簽
在頁面制作過程中，應(yīng)盡量使用語義化的標(biāo)簽（如：h1定義標(biāo)題，P定義段落文字，ul定義列表項目），即使不定義css樣式，你的文檔也是有意義的。

實例：
一下圖片對比了div定義的結(jié)構(gòu)和語義化標(biāo)簽定義的結(jié)構(gòu)在沒有定義css展示的效果。

三、減少使用div的使用
實例1
鏈接導(dǎo)航效果，用p標(biāo)簽結(jié)構(gòu)代替div標(biāo)簽結(jié)構(gòu)更有意義。

實例2
一下實例我用一個span標(biāo)簽代替了原來的兩個div標(biāo)簽結(jié)構(gòu)，但他們實現(xiàn)的布局結(jié)構(gòu)是一樣的。

四、格式化你的結(jié)構(gòu)代碼
你要保持格式化你的代碼結(jié)構(gòu)，這樣容易閱讀和調(diào)試。如果你使用的是Adobe Dreamweaver,你點擊Commands > Apply Source Formatting就很容易實現(xiàn)代碼的格式化。

五、注釋閉合div標(biāo)簽
開發(fā)模版程序的時候（比如WordPress themes），模版程序分成幾個不同的文檔index.php, header.php, sidebar.php, and footer.php等。同時，你也應(yīng)該經(jīng)常的注釋你的div標(biāo)簽結(jié)構(gòu),不至于自己暈乎。當(dāng)我看到</div><!– /wrapper –>時，我就能清楚的辨認(rèn)出是<div id=”wrapper”>的注釋。

總結(jié)：
1、減少使用div標(biāo)簽；
2、應(yīng)該用div定義頁面的主要框架結(jié)構(gòu)，比如頭部、內(nèi)容、邊欄和底部等結(jié)構(gòu)；
3、內(nèi)容應(yīng)該使用語義化的html標(biāo)簽，而不是div標(biāo)簽；
4、格式化代碼同時要閉合div標(biāo)簽結(jié)構(gòu)。

中文原文：減少代碼和語義化標(biāo)簽
英文原文：Coding Clean and Semantic Templates