Web design trend — Dying table tags

網頁設計新趨勢 2 — 垂死肆虐的表格語法 (Table)

網頁設計新趨勢 — 垂死肆虐的表格語法

 

20年前,第一次接觸網頁設計,那時沒有太多的資源,連隨見即所得的網頁編輯器都尚缺,做網頁真的痛苦。熬夜搞了數個晚上,有時連一個網頁都還做不出來。沒多久 Dreamweaver 與 Golive 問世,讓視覺設計人員可以解此開始編輯網頁,虛擬世界突然變得相當美好,前途無量。

那個時候做網頁版面上的定位,唯一可以依賴的就是表格語法。這語法又臭又長,但也別無選擇,用得好的人可是嚇嚇叫呢 — 做常見的就是表格中還有表格。為了解析高手的技術,我還特別下載 Yahoo 與 Apple 網站的首頁來研究呢。沒多久,表格的問題一一浮現,甚至成為阻礙設計進步的一個癌細胞。

表格所帶來的問題 — 應該說是割膚之痛 — 就是莫名其妙地撐大與破裂。為了解套,網頁設計師們大量使用圖片來做定位,雖暫時跳過這個障礙,但也遺留了許多後續更新不易的問題。在國外,表格被稱為垂死的語法。因為它實在有太多的問題了。但在台灣,表格不但是設計公司裡的主流技術,甚至不見其退出舞台的跡象。主要的原因是:用表格來開發網站實在太方便了。這個方便是對於網頁設計公司而言,但對於業主來說,便是痛苦的深淵,因為業主必須有一個網頁設計經驗的人來負責網站的更新,一般人是無法勝任的。

取代表格的語法,就是全部使用 div 與 CSS。由於 div 的定位有其技術性,因此大多數的網頁設計公司很怕用此來開發網站。渾身是膽不怕死的,採取折衷的方式,即70%表格語法,30% div 語法。這種混合式的網頁設計語法,只是把簡單的事情變成更複雜而已。記得Dreamweaver古早前的版本,將 div 偽裝成 Layer 的樣式,讓網頁設計師隨意移動 Layer 的方式來做版面定位。此舉比過去便利不少,但在跨瀏覽器的相容度上,便又是另一個死穴。綜所皆知,IE 與 Netscape (火狐的前身) 兩瀏覽器 (那時 Google Chrome 還在孵蛋中) 對於 margin 與 padding 邊界起始點的定義不相同,雖然 IE 6 那時是主流,大可不屑他牌瀏覽器,但網頁設計上仍有許多盲點等待克服。

彙整表格語法在網頁設計上的缺點如下:

  • 語法繁瑣累贅,增加html檔案大小,不利搜尋引擊檢所資料
  • 不利於無障礙網頁設計規格的執行
  • 無法 100% 跨瀏覽器相容
  • 無法於手機上流暢的瀏覽

時至今日,國外網站的主體版面編排早已不見表格語法在其中 (但要處理表格時,表格語法仍是唯一選擇),取而代之的是 CSS framework 技術,這個好東西在台灣更少人用了。看來表格這餘孽勢必繼續肆虐下去,無人可擋,而網頁設計公司也將繼續縱容他們危害人間。

Leave a comment