DIV CSS 佈局教程網

引言：
　　一群會用table蹩腳布局的網頁初學者嘲笑著那些對網頁制作一竅不通的門外漢；而一群自認為 table布局無所不能的table布局擁護者則嘲笑著那群用table蹩腳布局的網頁初學者；那些剛試著將幾個頁面中的table換成div的所謂的 web標准設計者則嘲笑這那群死抱table布局不放的table布局設計者；而一群焦頭爛額終於在網站上貼上“W3C驗證通過Html網站”圖標的自認高高人的web標准設計者則嘲笑這那群以為“DIV+CSS”就是web標准的web標准設計初學者；但是當我們把我們的網頁放在不同的浏覽器中的時候，卻發現我們全部都被“Web標准設計”嘲笑了……

　　正文：
　　標准：衡量事物的准則。例句：惟極貧無依,則械系不稍寬,為標准以警其余。——清•方苞《獄中雜記》
　　Standard: An acknowledged measure of comparison for quantitative or qualitative value; a criterion.

　　無論是中外古今的對於標准一詞的解釋都很相近。即：標准是一個准則。那麼冠以“標准”前綴的詞，則必須符合此准則。如：
　　標准大氣壓（standard atmospheric pressure）：指在緯度為45°的海平面上,溫度為0°C時的大氣壓,相當於76厘米高的水銀柱所產生的壓強。
　　標准照（official portrait）：指人的正面半身免冠相片。

　　那麼冠以“標准”前綴的web標准設計，也必須有一個衡量的准則方可。但是我們發現所謂的衡量web標准是否標准的准則並不存在，至少目前還沒有成型。沒有衡量准則，標准何以言之為標准？

　　推薦遵循標准不是嚴格意義上的標准

　　當你試圖在網上查找“什麼是web標准”時，找到的多數是將web標准進入中國的先驅阿捷的文章《什麼是web標准》。雖然裡面提到了各個組成部分的“推薦”遵循標准，但是那些也都只是W3C組織“推薦遵循”的標准。大家都知道W3C標准不是強制性標准，所以像微軟這樣喜歡“賣標准”的一流公司並不完全買W3C的帳。所以那些所謂的“推薦標准”從嚴格意義上來說並不是全面的、嚴格意義上的認證標准。

　　注：雖然W3C的推薦標准不是嚴格意義上的標准，但是我們絕對不可以無視。因為它們的確很有指導意義。而且我們非常欣慰的看到：雖然IE7為了向前兼容，保留了一些IE6的詭異解析方式，但是它也正在逐漸的遵循這些標准。所以這些標准現在是“推薦遵循標准”，但是在不久的將來極有可能成為真正的標准准則，那個時候就是“web標准大統一”的黃金年代。所以還沒有看過下面這些文章的朋友要抓緊時間啦。

　　W3C推薦遵循web標准文檔列表：
　　XML方面：《Extensible Markup Language (XML) 1.0 (Second Edition)》
　　XHTML方面：《XHtml 1_0 The Extensible HyperText Markup Language (Second Edition)》
　　DOM方面：《W3C DOM規范》
　　CSS方面：《Cascading Style Sheets, level 2 CSS2 Specification ver.12-May-1998》
　　Script方面：《ECMAScriptLanguage Specification》

　　web標准與否不能被有效驗證

　　即使我們暫且將那些“推薦遵循標准”視為標准，我們仍然有很多問題。例如：怎麼檢驗我們的頁面就是符合那些“推薦遵循標准”的呢？的確，我們有驗證工具，但是那些驗證工具的驗證結果就是正確的嗎？web標准一個重要的部分就是，根據標簽的語義來使用它們。例如table是用來呈現表格數據的，而不是用來分割文檔的（也就是平時說的布局）。但是一些利用table布局的頁面也能順利的通過驗證工具的驗證。所以那些驗證工具的驗證結果也只能作為一種參考。

　　語義是道多選題

　　說道標簽的語義，這也會帶出一些問題。因為當我們決定使用哪種標簽的時候，我們會發現我們面對的是多選題，而不是單選題。因為某些情況利用多種標簽時都是符合語義的。我們舉個最簡單的例子：

