设计之家 > 教程 > 網頁教程 > CSS教程 >

對于DIV+CSS的開發方式,我們也要聽聽另外的聲音

作者:未知 來源:網頁教學網 時間:2006-03-07

  文: Andy Budd / 譯: Jjgod Jiang

  譯自 An Objective Look at Table Based vs. CSS Based Design 

  我和作者的觀點差不多.標準好,但是未必實用.

  以下是ZT文章:

  經年以來,許多優秀的文章都在贊美著基于 CSS 設計的優越, 哀嘆著基于表格設計的沒落。但卻很少有人換個角度想想,或許是因為你得在了解并運用了基于 CSS 的設計之后才可以批評它, 而一旦了解了之后,你又不愿意回頭去用原先的老式設計方法了。

  為了彌補一下這種不平衡,也因為在這場游戲中扮演一個大反派挺酷的,我決定寫篇文章,說說為何在某些情況下,傳統的表格設計方式就算不比基于CSS 的――或者說基于標準的――設計方式好,也不比它們差。

 一、妖魔化表格

  表格出現以前,Web 本是個相當乏味的地方,正是使用表格排版,才打開了可視化的頁面設計的新局面。表格對于 Web 和 Web 設計領域普及的貢獻到底有多大或許有爭議,但一旦離開表格,我們這些網頁設計師們必會失去工作,卻是毋庸置疑的。

  近年來基于表格的設計確實被妖魔化了,Web 純化論者會告訴你,表格對排版毫無意義,因而你絕不能用到它。然而歷史證明,許多技術一開始是為了實現某個目標設計的,卻在別的領域發現了更大的用場而大展身手。 就像 Web 本身,一開始不也只是為了共享研究數據嘛,現在在娛樂和商業方面的應用卻與信息與教育方面的并駕齊驅了。

 二、只為舒服一點

  Web 設計師們多年以來都在使用表格排版頁面,這是絕大部分設計師都已掌握的能力。如此地使用表格能保證你獲得預想的效果,通過一些簡單的 hack,比如間隔 gif, 我們幾乎一定能保證我們的站點在最廣泛的 Web 瀏覽器上看起來都一樣,從最低版本的 Netscape 4到Safari 這樣的現代瀏覽器。

  盡管先驅者們早已宣傳了好久 Web 標準, 大部分的網站還是使用表格和不兼容標準的代碼開發的,因此用戶代理就不得不在很長一段時間內支持基于表格的排版方式。 這對于 Web 標準的賣點來說,是個致命的打擊:標準沒有標準應有的地位。不大可能會出現下面這種情況,某個主要的瀏覽器廠商 (唔,還是說 Microsoft) 突然發布了一個大部分網站都顯示不了的瀏覽器。

  所以網頁設計者們總感覺不到開始使用基于  CSS 排版和支持標準的代碼的那種危機感和必要性。

 三、降低門檻Web

  正是因為它的門檻低才如此成功的: HTML 是個簡單易學的語言,瀏覽器又能容忍許多標記混亂的文檔。 這使在 Web 上發布內容變得難以置信地容易。即便你 12 歲的侄子也能用 Microsoft Office 中附帶的 Frontpage 搗鼓出一個簡單的網站來。

  基于表格的設計比之基于 CSS 的,當然 CSS 的語法很簡單,正常人都會同意:你沒必要是火箭科學家才能學會 CSS。盡管如此,其中有些概念還是過于微妙了,不易領會。比如表面上看,Box 模型很簡單,但我偶爾還是會在邊界折疊 (margin collapsing) 上滑一跤, 浮動(float) 和清除 (clear) 這樣的概念也不好理解,較難運用。 以我的經驗而言,從了解 CSS 的基本概念到能自如地用 CSS 開發站點,大約需要走過一條為期 6-12 月的學習曲線。

  然后是瀏覽器支不支持的問題。一旦你正式開始干活,就會慢慢了解哪個瀏覽器支持什么、不支持什么,和一些常見的瀏覽器 bug。可惜bug 太多了, 就算“專家”們也難以估量自己花在修整 bug 上的時間。對新手來說就更讓人泄氣了,因為他們不知道是因為自己誤解了CSS 呢,還是某些晦澀的瀏覽器 bug?也許這就是為何同樣的問題一再出現在 CSS-Discuss 等郵件列表上的原因吧。

  如果瀏覽器廠商們終能步調一致, 用 CSS 開發站點將會容易得多。但我還是覺得――大部分人也會同意――CSS 開發的門檻比基于表格的還是太高了。換個說法, 我覺得這也說明了為何基于 CSS 的設計在Web 專家們之間如此流行。這讓他們把自己和那些業余的“Front-page 牛仔”們區分開來,讓他們找回當年 Web 只屬于自己這個小群體時的感覺。 大概這正式因此,那么多人都把 Web 標準看作不可觸及的“象牙塔”, 那么多 Web 標準的鼓吹者卻以狂熱的態度,帶著優越感去看待網頁設計。

 四、有些東西還是用表格來做更容易

  我確信我們大家都曾發現,自己為了實現用表格做起來是小菜一碟的功能寫了相當復雜的 CSS。比如處理表單 (form) 的外觀,形狀再復雜怪異的表單也能用表格輕松搞定。 你是可以用 CSS 的浮動元素實現類似的結果,但就麻煩多了。 如果你是個 CSS guru,這種麻煩也是快樂的事。可毫無疑問,如果你只是個普通人,還有個會掐住你的喉嚨問你怎么做個小表單也花了這么久的老板,事情就不那么好玩了。

  如果你有足夠的知識,又有足夠的耐心,習慣于用表格做的大部分事情還是都能用 CSS 實現的。 雖說花的時間長點吧,還是有個限度的(或者被打擊得放棄了嘗試)。關鍵是確實有些無論你怎么努力,還是無法實現的東西,其中一項便是頁腳欄 (page footer)。我常常見到來自灰心失望的 CSS 作者的貼子, 他們試圖創建那種可以粘在窗口底端的頁腳欄,使即便那個窗口沒伸展到整個屏幕也能保證效果。如果用到了表格,要做出這種效果簡單得很, 可單獨用 CSS 來做就是另一回事了。 為什么還有 Web 開發者們不愿意用 CSS?就是因為一旦不用表格,簡單的事情反而變復雜了。

 五、夸大收益

  有很多理由讓你丟掉表格、去適應基于 CSS 的排版, 可在推動 Web標準的洪流中,許多人夸大了收益。 大的站點改用 CSS 排版確實能節省不少帶寬。可對大部分的其他站點來說,受益小得庶幾可以忽略不計。

  大家都希望頁面載入得更快, 而標準鼓吹者們也說 CSS 能幫你做到這一點。大多數站點的“設計”都是均勻分布在整個站點上的,但基于 CSS 的“設計”是放在一個到更多的文件中的。 這些文件會很快變得很復雜、很大,即便一個小站點也是如此。我最近設計的一個站點用了 4 個樣式表,加起來有 12k 之大 (雖說包括了空白和注釋)。使用 CSS其實是在先集中地載入然后再瀏覽,而不是把要載入的數據平均分布到整個站點各處。也就是說,相比用表格排版,首頁需要花更長的時間來下載。只不過如果樣式表已經下載了,它們會被緩存起來而不需要重新下載。可畢竟一個站點的首頁是你最不希望載入得那么慢的一頁呀。

 六、招攬客戶

  即便有時網頁設計者們覺得把符合  Web 標準搭售給客戶是有必要的,但令人遺憾的事實是,大多數的客戶對站點的代碼好壞并不在意。我們一般用的是胡蘿卜加大棒的方式,胡蘿卜是諸如對搜索引擎的友好度之類,而大棒才是網頁的親和力 (accessibility)。

  確然,搜索引擎是比較喜歡語義化標記的頁面,而且大家也都認為搜索引擎喜歡短小的代碼,通過 CSS 和 Web 標準來建構站點可以大大增進對搜索引擎友好的站點的開發。然而沒有銀彈。許多基于表格的站點照樣獲得了很高的搜索引擎排名。 用 CSS 開發的站點照樣也可能只獲得一個很糟糕的排名。高排名的關鍵是內容和來自別處的鏈接,而不是用表格還是用 CSS 來排版。

  另外關于利用客戶對“親和力”這個詞的敬畏來搭售 Web  標準特別是 CSS 設計, 其實基于表格的設計沒有什么天生的親和力缺陷,表格只要線性化了,就有意義,內容也就具有親和力了。現時的讀屏器技術已經不錯,而且大部分的讀屏器都能很好的支持基于表格的站點。當然你的站點的語法最好被認證通過 AA 親和力等級,即便對更嚴格的 AAA 等級,不用表格設計也不過是個建議罷了,并非必備。

  另一個經常提到的受益是可以讓客戶獨立于設計提供商。在人人都依照標準開發的世界里,客戶要換個開發伙伴是很容易的事情,新的開發人員可以很快明白站點的組織結構,而不需趟過先前某人的標記泥淖。但這得要大量的設計提供商都精通 Web 標準才行。 不幸的是,現在的情況并非如此。 雖然經驗豐富的 CSS 開發者在增多,但這還是個相對比較專業的領域,因此,大公司要鎖定在這種開發方式上還是比較有風險的――缺少熟練的開發者。我個人的經驗是如果一個組織要用 CSS 開發站點, 得長期保持至少一個經驗豐富的設計師才夠用。 所以現在轉向 Web 標準不是降低了客戶對開發者的依賴,而是增加了。

 七、總結

  毫無疑問地,Web 標準和基于 CSS 的設計是未來之路。 可在我們奔向它們、鼓吹新技術的過程中,也會懷疑自己鼓吹的東西是否太夸張了。比較現實地做點東西卻往往達不到我們的期望。而教條地推行這些很可能疏遠了我們最應該贏得的伙伴。

  基于表格的設計還會存在好長一段時間。要吸引開發者,我們可以用實例來教人上手,并降低門檻。更別弄出新的門檻來了。我們得誠實地正視利益和代價。 開發 CSS 站點可能比較困難、耗時,而在某些情況下用表格來排版比 CSS 有意義得多。

标签:CSSDIV

推薦設計

最新文章