| |
使用Table布局頁面為什么是不明智的？
大家看到標(biāo)題，不要誤解認(rèn)為在頁面中不能使用Table，而是可以使用Table，但是盡量不要用Table去布局頁面，為什么這么說呢，因?yàn)槭褂肨able布局頁面會使頁面失去靈活性，怎么個靈活法呢，比如今天你好不容易做出來的頁面，第二天老板說我不喜歡登錄模塊放到右邊，還是放到左邊，通知板塊放到右側(cè)去，頁面風(fēng)格最好一個月?lián)Q一種，如果遇到這種老板，提出這種要求，并且你的頁面是用Table布局的，那么你會崩潰的，工作量那是大大滴~，如果不相信的話，你們自己可以找個頁面，用Table布局出來，然后變換板塊和風(fēng)格，你就會體會到Table布局的不靈活性，這是為什么呢，因?yàn)門able的誕生是為存儲數(shù)據(jù)用的，功能和Execel差不多，不是用來布局用的，只不過后來大家發(fā)現(xiàn)用Table可以把想放的頁面元素，比如圖片，放到任何自己想放的地方，且做出來的頁面可以兼容多種瀏覽器，于是Table就承擔(dān)起了布局頁面的重?fù)?dān)，這一做就是好幾年... ...直到Web2.0時代的到來，Table才從布局頁面的工作中逐漸解脫，專心的去存儲數(shù)據(jù)^_^
既然Table是為存儲數(shù)據(jù)誕生的，那誰的誕生是為了頁面布局呢？
答案就是:DIV，DIV就是為布局頁面而誕生的，只不過一直不被人認(rèn)同，原因就是DIV去布局頁面需要CSS的配合，使用比較繁瑣，還不如Table拖拖拽拽頁面就布局OK了，感覺還不如Table方便，從而DIV被人們放置在一個無人問津的昏暗角落里，暗暗的等待著伯樂的出現(xiàn)，直到2003年美國加州Scott Design公司參加了在舊金山舉辦的有關(guān)網(wǎng)頁排版和設(shè)計(jì)的一個研討會上的演講，使DIV看到了陽光，走出了陰霾... ...
說了那么多，我們對比一下Table布局頁面和DIV布局頁面的優(yōu)缺點(diǎn)
使用表格進(jìn)行頁面布局會帶來很多問題：
* 把格式數(shù)據(jù)混入你的內(nèi)容中。這使得文件的大小無謂地變大，而用戶訪問每個 頁面時都必須下載一次這樣的格式信息,帶寬并非免費(fèi)。
* 這使得重新設(shè)計(jì)現(xiàn)有的站點(diǎn)和內(nèi)容極為消耗勞力 (且昂貴)。
* 這還使我們保持整個站點(diǎn)的視覺的一致性極難，花費(fèi)也極高。
* 基于表格的頁面還大大降低了它對殘疾人和用手機(jī)或 PDA 瀏覽者的親和力。
而使用CSS進(jìn)行網(wǎng)頁布局，它會：
* 使你的頁面載入得更快
* 降低你的流量費(fèi)用
* 讓你在修改設(shè)計(jì)時更有效率而代價更低
* 幫助你的整個站點(diǎn)保持視覺的一致性
* 讓你的站點(diǎn)可以更好地被搜索引擎找到
* 使你的站點(diǎn)對瀏覽者和瀏覽器更具親和力
* 在世界上越來越多人采用 Web 標(biāo)準(zhǔn)時，它還能 提高你的職場競爭實(shí)力 (事實(shí)上也就是降低失業(yè)的風(fēng)險)。
網(wǎng)上有一篇文章，轉(zhuǎn)過來，文章著重介紹DIV三點(diǎn)優(yōu)勢,也許看完文章后，就像社區(qū)元老heflyaway說的感覺作者比較迷戀Table，每篇文章都不可避免的帶有個人色彩，而轉(zhuǎn)出來的目的，其實(shí)就是想給大家降降DIV+CSS的溫度，免得“走火入魔”，視DIV+CSS是為萬能的，如果想學(xué)好CSS布局頁面，就要從多個方面看它，好了，不多說了，下面是作者對CSS布局頁面的三點(diǎn)優(yōu)勢及理解：
1、內(nèi)容和形式分離，網(wǎng)頁前臺只需要顯示內(nèi)容就行，形式上的美工交給CSS來處理。生成的HTML文件代碼精簡，更小打開更快。
2、改版網(wǎng)站更簡單容易了，不用重新設(shè)計(jì)排版網(wǎng)頁，甚至于不用動原網(wǎng)站的任何HTML和程序頁面，只需要改動CSS文件就完成了所有改版。對于門戶網(wǎng)站來說改版就像換件衣服一樣簡單容易。
3、搜索引擎更友好，排名更容易靠前。
第一點(diǎn)、內(nèi)容和形式分離
網(wǎng)頁前臺只需要顯示內(nèi)容就行，形式上的美工交給CSS來處理。生成的HTML文件代碼精簡，更小打開更快。
這個是DIV+CSS技術(shù)最顯著的特點(diǎn)，也是CSS存在的根源。完全的顛覆現(xiàn)在傳統(tǒng)（table）網(wǎng)頁設(shè)計(jì)的技術(shù)。所有現(xiàn)在用table制作的內(nèi)容，都可以用CSS來解決掉，而且解決的更完美，更強(qiáng)大。不需要大家再表格套表格，讓生成的網(wǎng)頁文件大小更精簡，更小。table時代，一個頁面表格達(dá)到10個以上是非常普遍的事情，但是現(xiàn)在用DIV+CSS，一個table都可以不用，就完全達(dá)到之前的效果，這就直接導(dǎo)致網(wǎng)頁文件大小比使用table時減少50%-80%，更節(jié)約各位站長的硬盤空間，訪問者打開網(wǎng)頁時更快，而且用div+CSS時，不像以往使用table時，必須把全部table讀取完了才顯示頁面內(nèi)容，現(xiàn)在是可以讀一個div就顯示一個效果，大家打開網(wǎng)頁不用等。好處真是明顯而強(qiáng)大。 |
|
|
| 【收藏】【打印】【進(jìn)入論壇】 |
|
|
|
|
| |
|
|
|