　　你說“Name:”應該用什麼標簽包起來？label？span？其實無論使用哪個都是符合各自的語義的。正是這種“多選題”讓web標准顯得有些朦胧。

樹欲靜而風不止

　　即使上面的問題都不再是問題了，我們仍然有一個大問題——各種浏覽器對web標准的支持不統一。也正是這種標准不統一的大環境讓web標准顯得缥缈、遙不可及。看到論壇上天天有人在罵“垃圾FF”、“垃圾IE7”、“垃圾IE6”……縱觀世界，能生存下來的只有兩種生物——改變環境以適應自身發展的，例如人類；改變自身以適應環境發展的，例如：變色龍。當我們不能改變這個世界的時候，那麼就改變自己去適應這個改變的世界吧。

　　有限的資源，努力的去做

　　Web標准不標准，至少是現在沒有統一的標准，但是網頁還是要做，工程還是要趕。我們能做的，只能是合理的利用手頭的有限的資源，努力的去做到最好。這句話包含了兩個方面的含義：有限的資源，努力的去做。

　　有限的資源：
　　當你躺在象牙塔裡，努力的讓你的個人網站貼上W3C認證標簽的時候，你是無可厚非的，因為你的資源是那麼的充足，時間、青春、沒有項目時間的催促，沒有客戶的最後通牒。但是當你真正的在做商業項目的時候，你會發現我們能利用的資源是及其有限的。人力資源，物質資源，時間資源都是那麼的捉襟見肘。當你有分配這些資源的權利的時候，你才會發現分配這些資源的責任。我們的項目，絕對不會為了那張W3C認證標簽而浪費寶貴的資源。

　　努力的去做：
　　但是有限的資源絕對不是粗制濫造的借口。事實上，我們項目對於質量是及其重視的。項目經理提出的“質量是項目之本”的結論已經在我們團隊達成共識。給測試部門的測試資源，我們向來都安排在整個工程的1/5以上。（分析設計過程3/5以上，代碼coding1/5以下，其余的給測試部）。

　　但是努力的去做，到底要做成什麼樣？其實也並不是沒有參考。當你看Andy Budd的《樣式指南示例》中我們可以看到一些國際上對此問題的處理方法的端倪，他在1.4小結提到了Browser Support的概念。然後他提出了對不同浏覽器支持的不同程度：

　　Target – Most popular browsers at present. Everything must work as intended
　　Supported – Old but popular browser. All content and functionality must work with minimal degradation.
　　Partially supported – Old and buggy browsers. Not supported but not officially unsupported. Content and functionality must work. Degradation must be graceful and should not obscure content.
　　Unsupported – Buggy and unsupported browsers. Advice current users to upgrade.

　　我認為這是正確的做法，選定主流的浏覽器，然後對主流的浏覽器進行Target支持，而對於次之的浏覽器進行Supported支持。而對於一些老版本的浏覽器進行Partially Supported甚至完全不去管。這樣就能最大可能的讓網站被浏覽者正常的浏覽。當然將哪些浏覽器，哪些版本進行Target支持，需要根據項目的使用群來決定。例如我們最近的一個日本母公司內部使用的B/S系統，因為我們知道他們那邊使用者的電腦軟件配置情況，所以我們進行了如下的浏覽器支持定義：

　　IE7+：Target
　　IE6+：Supported
　　FF ：Partially Supported
　　Other：Partially Supported or Unsupported

　　正是有了這個浏覽器支持表單，讓我們調畫面的時候有的放矢，有所側重。而不是一味的讓所有的浏覽器都正常支持而浪費時間（而且讓所有的浏覽器正常支持也只能是一種理想狀態）。

　　Web標准難不難？

　　沒進來的人說：很難！
　　剛站在門框上的人說：不過如此。
　　站在門裡面的人則說：web標准的路還有很長一段要走……

　　後記：
　　當初起這個名字的時候就知道會遭到很多人的炮轟。反正早已練就“無敵厚臉皮”神功。罵也無妨，駁也無妨，炮轟也無妨。因為正是你們的留言，你們的論點，你們的討論讓web標准之路能夠走的更遠，走的更平坦。