※ 引述《kairosa (暗夜)》之銘言： : ※ 引述《clifflu ( [ 超 宅 ])》之銘言： : : 我個人的解讀偏重在 "語意" 上 : : 以目前 html/xhtml/CSS 的趨勢，是加強標簽 (tag) 與語意間的關聯性， : : 表現 (presentation) 則靠 CSS 處理。 : : 也因此，有許多 "平常很少用" 的 tag，在早期 html 甚至不含特殊顯示方式的 : : tag 如 acronym (希望沒記錯), code, quote 等，現在被大量推廣 : : 而以往作為改變表示方式的標簽如 <i> <b> <u> 則被建議避免使用。 : : 取代的方式是以 div, span (視 block 狀態) 或 font 標簽取代。 : : frame 在許多情況下，能以 js 及 DOM 的 innerHTML 加以取代 : : iframe 感覺上比較接近是 applet 的運作 :p (個人認為啦 XD 或是 cross-window) : : 從這樣的邏輯來看，不當的使用 table (別忘了它還有 thead, tbody, th 等 : : 的子標簽) 來做版面編排，確實是有些怪異。 : : 另外，近代 CSS (也許是 2.0+ ) 也對 media type 多加著墨， : : 希望使同樣的內容，能夠透過不同的表現方式 (css) 直接在各種媒體上以 : : 適當的方式呈現 (ie. 手機，PDA，電腦螢幕，朗誦程式，印表機 等等等) : : 而非像目前主流的做個 "Printer friendly page" 的 link 給你點 ^^; : : 錯誤的使用標簽，會使得跨媒體頁面變得相當詭異。 : : --- : : 不止是為了 AA 而已 : : AA 只不過是跨媒體中的一個部份 ^^;; : 現在講求不是用table而是用div : 是有點物件導向式的設計網頁 : 這對網頁程式設計師來說 : 可以很輕易的針對某區塊某物件來設計程式 : 而不會因為可能要加一個區塊而網頁需要大修改 : 如果玩過photoshop就知道圖層吧... : div就相當於圖層可以一層層疊上去 : 這東西大家自己去摸看看吧... : 只要熟了~妳就會發現它能發揮的創意不是table可以做到的... : 最後一個用div來設計網頁的好處... : div可以用css控制也可以用javascript去控制... : 所以...div所開發出來的網頁... : 不需要改太多指令就可以不斷的創新風格... : 大家可以去新浪blog看看... : 新浪的創意總監規劃的，有很多不錯的技術大家可以去參考看看... 分享一下經驗吧....我是以程式設計的角度來看使用 <div> 的問題.. 不使用表格改用 <div> 可以讓程式與美工的角色明確的分工... 以往的經驗可能是由美工將版面配置設計好給 Programer 通常 Programer 要在將美工的版面調整或是拆解 , 等於 Programer 還要在把 版面看過一便在修改程式 改採 <div> Programer 不需要管版面長什麼樣...只需要知道這個頁面 要有那些元素 , 在 Template 中先將每個區塊用 <div> 包好 ex: <div id="toolbar"> 　　<div id="btn_1" class="btn">選單1</div><div id="btn_2" class="btn2">選單2</div> 　</div> <div id="data"> {Data.Content} </div> 以上是一個 ToolBar 的區塊和　一個資料顯示區 當一個 Template 規劃好之後 美工僅需去調整 css 就可以把畫面呈現出來 , 不需要 Programer 這邊在花很多 時間去做微調 , 另外要更換版面和移動位置的速度只須換一個 css 檔引入即可. 此外更重要的就是彈性 , 呈接上面那個範例.... 如果以 <table> 來排版 ex: <table> <tr> <td> <table> <tr> <td>選單1</td> <td>選單2</td> </tr> </table> </td> <tr> <tr> <td> <table> <tr> <td>Data</td> </tr> </table> </td> </tr> </table> 所要用的<tag> 多是一個缺點 , 另外如果我要將選單的部份移到下方 ,　要花 很多的時間去修改原本 <table> 的結構 , 以上在以 <div> 排板的情況下 , 只需改動 css , 兩者所花的時間大家可以比較看看 . 在目前 WEB 2.0 的潮流下 , 為了給使用者更好的操作體驗 , 保留更大的彈性給使用者 , 加快開發改板的流程 , 這也是為什麼 <table> 的排版法越來越被淘汰的原因.... 在加上網路上有很多開發套件 , 有興趣的人可以去看看 yahoo user interface 這套 freamwork 看看使用 <div> 排版 , 在加上現成 css 套件的威力在那 . http://developer.yahoo.com/yui/grids/ 真的要比較兩者其實還很多很多 , 但我想還是要自己去體會才能知道 :) 我從記事本時代就開始寫網頁 , 所以用 <table>　排版的時代我都用 手在 key html 碼 , 所以兩種方式產生的 template , 用 <table> 明顯的會產生 很多的垃圾 code .... / \ --

※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 60.248.155.94 ※ 編輯: nightmarelee 來自: 60.248.155.94 (12/31 16:41)