HTML 4 Strict x Transitional

最近完成了一個專案因為 IE Box model 的問題而必須強迫使用 CSS Hacks 去修正一些 layout 上的小問題, 雖然使用 HTML Strict Doctype 可以強迫 IE5 之後的瀏覽器有相同的屬性而規避這各問題, 但是查了一下 google 才發現原來最嚴謹的標記語法竟然有那麼多不支援的地方, 我覺得比較誇張的是在嚴謹的 html4/ xhtml1 的版本中, target="_blank" 另開視窗是無效的, 原因是 w3c 認為這些內容之外的東西不應該在 html 裡面定義 (還有其他一些長篇大論 blah blah), 解決方法竟然是用 rel 屬性加上 javascript 去解決…

HTML

<a href="http://google.com" rel="external">Google</a>

Javascript

document.onclick =function(e)
{ var target=e ? e.target : window.event.srcElement; }

但是要是使用者的 Javascript 是關閉的狀態怎麼辦?
我想, 制定標準的人有時候會太過理想化了點, 到了網頁的實務開發上卻很難 follow 這些理想, 網站製作要因應解決各種的 browser 的 issue 本來就已經是 pain in the ass, 所以最好的方法是因應各種不同的專案類型, 考量各種因素之後去取決適合的開發 Doctype ( 時程/ 資訊架構/ 設計)
所以有時候還是使用 Transitional 別給自己找麻煩的好.
當然拉, 如果網站製作的時程允許的話, 基於 Web Standard 我還是傾向使用 XHTML4 STRICT 來開發網站 lol….

Strict DOCTYPEs 不支援的 elements

• center
• font
• iframe
• strike
• u

Strict DOCTYPEs 不支援的屬性

• align (allowed on elements related to tables: col, colgroup, tbody, td, tfoot, th, thead, and tr)
• language
• background
• bgcolor
• border (allowed on table)
• height (allowed on img and object)
• hspace
• name (allowed in HTML 4.01 Strict, not allowed on form and img in XHTML 1.0 Strict)
• noshade
• nowrap
• target
• text, link, vlink, and alink
• vspace
• width (allowed on img, object, table, col, and colgroup)

衍伸閱讀

http://www.alistapart.com/stories/doctype/
http://24ways.org/2005/transitional-vs-strict-markup