暢談HTML開發

如今，打開浏覽器，各種各樣的頁面能夠讓人眼花缭亂，對于行外人看到的是美觀效果是使用者體驗，對行内人更多的是關注技術和創造力。對于開發人員都知道DIV是一對html常用标簽，DIV+CSS是一對很誘人的組合，很多界面設計師通過軟體教育訓練班等學習這門手藝，當然自然很多是沖着會用了DIV+CSS制作網頁，常常會被人贊以大拇指的。現在提到DIV+CSS，還有很多人熱情高漲。接下來幫助大家糾正下DIV+CSS的一些誤解。

1、DIV隻是HTML最常用的标簽之一

顯然HTML并不隻是一個DIV标簽有用，每個标簽都有它的用途，隻是DIV是其中最有用的一個罷了。如果說你一個DIV就能統領天下，那麼W3C 還釋出那麼多标簽做什麼呢。Table也不是一無是處，隻是用table比較簡單、容易上手才在早期被人錯誤的廣泛推廣。但是table在處理網頁資料的表現上，是其他标簽無法替代的，隻是，它不适合用來做整個頁面的布局。

2、代碼的可讀性

純DIV+CSS的網站的代碼的可讀性無疑是非常差的，甚至table還可以通過tr和td來區分行和列，一堆DIV堆砌在一起，如果沒有注釋，你根本不知道某個部分是做什麼用的。是以注釋是每個開發人員都必需要編輯的一個至關重要的環節。

3、語義化與結構化

W3C釋出N多标簽，他們肯定有他們的好處，如果說你頁面全部是div，我想不管你是多數牛叉的人，你眼睛必花。現在，在開發CSS的時候，提的越來越多的是語義化，語義化歸根到底其實還是代碼的可讀性問題。語義化就是讓代碼更易讀，更加易懂，比如，.text_01{color:red} 就沒有.text_red{color:red} 容易了解。

HTML同樣如此，比如我們看到<ol>就知道這是個有序清單；看到<p>标簽就知道這是一個段落，内容為文字；看到<span>就知道這個是比<p>還小的文字機關；看到<h1>、<h2>之類的就知道他們是标題。顯然，全部是div的頁面，是看不出來這些的。

頁面的結構化亦是如此，比如<div><div><div><div>…..</div></div></div></div>這樣的代碼，顯然是很難了解其DOM結構的，但是<div><p><h2><span>…..</span></h2></p></div>就比上面的那個結構要清晰很多。相信做開發的人對代碼的語義化和結構化的了解會更加深刻。

4、團隊合作

可讀性低、結構化和語義化差，團隊的其他成員的學習和維護難度就會提高，這對于一個團隊來說，是很浪費時間和精力的。

綜合以上所述，DIV+CSS的說法，已經把我們從table帶到了另外的一個極端，正确的網頁設計不是一個标簽雄霸天下，而是每個元素都使用合适的标簽。