IE6的BUG及修復 謂防患於未然的策略_HTML/Xhtml_網頁製作

在討論IE6的BUG及如何修復之前，有必要講敘一些策略去避免這些惱人的問題－正所謂防患於未然 。

原文：Ultimate IE6 Cheatsheet: How To Fix 25 Internet Explorer 6 Bugs
翻譯：http://www.php.cn/(譯文對原文進行了補充)

在討論IE6的BUG及如何修復之前，有必要講敘一些策略去避免這些惱人的問題——正所謂防患於未然。

IE6 市佔率

根據Market Share統計，目前（2009年8月）IE6 的市佔率為25.25%，但是其他地方的統計明顯要低，為18.1%；儘管統計結果不同，但都呈現出了下降的趨勢（翻譯此文時，淘寶的IE6用戶已從70%跌破至69%）。但是最重​​要的，還是你自己網站的統計數據。如果你對你的網站進行了流量分析，那麼IE6的佔有率是否值得你去針對IE6進行開發？這需要你自己去權衡。

如果你網站絕大部分訪客不使用IE6並且不付費給你，那麼你不必特意區針對IE6做兼容，從而節省時間、精力及資金。

做一個簡潔的設計

在做設計的同時考慮程式碼的實現，可以避免一些佈局上的問題。再複雜的設計稿也能用簡潔的程式碼實現，如果你使用了過於繁冗餘的標籤，那麼你需要重新修繕設計稿。
如果你有豐富的開發經歷，攻克過很多種佈局難題，記錄下你的解決方案，在以後碰到相同問題時可以提高開發效率。

使用適當的文檔申明(doctype)

使用一個錯誤的文檔聲明會觸發quirks mode(怪異模式)，正確的文檔聲明可以保證你的頁面在所有瀏覽器下保持一致的效果。使用其中的一個文件申明：HTML 5[/i], [i]HTML 4.01 Strict[/i], [i]HTML 4.01 Frameset[/i], [i]HTML 4.01 Transitional[/i], [i] XHTML 1.0 Strict[/i], [i]XHTML 1.0 Frameset[/i], [i]XHTML 1.0 Transitional[/i], 或 [i]XHTML 1.1

HTML 5

HTML 4.01 Strict

PUBL W3C//DTD HTML 4.01//EN" "http://www.php.cn/">

HTML 4.01 Frameset

HTML 4.01 Frameset

HTML 4.01 Transitional

XHTML 1.0 Strict

XHTML 1.0 FramesetXHTML 1.0 Frameset

XHTML 1.0 Frameset

XHTML 1.0 Frameset

XHTML 1.0 Transitional

XHTML 1.1

olor:#006da3">http://www.php.cn/">

驗證你的程式碼

我曾聽過有些人認為校驗程式碼沒有任何實用價值，但我不這麼認為。校驗僅只需花費一點點時間，而且將受益於所有瀏覽器而非僅僅IE6；驗證確保了向後相容並且易於維護。至少也得驗證XHTML！唯一可以忽略驗證的情況是在你打算使用CSS3時。 你可以使用w3提供的工具驗證XHTML

/ 驗證CSS先相容於標準瀏覽器在寫程式碼的過程中，一開始在標準瀏覽器中測試（如Firefox, Opera, Chrome等），然後再去測試非標準瀏覽器（如IE6/IE7），因為這些標準瀏覽器都遵循w3c標準，大多的處理方式都相同。你可以分開來單獨去相容「特別」的IE瀏覽器，這樣做能規範你的程式碼，你將會因此擁有紮實的基礎；而且如果你不再需要相容這些非標準瀏覽器，你可以一次刪除這些修復兼容性代碼。 漸進增強(Progressive Enhancement)

漸進增強(Progressive Enhancement)是為了確保沒有頁面特效後基本功能也是可用的。簡單來講，漸進增強是指確保頁面在停用JavaScript後能正常運作後，再為頁面加入各種特效（JavaScript動畫、Ajax非同步等等）。我們同樣可以運用「漸進增強」原則來使用CSS3（或一些CSS2）、HTML5以及其他IE6所不支援的web規範。
某些情況下，是無法讓所有使用者在任何瀏覽器下都完全一模一樣，特別是那些使用IE6的使用者。運用漸進式增強策略，可以確保讓那些使用者至少使用到你網站（或網路應用）的基本功能。

更多漸進增強的資料：

• 理解漸進增強（譯）

理解漸進增強（譯）
• Understanding Progressive Enhancement

• Progressive Enhancement With CSSProgressive Enhancement: What It Is, And How To Use It?

• Graceful Degradation vs. Progressive Enhancement

Pragmatic Progressive Enhancement - Why You Should Bother With It
使用自己的預設樣式（CSS Reset）

使用自己的預設樣式（CSS Reset）

每個瀏覽器都有各自不同的預設樣式，在你的樣式表之前使用預設樣式（CSS Reset）可以避免在之後編寫冗長的瀏覽器相容樣式。網路上有很多CSS Reset可供參考。

簡單CSS Reset範例：

body,p,ul,ol,li,h1,h2,h3,h4,h5,h6,form,fieldset,input,textarea, p,th,td {margin:0;padding:0;}

一些可供參考的CSS Resets：

• YUI CSS Reset

• Eric Meyer's Reset Reloaded

• ISS CSS Reset

使用JavaScript框架

如果你的網站使用了較多的JavaScript特效，建議使用JavaScript框架。大部分的js框架都相容了包括IE6在內的各種瀏覽器。可選的框架有很多，但一般能用一種框架實現的效果一定可以用另一種框架實現，所以你可以根據個人喜好來選擇合適的框架。

以下是一些常用的JavaScript框架：

• MooTools

• ProtoType

  with Scriptaculous

• Do >

Ext JS

• 強烈建議實用MooTools，但如果你是入門者，還是建議使用jQuery。

使用JavaScript模擬標準瀏覽器

現在有一些JavaScript來使IE模擬標準瀏覽器，如果你有較高比例的用戶使用IE6並且開啟了JavaScript ，可以考慮使用Dean Edwards

的

IE7 或類似的腳本。 譯者註：不建議使用這些腳本，因為這些「模擬」的實作往往會消耗大量的資源，IE本來就夠爛了。
如何在IE下調試頁面

在IE下調試頁面很麻煩，Firefox下的擴充程式Fire

bug

Web Developer Toolbar 都是很好用的工具，如果你想在IE或其他瀏覽器上使用firebug，可以用Firebug Lite。 在IE下有兩種最好的調試方法：IE Collection 和
IETester，而且都是免費的（雖然有一點點缺陷）。 IETester的開發者也提供了 DebugBar 這款IE外掛程式免費供個人使用，但商業用戶只可試用60天。  以上是IE6的BUG及修復 謂防患於未然的策略_HTML/Xhtml_網頁製作的內容，更多相關內容請關注PHP中文網（www.php.cn）！