最近有客戶(hù)問(wèn)到“table建站、DIV建站以及XHTML建站的區(qū)別”，其實(shí)這也是國(guó)內(nèi)網(wǎng)站建設(shè)逐步走向成熟的標(biāo)志。網(wǎng)站建設(shè)，簡(jiǎn)單的來(lái)說(shuō)，就是“這個(gè)人長(zhǎng)的怎么樣”和“這個(gè)人內(nèi)心怎么樣”。一部分是外觀(guān)所展示出來(lái)的“視覺(jué)效果”、另一部分是藏在里面的“代碼元素”。

我們先來(lái)舉一個(gè)簡(jiǎn)單的例子，用這3種不同的代碼風(fēng)格，實(shí)現(xiàn)同一個(gè)頁(yè)面效果：

1.首先是用table來(lái)寫(xiě)，需要8行代碼：

<table>

<tr>

<th>網(wǎng)站標(biāo)題</th>

</tr>

<tr>

<td>網(wǎng)站內(nèi)容</td>

</tr>

</table>

2.然后進(jìn)步到用DIV，2行就可以了，但是因?yàn)榇嬖趦蓚�(gè)DIV，為了區(qū)別，需要給不同的ID：

<div id=“title“>網(wǎng)站標(biāo)題</div>

<div id=“content“>網(wǎng)站內(nèi)容</div>

3.用XHTML來(lái)寫(xiě)：

<h1>網(wǎng)站標(biāo)題</h1>

<div>網(wǎng)站內(nèi)容</div>

優(yōu)缺點(diǎn)：

用更為簡(jiǎn)潔的XHTML代碼風(fēng)格，不僅僅是為了提升頁(yè)面開(kāi)啟速度。畢竟現(xiàn)在網(wǎng)絡(luò)帶寬越來(lái)越大，打開(kāi)10K的網(wǎng)頁(yè)代碼和打開(kāi)5K的網(wǎng)頁(yè)代碼區(qū)別并不明顯。而采取XHTML建站的缺點(diǎn)也很明顯，如果是一個(gè)同樣規(guī)模的網(wǎng)站，用TABLE做，1小時(shí)就可以了，用DIV要2小時(shí)，用符合語(yǔ)義的XHTML則需要3小時(shí)，當(dāng)然這只是一個(gè)預(yù)估，根據(jù)頁(yè)面的不同和技術(shù)人員的熟練度，時(shí)間上面會(huì)有一定的出入。

那我們何必多花時(shí)間來(lái)做網(wǎng)站？

跟選老婆一樣，我們不應(yīng)該只看重這個(gè)人外觀(guān)是否美貌，而更重要的是關(guān)心她“內(nèi)部配置”如何，不然娶回家，三天兩頭跑醫(yī)院，沒(méi)事就跟你吵一架，心情肯定不會(huì)太愉悅。
一樣的，做網(wǎng)站，不能只看設(shè)計(jì)風(fēng)格如何如何。更最要的是核心代碼如何、質(zhì)量如何。我們做出來(lái)的網(wǎng)站不是擺在家里自己欣賞的，更重要的是去推廣這個(gè)網(wǎng)站，給自己的企業(yè)帶來(lái)網(wǎng)絡(luò)影響力。讓用戶(hù)搜索某個(gè)關(guān)鍵詞能找到你的網(wǎng)站，而不是找到別人的網(wǎng)站。

那怎樣讓搜索引擎找到自己的網(wǎng)站？

最簡(jiǎn)單的方法是寫(xiě)搜索引擎可以看懂的代碼，也就是機(jī)器語(yǔ)言。
搜索引擎并不知道頁(yè)面展現(xiàn)出來(lái)的效果是什么樣子的，它畢竟是機(jī)器，至少現(xiàn)在不會(huì)和人一樣，坐在顯示器前邊，很清楚的看到外觀(guān)，很清楚的知道主次之分。它只能通過(guò)機(jī)器語(yǔ)言——也就是你寫(xiě)下的代碼來(lái)了解你的網(wǎng)站、收錄你的網(wǎng)站。
當(dāng)你用符合語(yǔ)義的XHTML，告訴它哪個(gè)是更重要的標(biāo)題（H1/H2/H3/H4/H5/H6），哪個(gè)是列表（UL/OL/DL），哪個(gè)是段落（P）……它就會(huì)認(rèn)為你是一個(gè)好人，寫(xiě)下了它能看懂的語(yǔ)言，它就會(huì)把你的排名往前邊提。
而整個(gè)網(wǎng)站都是table布局，談不上主次之分，搜索引擎理解也會(huì)很吃力。DIV布局就更可笑了，整個(gè)網(wǎng)站寫(xiě)下的都是id=”title”，更有甚者寫(xiě)的都是拼音id=”biaoti”，更更有甚者用id=”tit01″，千奇百怪的代碼風(fēng)格，難道開(kāi)發(fā)人員在指望現(xiàn)在的電腦就能讀懂人類(lèi)語(yǔ)言？甚至還中文英文自創(chuàng)文都懂？

三者的關(guān)系

其實(shí)開(kāi)篇就應(yīng)該提一下三者的關(guān)系，怕概念性的玩意太多，嚇跑了一般讀者，最后簡(jiǎn)要的介紹一下。其實(shí)table、div都是xhtml的一個(gè)元素，table有它自己的作用，它就是用來(lái)做表格的，當(dāng)網(wǎng)站內(nèi)需要表格元素的時(shí)候，它是不可或缺的組成部分。div更是常用的元素之一。我們應(yīng)該按照它們?cè)跈C(jī)器語(yǔ)言中的語(yǔ)義，來(lái)給予他們不同的使命，而不是簡(jiǎn)單的拿過(guò)來(lái)隨便放在一個(gè)地方就開(kāi)始用，其實(shí)哪一個(gè)元素都可以做一個(gè)網(wǎng)站，甚至可以只用p標(biāo)簽來(lái)做網(wǎng)站、只用ul標(biāo)簽來(lái)做網(wǎng)站，但那樣做出來(lái)的東西，看起來(lái)效果一樣，實(shí)際上會(huì)造成機(jī)器人的閱讀障礙。解析速度慢是小事，萬(wàn)一被搜索引擎認(rèn)為是不友好因素，給屏蔽了，就麻煩了。畢竟，網(wǎng)站一個(gè)人玩沒(méi)啥意思。