What Beautiful HTML Code Looks Like 如何寫出漂亮的HTML代碼.

老外寫的一篇文章:What Beautiful HTML Code Looks Like 如何寫出漂亮的HTML代碼 感覺寫的非常的不錯(cuò)，轉(zhuǎn)載過來，與大家分享一下:

ps:原文地址：http://css-tricks.com/what-beautiful-html-code-looks-like/

1.DOCTYPE Properly Declared

別忘記頭部的聲明，它會(huì)告訴瀏覽器如何渲染你的HTML。

2.Tidy Head Section

設(shè)置title,字符集.將CSS和JS外鏈(包括一個(gè)打印用的CSS)。

3.Body IDed

給body一個(gè)ID。這里作者提到的原因是，為多頁面的中容器選擇提供便利。比如通過給page1和page2中BODY設(shè)置不同的ID，就可以通過#page1 h2和#page2 h2來設(shè)置兩種不同的效果，我感覺這個(gè)到是要看情況和具體架構(gòu)再具體使用。

4.Semantically Clean Menu

編寫符合語意的菜單代碼。

<div id="menu">

<ul>

<li><a href="index.php">Home</a></li>

<li><a href="about.php">About</a></li>

<li><a href="contact.php">Contact</a></li>

</ul>

</div>

ps:我個(gè)人覺得這樣寫代碼應(yīng)該更簡(jiǎn)單一點(diǎn)吧:

<ulid="menu">

<li><a href="index.php">Home</a></li>

<li><a href="about.php">About</a></li>

<li><a href="contact.php">Contact</a></li>

</ul>

5.Main DIV for all Page Content

要有一個(gè)主體DIV包含所有的內(nèi)容。方便固定主體的寬度,邊距等等。

6.Important Content First

先寫主要內(nèi)容,再寫次要內(nèi)容.如果你的導(dǎo)航或者側(cè)邊欄不是很重要,最好將他們寫在最后。

7.Common Content INCLUDED

將導(dǎo)航,頁尾等公用的部分用動(dòng)態(tài)調(diào)用的方式引入,比如PHP的include。

8.Code is Tabbed into Sections

縮進(jìn)代碼

9.Proper Ending Tags

注意結(jié)束標(biāo)簽

10.Hierarchy of Header Tags

在合適的地方使用標(biāo)題標(biāo)簽,如<h1>~<h6>,來劃分段落。

11.Content, Content, Content

使用合適的標(biāo)簽,和標(biāo)志代碼,用&copy; 表示©,不要使用</br>

12.No Styling!

不要把樣式寫在標(biāo)簽上，HTML只是用來表示結(jié)構(gòu)。表現(xiàn)還是交給CSS吧。