正確閉合HTML標簽
HTML元素的內容模型定義了元素的結構，表明元素可以包含哪些內容以及元素可以有哪些屬性。元素可以包含的內容包括其他元素和字符，但是也有一些元素是空元素，即不能包含任何內容，這些元素對應的HTML標簽也稱之為自閉合標簽，下面列出了HTML中所有的自閉合標簽：
area、base, br, col, command, embed, hr, img, input, keygen, link, meta, param, source, track, wbr
W3C制定了多個版本的HTML規范，目前流行的HTML規范有XHTML1.0、HTML4.01和HTML5。規范中規定了所有HTML標簽的語法，其中規定非自閉和標簽必須有開始標簽和結束標簽，而自閉合標簽沒有閉合標簽。示例代碼如下：
<!-- 非自閉合標簽必須有開始和結束標簽 -->
<a href="demo.html" title="demo">simple</a>
<!-- 自閉合標簽必須沒有結束標簽 -->
<img src="demo.png" alt="demo" />
有關自閉合標簽中是否應該添加符號“/”，在XHTML1.0、HTML4.01和HTML5的規范中稍有不同。XHTML的規范最嚴格，必須在自閉合標簽中添加“/”來表明標簽的結束。在HTML4.01的規范中，不推薦在自閉合標簽中添加“/”。而HTML5最寬松，自閉合標簽添加“/”和不添加“/”都符合規范，在自閉合標簽中添加符號“/”是可選的。示例代碼如下：
<!-- 如下寫法符合XHTML1.0、HTML4.01和HTML5的規范，但在HTML4中不推薦 -->
<img src="demo.png" alt="demo" />
<!-- 如下寫法不符合XHTML1.0規范，但符合HTML4.01和HTML5的規范 -->
<img src="demo.png" alt="demo">
如下的這幾種寫法不符合規范，應該嚴格禁止：
<!-- 錯誤：非自閉合標簽沒有結束標簽 -->
<a href="demo.html" title="demo">simple
<!-- 錯誤：非自閉合標簽使用自閉合標簽的語法 -->
<a href="demo.html" title="demo" />
<!-- 錯誤：自閉合標簽使用非自閉合標簽的語法 -->
<img src="demo.png" alt="demo"></img>
當元素的起始標簽和結束標簽不在同一個元素的內容中時，則會出現交叉嵌套。應該嚴格禁止標簽之間的交叉嵌套。
下面的例子中起始標簽“<span>”在元素div的內容中，而結束標簽“</span>”則在div元素的內容之外：
<!-- 錯誤： 起始標簽“<span>”在元素div的內容中，結束標簽“</span>”則在div元素的內容之外 -->
<div>foo <span>bar</div> baz</span>
一般通過編寫層次縮進良好的HTML代碼能夠最大化避免出現這樣交叉嵌套的錯誤代碼。
停止使用不標准的標簽和屬性
W3C在制定的HTML4和HTML5標准中有添加獨立的章節來說明那些是不被推薦的標簽和屬性，這些標簽和屬性是Web互聯網發展早期HTML標准混亂和瀏覽器各自為政的產物，有些標簽甚至使用率頗高，比如marquee滾動效果標簽，盡管在現在看來其效果丑陋無比，但在當時幾乎所有的網站都會使用這樣的效果，風靡一時。但是隨着Web互聯網的飛速發展，人們對Web的認識也逐漸提高，也開始關注如何讓網頁HTML代碼更統一、更簡潔、更易理解等等，不在局限於單純的外觀。在此過程中，一些標簽和屬性逐漸被更好的方案代替，這些標簽也不被標准所推薦，甚至是從標准規范中移除，有些特性在瀏覽器中也不被繼續支持。從這些標簽和屬性的作用來看，導致不被推薦的原因主要有如下幾個：
1. 標簽沒有實際的語義，僅僅是用於設置樣式
不推薦使用單純設置樣式的標簽，如：basefont、big、center、font等。應該通過CSS設置樣式，讓HTML標簽功能更單一。不推薦的示例如下：
<!--不推薦代碼：不推薦使用單純設置樣式的標簽，應該通過CSS設置樣式-->
<font color=blue>don't use it!</font>
<big>don't use it!</big>
<center>don't use it!</center>
不推薦在HTML標簽中添加樣式屬性，如：iframe、img、input、div等標簽中的align屬性，body標簽上的background屬性，td和tr標簽上的height、width、nowrap、bgcolor、valign等屬性，iframe標簽中的frameborder、marginheight、scrolling等屬性。此類屬性應該廢棄，並通過添加CSS樣式來實現相同的效果。不推薦的示例如下：
<!—不推薦代碼：標簽中添加border、width、height等樣式屬性-->
<img src=”#” alt=”demo” border=”1” width="194" height="37" />
<div id="focusViwer" align=center> </div>
不推薦使用 <blink> 或<marquee> (閃動,滾動)。這兩個標簽的職能已經超出了HTML本身，並且也存在瀏覽器的兼容問題。以如今的審美來說，這兩個標簽實現的效果丑陋無比，如果一定要這樣的效果，可以通過JavaScript代碼來實現，並且效果會更好，如：可以使用jQuery Marquee插件 。不推薦的示例如下：
<!--不推薦代碼：效果丑陋，並且存在瀏覽器兼容問題，不推薦使用，如果需要實現這樣的效果，可以通過JavaScript代碼來實現，並且效果會更好-->
<blink>don't use it!</blink>
<marquee scrollamount=3 scrolldelay=100 >don't use it</marquee>
2. 讓HTML標簽具有更好的語義
不推薦使用<b>和<i>顯示黑體字和斜體，推薦使用更具有語義的如 <strong> 和 <em>，如果單純是為了樣式，推薦用CSS樣式定義font-weight 和 font-style，讓頁面更簡潔。類似的不推薦標簽還有<S>和<strike>，這兩個標簽是給文字添加刪除線的，可以用 <del>和<ins>來代替。
不推薦示例：
<!--不推薦代碼：誤語義的標簽，單純設置樣式-->
<b>don't use it!</b>
<i>don't use it!</i>
<s> don't use it!</s>
<strike> don't use it!</strike>
推薦示例：
<!--推薦代碼：使用具有語義的標簽，如果單純為了樣式，則應該通過CSS來設置-->
<strong>important</strong>
<em>emphasize</em>
<del>deleted</del>
<ins>insert</ins>
3. 移除不常用的HTML標簽
此類標簽包括acronym、applet、dir等，廢棄的原因是使用率極低或者是語義有歧義，並且有其他更好代替方案可以使用。如：表達縮寫的標簽<acronym>，其語義模糊，開發者更常用<abbr>來代替；開發者更喜歡使用<ul>而不是<dir>。