悟道Web標(biāo)準(zhǔn)：讓W(xué)3C標(biāo)準(zhǔn)兼容終端
接著上一篇，統(tǒng)一思想，遵循標(biāo)準(zhǔn)。如何遵循標(biāo)準(zhǔn)，其實(shí)標(biāo)準(zhǔn)有很多，結(jié)構(gòu)標(biāo)準(zhǔn)，表現(xiàn)標(biāo)準(zhǔn)，行為標(biāo)準(zhǔn)。選擇標(biāo)準(zhǔn)規(guī)范，就優(yōu)先選擇W3C推薦的標(biāo)準(zhǔn)。
結(jié)構(gòu)標(biāo)準(zhǔn)可選項(xiàng)
看下維基百科的HTML推薦標(biāo)準(zhǔn)都有哪些：
http://zh.wikipedia.org/wiki/HTML#HTML
N多標(biāo)準(zhǔn)，建議選擇適合你公司和團(tuán)隊(duì)的標(biāo)準(zhǔn)，其實(shí)核心理念還是讓項(xiàng)目統(tǒng)一遵循一個(gè)標(biāo)準(zhǔn)，嚴(yán)格的XHTML是這樣的。
|
以下為引用的內(nèi)容： <?xml version="1.0" encoding="UTF-8"?> |
XHTML的媒體類型是application/xhtml+xml ，而不是被大多設(shè)備都識別的text/html。增加xml頭部聲明還會造成IE6的quirks模式?？偟脕碚f，不是通用性很強(qiáng)的標(biāo)準(zhǔn)，使用的時(shí)候需要舍棄W3C的一些說明，改良后的應(yīng)該是去掉xml聲明，去掉媒體類型是application/xhtml+xml。不要給你們團(tuán)隊(duì)的開發(fā)造成不必要的困擾。
|
以下為引用的內(nèi)容： <!DOCTYPE html |
我這里建議選擇XHTML1.0標(biāo)準(zhǔn)的過渡型，如果你覺得XHTML過于花俏，不適用，HTML4.0的嚴(yán)格型也是很好的選擇。HTML2.0已經(jīng)被HTML5所取代，貌似看起來HTML4還是更具有向后的延續(xù)性。
.
其實(shí)上面所說的，也就是讓W(xué)3C標(biāo)準(zhǔn)兼容終端，本應(yīng)該終端按照W3C規(guī)范來開發(fā)解析器，但是種種的原意，終端各持己見，置W3C標(biāo)準(zhǔn)于不顧，而用戶體驗(yàn)永遠(yuǎn)是第一位的。所以我們既然遵循標(biāo)準(zhǔn)，又要兼容終端。
我們不是標(biāo)準(zhǔn)的制定者，僅僅是實(shí)施者。就要考慮到項(xiàng)目的用戶群體的特性，使用哪個(gè)終端多一點(diǎn)，顯而易見，IE6的使用者仍然是大多數(shù)的。而且XHTML的嚴(yán)格定義方式不符合IE6的解析方式。通過權(quán)衡，即選擇了W3C的推薦標(biāo)準(zhǔn)，雖然不是最新的，也兼容了現(xiàn)有終端的情況。
廢話有點(diǎn)多了，概要的說明一下，選擇一個(gè)適合項(xiàng)目大多數(shù)用戶終端的標(biāo)準(zhǔn)，就HTML來說，4.0和xhtml1.0(改良后)都是不錯(cuò)的，但是要遵循HTML的結(jié)構(gòu)化和語義化的要求，標(biāo)簽必須小寫，閉合合理，嵌套正確，摒棄表現(xiàn)型標(biāo)記，結(jié)構(gòu)代碼和表現(xiàn)代碼分離。html1.0也可以編寫成xml結(jié)構(gòu)化的狀態(tài)，即時(shí)沒有xml聲明。
CSS是最頭疼的一塊，如果嚴(yán)格按照W3C的css2.1規(guī)范，是很難兼容到IE系列瀏覽器的，特別是IE5.5 IE6兩種，他們的解析和W3C相差甚遠(yuǎn)，所以CSS文件就必須進(jìn)入hack，一種是css自身的私有屬性和私有識別的代碼，一種是IE瀏覽器特有的條件注釋。細(xì)節(jié)就不多講了。
如何既遵循標(biāo)準(zhǔn)，有兼容瀏覽器。那就是使用符合標(biāo)準(zhǔn)或者近似符合的瀏覽器作為主要開發(fā)軟件，我建議安裝有firebug插件的firefox作為第一個(gè)調(diào)試工具，等界面完成后，再調(diào)試其他瀏覽器，通過csshack或者條件注釋，或者兩者混搭。
理想的CSS兼容方案是，IE8,firefox這類通過Acid2 測試的瀏覽器使用標(biāo)準(zhǔn)的CSS代碼，對沒有通過測試的(就是IE系列)使用條件注釋。例如：
|
以下為引用的內(nèi)容： <link rel="stylesheet" type="text/css" href="w3c.css" /> |
IE5.5的份額太少，可以考慮不兼容，兼容也主要是盒模型上的兼容。
理想的終究會存在很多現(xiàn)實(shí)的問題，比如IE的請求數(shù)過多，這是速度上的損失，代碼維護(hù)不方面，同一個(gè)頁面需要維護(hù)多個(gè)css文件，容易產(chǎn)生遺漏，避免這兩個(gè)因素，css hack是做好的方式，主樣式+私有樣式解決兼容問題。
針對IE，常見bug的處理，haslayout的觸發(fā)，放在標(biāo)準(zhǔn)CSS代碼的后面。比如：
|
以下為引用的內(nèi)容： .clearfix:after{content:"\0020"; display:block; height:0; clear:both;} |
以后的瀏覽器對CSS的處理都采用W3C css2.1規(guī)范為主，私有屬性為輔的策略，比如firefox的-moz-，IE8的-ms-，sefari和Chrome的-webkit-，Opera的-o-。
Javascript的標(biāo)準(zhǔn)兼容終端，我不是很清楚，基本的還可以看出，應(yīng)用W3C的DOM操作文檔樹，而不是IE的document.all，摒棄IE的Jscript和VBscript。而且JS是可以去判斷終端的，實(shí)例：
|
以下為引用的內(nèi)容： var ua = navigator.userAgent.toLowerCase(); |
通過終端的判斷，給IE開小灶，解決IE 的兼容問題。
|
以下為引用的內(nèi)容： if (_isIE6) { // IE6 |
DHTML的歷史遠(yuǎn)遠(yuǎn)大于現(xiàn)在所說的富客戶端，很多經(jīng)驗(yàn)組建都源自于早期的IE平臺上的DHTML，如何保持JS主體代碼的標(biāo)準(zhǔn)化和對IE系列的兼容，我自己還需要再積累積累。
最后，為什么很多團(tuán)隊(duì)要求將firefox作為開發(fā)環(huán)境，待代碼完成后再進(jìn)行IE系列的bug調(diào)試。就是基于這個(gè)思想，先按照W3C標(biāo)準(zhǔn)規(guī)范編碼，再處理對標(biāo)準(zhǔn)支持不好的瀏覽器的。這樣你才能理解為什么把IE的錯(cuò)誤解析成為bug，而且頁面工程師的教材也接近統(tǒng)一，那就是W3C的文檔，那是我們權(quán)威的教材。向后，終端都尊重了W3C標(biāo)準(zhǔn)，IE8就是很好的例子。
本文鏈接：http://www.blueidea.com/tech/web/2009/7055.asp
如對本文有疑問，請?zhí)峤坏浇涣髡搲瑥V大熱心網(wǎng)友會為你解答?。?點(diǎn)擊進(jìn)入論壇
