Html表格在網(wǎng)頁布局中的應(yīng)用已經(jīng)有很多年了,多年技術(shù)的發(fā)展與Web工具的增強,一度使html表格布局達(dá)到了登峰造極的地步。網(wǎng)頁制作師可以非常輕松的使用圖像編輯器設(shè)計網(wǎng)頁并切圖,最后自動生成以表格布局的網(wǎng)頁。
但傳統(tǒng)表格布局雖然加速了網(wǎng)頁制作師們完成網(wǎng)頁速度,但卻忽視了代碼的理性分析。實際上,html表格的功能不是用來進(jìn)行網(wǎng)頁布局的,最初的網(wǎng)頁也沒有今天這么復(fù)雜,僅顯示文本或幾個簡單的圖像,后來隨著網(wǎng)頁內(nèi)容的豐富,圖像、聲音、動畫等多媒體不斷充斥著網(wǎng)頁,用戶對網(wǎng)頁視覺提出了更高的要求,于是就有人試著在表格中放置一些網(wǎng)頁的內(nèi)容。
其實在表格布局之初就有專家提出異議,而且那時css技術(shù)也已經(jīng)公布于眾,一套較完善的網(wǎng)頁標(biāo)準(zhǔn)技術(shù)也已經(jīng)被推向市場,但響應(yīng)者甚少,微軟的IE瀏覽器更是帶頭唱反調(diào),標(biāo)準(zhǔn)就這樣被非標(biāo)準(zhǔn)壓制了好幾年。
現(xiàn)在Web技術(shù)從 1.0 跨入 2.0 時代,表格布局已經(jīng)不能再適應(yīng)新技術(shù)的發(fā)展趨勢了,如今的Web世界中用戶體驗才是王道,xhtml + css 的技術(shù)應(yīng)用逐漸占據(jù)上風(fēng),使微軟這樣的巨無霸也不得不臣服于W3C所提倡的標(biāo)準(zhǔn)之下。
Web 2.0 對于網(wǎng)頁結(jié)構(gòu)和布局提出了更高的要求,這不僅僅是為了節(jié)省幾行代碼、減少帶寬的問題,因為今天的網(wǎng)絡(luò)帶寬已經(jīng)不是技術(shù)發(fā)展的主要障礙了。要實現(xiàn)Web的交互與共建就必須允許用戶可以操縱網(wǎng)頁,而這些都必須建立在完全標(biāo)準(zhǔn)的網(wǎng)頁結(jié)構(gòu)之上,這是html表格布局無法做到的。
Web 2.0 的這種要求與表格網(wǎng)頁布局是格格不入的,透過那些所謂精美的表格頁面看網(wǎng)頁源代碼,你會發(fā)現(xiàn)就如同看天書一般,這讓后期維護(hù)和更新成為了一場噩夢,我們通過一個簡單的案例來說明這個問題。
上圖中,位于左側(cè)上方的是html表格布局,右側(cè)下方的是 xhtml + css 布局,我們清晰的可以看出其代碼量相差很大,這只是一個最簡單的網(wǎng)頁布局,但如果做一個企業(yè)網(wǎng)站或者一個大型門戶網(wǎng)站,其代碼量的差距是可想而知的。
但遺憾的是,部分設(shè)計師在學(xué)習(xí)和使用網(wǎng)頁布局時有表格恐懼癥,認(rèn)為網(wǎng)頁中只要出現(xiàn)<table>、<td>、<tr>等標(biāo)簽就是不符合標(biāo)準(zhǔn)的,實際上這是種錯誤的認(rèn)識,我們在網(wǎng)頁布局中只要記住一點:表格是用來組織和展示數(shù)據(jù)的,而不是用來布局的,當(dāng)你要展示一個二維表格的數(shù)據(jù)給用戶時,選擇使用表格是再恰當(dāng)不過的了。
建站咨詢熱線
4006123011