網(wǎng)站重構與Web標準設計
網(wǎng)站重構 & Web標準設計（相關(guān)知識）
前言
網(wǎng)站重構能夠實(shí)現加快網(wǎng)頁(yè)解析的速度，實(shí)現信息跨平臺的可用性以及更加良好的用戶(hù)體驗，網(wǎng)站重構以高效開(kāi)發(fā)與簡(jiǎn)單維護降低服務(wù)器成本，最重要的是它便于改版，實(shí)現與未來(lái)兼容。
Web標準就是實(shí)現網(wǎng)站重構的一種方法，所謂Web標準, Web標準并不是指某一個(gè)單一的標準，而是一系列標準的集合。一般指網(wǎng)站重構采用基于XHTML語(yǔ)言的網(wǎng)站設計標記語(yǔ)言，Web標準中典型的布局應用?！癉IV+CSS”。
優(yōu)秀網(wǎng)頁(yè)設計師
經(jīng)常有人會(huì )問(wèn)做為一個(gè)優(yōu)秀網(wǎng)頁(yè)設計師要具備哪些方面的知識以及技能？
1.掌握一款良好的圖形圖形處理軟件（例如：Photoshop，Fireworks ，AI...）
2.掌握可視化編輯工具或者編輯器（例如：TopStyle，Dreamweaver ，EditPlus...）
3.掌握最基本的實(shí)質(zhì)性知識，也就是網(wǎng)頁(yè)的三層結構Xhtml,CSS,Javascript(結構，表現，行為)
4.掌握網(wǎng)站據有分析策劃的能力
5.掌握具有美術(shù)的一些基礎配色知識最起碼不要讓網(wǎng)頁(yè)的顏色太難看
6.掌握一款網(wǎng)絡(luò )動(dòng)畫(huà)軟件（例如Flash）
如果你可以達到以上的要求，可以說(shuō)的上你算一個(gè)網(wǎng)頁(yè)設計師，不要認為一個(gè)網(wǎng)頁(yè)設計師只會(huì )用PS做出一張圖片然后用PS直接分割另存為html頁(yè)面的就是網(wǎng)頁(yè)設計師，一個(gè)會(huì )用Dreamweaver可視化軟件做出一個(gè)垃圾網(wǎng)站（傳統的table+gif技術(shù)實(shí)現的網(wǎng)站）的就叫網(wǎng)頁(yè)設計師。
身為一個(gè)網(wǎng)頁(yè)設計師接觸的知識和技術(shù)是非常多的，掌握幾款我們開(kāi)發(fā)效率提高的軟件固然很重要，但是最中要的并不是工具本身，而是我們學(xué)習工具駕馭工具的一種思想。
思想是工具的靈魂，就像我們的計算機軟件是計算機硬件的靈魂一樣，沒(méi)有了軟件，計算機的硬件即使再好也沒(méi)有任何作用，如同廢鐵，所以我們在學(xué)習的時(shí)候要明確我們的最終目是什么，我們要學(xué)的是這門(mén)技術(shù)的思想而不是去重視實(shí)現這門(mén)技術(shù)的一種應用工具。當然思想與工具都很重要，但是他們最大的區別在于，學(xué)會(huì )了思想我們可以選擇很多不同的工具來(lái)實(shí)現這門(mén)技術(shù)，例如我們用Dreamweaver，EditPlus，甚至記事本等都可以實(shí)現我們想要的技術(shù)，工具最大的作用在于可以提高我們的工作效率，這是工具最重要的作用。所以我們不要走錯的方向。
例如我們如果想處理一張圖片的時(shí)候我們如果沒(méi)有一些美術(shù)基礎我們怎么可能設計出好的作品呢，知識PS這個(gè)工具放在你的面前給你用，你會(huì )嗎，如果說(shuō)一個(gè)人連RGB，CMYK，色彩的三個(gè)屬性：色相，飽和度，明暗度的話(huà)你還這么去用PS，天空是藍色的你非要搞成黑色，你覺(jué)得合適嗎？
例如你要做一個(gè)動(dòng)畫(huà)你連最基礎動(dòng)畫(huà)是如何產(chǎn)生的原理都不懂你要這么去制作動(dòng)畫(huà)呢，就是你做出來(lái)了，有會(huì )不什么效果呢。
由此可見(jiàn)思想的重要性，我們無(wú)論在學(xué)習什么，主要要掌握最核心的思想，如果沒(méi)有學(xué)好思想工具在你面前就是廢物，沒(méi)有任何作用，如果我們能掌握核心思想在去駕馭工具為我所用，這樣才能達到事半功倍的效果。
掌握學(xué)習的思想
學(xué)習是一種思想，一種不斷思考，一種不斷實(shí)踐，一種不斷創(chuàng )新的過(guò)程……
學(xué)習沒(méi)有捷徑，只有勤奮，努力，實(shí)踐，思考……
如何學(xué)習Web知識
學(xué)習任何一門(mén)技能的時(shí)候，首先要明確思想，只有明確了思想才能夠少有很多彎路，初學(xué)者學(xué)習Web標準，首先就要明確一點(diǎn)，到底什么是Web標準，如果錯誤的理解了Web標準的思想，很難學(xué)好Web標準。
給初學(xué)者的建議：初學(xué)者很容易犯的錯誤就是把Web標準理解為Div+CSS，以為DIV的作用就是簡(jiǎn)單的替代表格去做表格以前做的事情，于是乎許多采用新技術(shù)的網(wǎng)站開(kāi)始了DIV+CSS制作網(wǎng)頁(yè)，當打開(kāi)頁(yè)面代碼的時(shí)候，看到整個(gè)頁(yè)面基本都是采用了DIV標簽，給每個(gè)DIV標簽都指定一個(gè)class，這是對Web標準的一種濫用方式。Web標準的思想是實(shí)現結構，表現，行為的分離，不只是簡(jiǎn)單的把table換成DIV，因為div+css只是應用在網(wǎng)站的大塊不去上，并不是所有的元素都是用Div標簽，嚴格的說(shuō)法應該是采用Xhtml+CSS對網(wǎng)站進(jìn)行重構，最終制作出符合Web標準的網(wǎng)站，如果要學(xué)好web標準的思想，首先要做的就是拋棄傳統的表格布局思想。那么接下來(lái)我就會(huì )給大家先講思想課，讓大家更好的了解究竟什么是web標準的思想。
DIV+CSS不等于Web標準
Web標準不是某一個(gè)標準，而是一系列標準的集合。網(wǎng)頁(yè)主要由三部分組成：
結構（Structure）
表現（Presentation）
行為（Behavior）
對應的標準也分三方面：結構化標準語(yǔ)言主要包括XHTML和XML，表現標準語(yǔ)言主要包括CSS，行為標準主要包括對象模型（如W3CDOM）、ECMAScript等。這些標準大部分由W3C起草和發(fā)布，也有一些是其他標準組織制訂的標準，比如ECMA（EuropeanComputer Manufacturers Association）的ECMAScript標準。
我們通過(guò)W3c技術(shù)架構可以看到Web標準是一系列標準的集合，我們在布局方面用到Xhtml+CSS，那麼有此可見(jiàn)DIV+CSS是根本不等于Web標準的。采用Xhtml+CSS對網(wǎng)站進(jìn)行制作，只是現階段一個(gè)良好的解決方案，當然也有其他的一些技術(shù)。
W3C（World Wide Web Consortium）
W3C組織是對網(wǎng)絡(luò )標準制定的一個(gè)非贏(yíng)利組織，像HTML、XHTML、CSS、XML的標準就是由W3C來(lái)定制。W3C會(huì )員（大約500名會(huì )員）包括生產(chǎn)技術(shù)產(chǎn)品及服務(wù)的廠(chǎng)商、內容供應商、團體用戶(hù)、研究實(shí)驗室、標準制定機構和政府部門(mén)，一起協(xié)同工作，致力在萬(wàn)維網(wǎng)發(fā)展方向上達成共識。
Web標準組織（W3C）于1998年發(fā)起，目的是說(shuō)服Netscape、Microsoft和其他瀏覽器生產(chǎn)商徹底支持標準。他采用從容進(jìn)行、堅持和策略性的方法，最終使得瀏覽器生產(chǎn)商同意引進(jìn)一系列標準。通過(guò)共同的標準協(xié)同工作，是Web 向前發(fā)展必需的觀(guān)點(diǎn)。
我們了解了以上幾點(diǎn)是很重要的，現在我們就明白了我們是在學(xué)習標準，那么是在學(xué)習誰(shuí)的標準呢，無(wú)可厚非我們是在學(xué)習W3C推薦的Web標準，而不是為了IE瀏覽器學(xué)的標準，注意是推薦，W3C組織是對網(wǎng)絡(luò )標準制定的一個(gè)非贏(yíng)利組織，他沒(méi)有強迫你一定要使用，雖然是推薦標準，但是已經(jīng)成為了全世界公認的標準，為什么呢，因為web方面的技術(shù)離不開(kāi)W3C，很多Web技術(shù)都是W3C研究出來(lái)的。
Netscape and Internet Explorer
早在1997年，有一個(gè)通用的慣例，Netscape瀏覽器使用Javascript，IE使用Jscript（一種類(lèi)似于Javasrcipt的腳本語(yǔ)言）。Javasrcipt只能運行在Netscape，而微軟的ActiveX和Jscript只能運行在IE。只能為不同的瀏覽器采用不同的代碼去適應，這些事情是為3.0版本瀏覽器做的，1997年下半年的時(shí)候，Netscape和IE都推出了4.0版本瀏覽器，他們各自吹噓自己的瀏覽器有強大的Dhtml（動(dòng)態(tài)的html），但他們的瀏覽器完全不兼容，更不用說(shuō)不知名的瀏覽器了，而且Netscape和IE跟他們3.0的版本也無(wú)法兼容，想讓自己的網(wǎng)站在幾個(gè)不同版本的瀏覽器中同時(shí)使用的話(huà)就要做幾個(gè)不同的版本，每個(gè)功能都要做幾個(gè)不同的版本去適應不同的瀏覽器，開(kāi)發(fā)成本至少增加了25%；所以一些開(kāi)發(fā)者限制他們的網(wǎng)站只適應其中一個(gè)版本的瀏覽器。而且網(wǎng)站隨時(shí)面臨著(zhù)過(guò)時(shí)的命運和被淘汰的怪圈。
在Web傳統網(wǎng)站的舊時(shí)代，Web非?；靵y，許多東西都沒(méi)有真正意義上的一個(gè)標準，當時(shí)的網(wǎng)景和IE的瀏覽器大戰就是個(gè)最好的例子，當時(shí)的瀏覽器沒(méi)有統一的標準，大家都各有自己私有的標準，加上當時(shí)的瀏覽器支持非常劣質(zhì)的CSS1.0，所以在當時(shí)沒(méi)有一個(gè)有效的方法可以解決瀏覽器之間的兼容性問(wèn)題，就是這個(gè)時(shí)候DavidSiegel利用Table和透明的GIF布局技術(shù)出現了，并引起了一片新的網(wǎng)站布局浪潮。也就是我們所說(shuō)的傳統網(wǎng)站。
看了這些我想大家應該了解為什么要遵循標準進(jìn)行開(kāi)發(fā)了吧，我們的日常生活中也一樣例如電視機的大小都有標準，我們的銀行卡也有一定標準，如果世界都是沒(méi)有一個(gè)相對的標準的話(huà)會(huì )變成什么樣，這個(gè)大家去思考。
瀏覽器內核
通常所謂的瀏覽器內核也就是瀏覽器所采用的渲染引擎，渲染引擎決定了瀏覽器如何顯示網(wǎng)頁(yè)的內容以及頁(yè)面的格式信息。不同的瀏覽器內核對網(wǎng)頁(yè)編寫(xiě)語(yǔ)法的解釋也有不同，因此同一網(wǎng)頁(yè)在不同的內核的瀏覽器里的渲染（顯示）效果也可能不同，這也是網(wǎng)頁(yè)編寫(xiě)者需要在不同內核的瀏覽器中測試網(wǎng)頁(yè)顯示效果的原因。
主流瀏覽器內核
Trident：IE瀏覽器使用的內核,該內核程序在1997年的IE4中首次被采用，是微軟在Mosaic代碼的基礎之上修改而來(lái)的，并沿用到目前的IE7。Trident實(shí)際上是一款開(kāi)放的內核，其接口內核設計的相當成熟，因此才有許多采用IE內核而非IE的瀏覽器涌現（如 Maxthon、TheWorld 、TT、GreenBrowser、AvantBrowser等）。
Geckos： Netcape6開(kāi)始采用的內核，后來(lái)的Mozilla FireFox也采用了該內核，Geckos的特點(diǎn)是代碼完全公開(kāi)，因此，其可開(kāi)發(fā)程度很高，全世界的程序員都可以為其編寫(xiě)代碼，增加功能。
Presto： 目前Opera采用的內核，該內核在2003年的Opera7中首次被使用，該款引擎的特點(diǎn)就是渲染速度的優(yōu)化達到了極致，也是目前公認網(wǎng)頁(yè)瀏覽速度最快的瀏覽器內核，然而代價(jià)是犧牲了網(wǎng)頁(yè)的兼容性。
Webkit：Safari瀏覽器使用的內核。Webkit引擎包含WebCore排版引擎及JavaScriptCore解析引擎，均是從KDE的KHTML及KJS引擎衍生而來(lái)，它們都是自由軟件，在GPL條約下授權，同時(shí)支持BSD系統的開(kāi)發(fā)。所以Webkit也是自由軟件，同時(shí)開(kāi)放源代碼。在安全方面不受IE、Firefox的制約，所以Safari瀏覽器還是比較安全的瀏覽器。(Google的Chrome瀏覽器也是采用Webkit)
注意，犧牲了網(wǎng)頁(yè)的兼容性是說(shuō)犧牲不好的網(wǎng)頁(yè)兼容，因為Opera瀏覽器以開(kāi)始就對標準支持的非常良好，所以對寫(xiě)法要求比較嚴格，那些不符合標準的網(wǎng)站在Opera下自然也就不能運行。
微軟屬下的MSN網(wǎng)站曾被指排擠Opera用者，迫使他們改用微軟產(chǎn)品。
2001年10月，在WindowsXP推出后不久，MSN即對主頁(yè)作出重大更新，Opera用者指無(wú)法進(jìn)入MSN主頁(yè)，微軟指“該主頁(yè)轉用了XHTML標準，Opera無(wú)法進(jìn)入是因為它不支持XHTML”，但Opera方面則反駁，指Opera瀏覽器更切合標準，并以W3CValidator證明，MSN的主頁(yè)并非使用正確的編碼，要求微軟“在指責其他人以前，請先看看自己是否尊重公開(kāi)標準”，并在網(wǎng)站有關(guān)的新聞稿頁(yè)面，另制作了一個(gè)標準 XHTML版本來(lái)“還擊”，IE6無(wú)法正確顯示，而Netscape6和Opera則可以。微軟有見(jiàn)于此，便停止排擠Opera用者，但隨后微軟也有在其主頁(yè)上“做手腳”，刻意對Opera及MozillaFirefox等用者使用錯誤的CSS，令MSN無(wú)法在其他瀏覽器上顯示
現代瀏覽器
瀏覽器兼容性
下面我們來(lái)看一下瀏覽器對css的兼容表
（弱弱的說(shuō)下，這上面的opera不是最新版本，opera粉絲們不要磚頭砸我 ）
通過(guò)以上的圖片我們可以大概看到各個(gè)瀏覽器對CSS支持的程度，可見(jiàn)IE瀏覽器的性能是最差的，當然IE也在慢慢向標準靠攏，最起碼IE7要比IE6和IE5好很多，有很多朋友會(huì )遇到一個(gè)問(wèn)題，為什么我的頁(yè)面效果在IE下正常了，在FF和OP其他瀏覽器中都不正常了，很簡(jiǎn)單，那就是你沒(méi)有符合標準，你首先選擇一個(gè)對標準本身就支持不好的瀏覽器，我們試著(zhù)想一下，用一個(gè)對標準支持不好的瀏覽器開(kāi)發(fā)標準，最終的結果就是在不標準的IE瀏覽器中正常了，其他符合Web標準對CSS支持良好的瀏覽器都不正常了，這種思路本身就是錯誤的，所以在我們開(kāi)發(fā)的時(shí)候首先要選擇一款符合標準的瀏覽器，例如firefox,opera,safari,ie7(ie瀏覽器在css支持上是這些瀏覽器中最差的).正常呢我們最起碼真確認我們做的是符合標準的，最后我們在通過(guò)一些辦法去修復那些對標準支持不好的瀏覽器IE6,這樣最終才能做到兼容的效果。
關(guān)于CSS hack
相信大多數朋友為了解決瀏覽器兼容的問(wèn)題，首先想到了css hack，很多css技術(shù)網(wǎng)站也在介紹csshack，這里我要提醒大家，我們做為只是了解下就可以，沒(méi)有必要深入，為什么呢，我來(lái)簡(jiǎn)單說(shuō)明下，現在瀏覽器基本對標準支持都非常好了，我們只要注意文檔的良好結構，基本上可以1個(gè)csshack都不去使用，因為我們不需要去考慮ie5了，ie6雖然說(shuō)對css支持不是很好，但是他畢竟支持css2，有些地方雖然不正確但是我們可以通過(guò)一些技巧對他進(jìn)行修復我們可以用ie特有的
<!--[if IE 6]>
<link href="css/layoutIE6.css" rel="stylesheet" type="text/css" />
<![endif]-->
條件注釋語(yǔ)句對ie6進(jìn)行修復，還有一些csshack告訴你如何修復mac版本的ie5的bug，這些都沒(méi)有必要了，因為ie在mac機器上早就停止開(kāi)發(fā)了，我們要了解技術(shù)是不斷更新的，以前流行的css hack在今天由于瀏覽器對標準支持良好我們完全可以?huà)仐壛?，就連瀏覽器官方都推薦大家不要去使用css hack。
瀏覽器的一些看法
很多人也在討論關(guān)于firefox和其他一些瀏覽器的問(wèn)題，說(shuō)這些瀏覽器很垃圾很不好，在ie下正常的效果，在firefox那是因為你亂用的web標準，是你的問(wèn)題不是瀏覽器的問(wèn)題，那是因為你拿ie錯誤的bug理解成對的，把本身對web標準支持好的瀏覽器當成錯的，更有寫(xiě)人說(shuō)了Firefox用的人不到1%或這10%，我們不需要做管他們，做為一個(gè)設計師和開(kāi)發(fā)人員，我只能說(shuō)你說(shuō)的話(huà)非常不負責，你可以去跑到你老板哪里說(shuō)老板我們1%-10%的潛在用戶(hù)可以不要了好嗎，你的老板會(huì )笑這跟你說(shuō)：行，不就百分之10%，不要就不要了。如果可以你就可以不考慮了，再說(shuō)了現在firefox也不至10%吧，我以自己的網(wǎng)站為例，2008-06-17到2008-06-30用firefox訪(fǎng)問(wèn)我網(wǎng)站的用戶(hù)占了21%，7月分到現在是占有了19%，有時(shí)間聽(tīng)別人說(shuō)不如自己去測試下就清楚了，不要把自己的能力不足找一些理由說(shuō)瀏覽器有問(wèn)題所以我們不要支持，當然ie也是用的瀏覽器，因為他比較流行所以bug會(huì )很快被找出來(lái)，如果是普通用戶(hù)的話(huà)，他們要的是服務(wù)，選擇什么樣的瀏覽器無(wú)所謂只要能達到我的要求，我們不會(huì )去管瀏覽器是什么東西，國內的許國網(wǎng)站不支持firefox，opera以及其他的瀏覽器，那不是其他瀏覽器的問(wèn)題，那是開(kāi)發(fā)人員的問(wèn)題，國外基本都支持符合標準的瀏覽器，做為開(kāi)發(fā)人員如果說(shuō)其他的瀏覽器不好，那他真的就是流氓了，還有要說(shuō)明一點(diǎn)許多人用的遨游，tt，世界之窗那不算是瀏覽器，那只是ie瀏覽器的皮膚和外加一些插件調用用ie的內核，沒(méi)有ie這些都用不了，國人目前還沒(méi)有自己的瀏覽器，ie7現在也越來(lái)越標準了，但是還是沒(méi)有完全支持標準，希望以后會(huì )越來(lái)越好。
希望我的這篇文章可以給大家帶來(lái)幫助，大家覺(jué)得有問(wèn)題的地方可以隨時(shí)跟我交流，多多支持標準瀏覽器?。?！
網(wǎng)站重構能夠實(shí)現加快網(wǎng)頁(yè)解析的速度，實(shí)現信息跨平臺的可用性以及更加良好的用戶(hù)體驗，網(wǎng)站重構以高效開(kāi)發(fā)與簡(jiǎn)單維護降低服務(wù)器成本，最重要的是它便于改版，實(shí)現與未來(lái)兼容。
Web標準就是實(shí)現網(wǎng)站重構的一種方法，所謂Web標準, Web標準并不是指某一個(gè)單一的標準，而是一系列標準的集合。一般指網(wǎng)站重構采用基于XHTML語(yǔ)言的網(wǎng)站設計標記語(yǔ)言，Web標準中典型的布局應用?！癉IV+CSS”。
優(yōu)秀網(wǎng)頁(yè)設計師
經(jīng)常有人會(huì )問(wèn)做為一個(gè)優(yōu)秀網(wǎng)頁(yè)設計師要具備哪些方面的知識以及技能？
1.掌握一款良好的圖形圖形處理軟件（例如：Photoshop，Fireworks ，AI...）
2.掌握可視化編輯工具或者編輯器（例如：TopStyle，Dreamweaver ，EditPlus...）
3.掌握最基本的實(shí)質(zhì)性知識，也就是網(wǎng)頁(yè)的三層結構Xhtml,CSS,Javascript(結構，表現，行為)
4.掌握網(wǎng)站據有分析策劃的能力
5.掌握具有美術(shù)的一些基礎配色知識最起碼不要讓網(wǎng)頁(yè)的顏色太難看
6.掌握一款網(wǎng)絡(luò )動(dòng)畫(huà)軟件（例如Flash）
如果你可以達到以上的要求，可以說(shuō)的上你算一個(gè)網(wǎng)頁(yè)設計師，不要認為一個(gè)網(wǎng)頁(yè)設計師只會(huì )用PS做出一張圖片然后用PS直接分割另存為html頁(yè)面的就是網(wǎng)頁(yè)設計師，一個(gè)會(huì )用Dreamweaver可視化軟件做出一個(gè)垃圾網(wǎng)站（傳統的table+gif技術(shù)實(shí)現的網(wǎng)站）的就叫網(wǎng)頁(yè)設計師。
身為一個(gè)網(wǎng)頁(yè)設計師接觸的知識和技術(shù)是非常多的，掌握幾款我們開(kāi)發(fā)效率提高的軟件固然很重要，但是最中要的并不是工具本身，而是我們學(xué)習工具駕馭工具的一種思想。
思想是工具的靈魂，就像我們的計算機軟件是計算機硬件的靈魂一樣，沒(méi)有了軟件，計算機的硬件即使再好也沒(méi)有任何作用，如同廢鐵，所以我們在學(xué)習的時(shí)候要明確我們的最終目是什么，我們要學(xué)的是這門(mén)技術(shù)的思想而不是去重視實(shí)現這門(mén)技術(shù)的一種應用工具。當然思想與工具都很重要，但是他們最大的區別在于，學(xué)會(huì )了思想我們可以選擇很多不同的工具來(lái)實(shí)現這門(mén)技術(shù)，例如我們用Dreamweaver，EditPlus，甚至記事本等都可以實(shí)現我們想要的技術(shù)，工具最大的作用在于可以提高我們的工作效率，這是工具最重要的作用。所以我們不要走錯的方向。
例如我們如果想處理一張圖片的時(shí)候我們如果沒(méi)有一些美術(shù)基礎我們怎么可能設計出好的作品呢，知識PS這個(gè)工具放在你的面前給你用，你會(huì )嗎，如果說(shuō)一個(gè)人連RGB，CMYK，色彩的三個(gè)屬性：色相，飽和度，明暗度的話(huà)你還這么去用PS，天空是藍色的你非要搞成黑色，你覺(jué)得合適嗎？
例如你要做一個(gè)動(dòng)畫(huà)你連最基礎動(dòng)畫(huà)是如何產(chǎn)生的原理都不懂你要這么去制作動(dòng)畫(huà)呢，就是你做出來(lái)了，有會(huì )不什么效果呢。
由此可見(jiàn)思想的重要性，我們無(wú)論在學(xué)習什么，主要要掌握最核心的思想，如果沒(méi)有學(xué)好思想工具在你面前就是廢物，沒(méi)有任何作用，如果我們能掌握核心思想在去駕馭工具為我所用，這樣才能達到事半功倍的效果。
掌握學(xué)習的思想
學(xué)習是一種思想，一種不斷思考，一種不斷實(shí)踐，一種不斷創(chuàng )新的過(guò)程……
學(xué)習沒(méi)有捷徑，只有勤奮，努力，實(shí)踐，思考……
如何學(xué)習Web知識
學(xué)習任何一門(mén)技能的時(shí)候，首先要明確思想，只有明確了思想才能夠少有很多彎路，初學(xué)者學(xué)習Web標準，首先就要明確一點(diǎn)，到底什么是Web標準，如果錯誤的理解了Web標準的思想，很難學(xué)好Web標準。
給初學(xué)者的建議：初學(xué)者很容易犯的錯誤就是把Web標準理解為Div+CSS，以為DIV的作用就是簡(jiǎn)單的替代表格去做表格以前做的事情，于是乎許多采用新技術(shù)的網(wǎng)站開(kāi)始了DIV+CSS制作網(wǎng)頁(yè)，當打開(kāi)頁(yè)面代碼的時(shí)候，看到整個(gè)頁(yè)面基本都是采用了DIV標簽，給每個(gè)DIV標簽都指定一個(gè)class，這是對Web標準的一種濫用方式。Web標準的思想是實(shí)現結構，表現，行為的分離，不只是簡(jiǎn)單的把table換成DIV，因為div+css只是應用在網(wǎng)站的大塊不去上，并不是所有的元素都是用Div標簽，嚴格的說(shuō)法應該是采用Xhtml+CSS對網(wǎng)站進(jìn)行重構，最終制作出符合Web標準的網(wǎng)站，如果要學(xué)好web標準的思想，首先要做的就是拋棄傳統的表格布局思想。那么接下來(lái)我就會(huì )給大家先講思想課，讓大家更好的了解究竟什么是web標準的思想。
DIV+CSS不等于Web標準
Web標準不是某一個(gè)標準，而是一系列標準的集合。網(wǎng)頁(yè)主要由三部分組成：
結構（Structure）
表現（Presentation）
行為（Behavior）
對應的標準也分三方面：結構化標準語(yǔ)言主要包括XHTML和XML，表現標準語(yǔ)言主要包括CSS，行為標準主要包括對象模型（如W3CDOM）、ECMAScript等。這些標準大部分由W3C起草和發(fā)布，也有一些是其他標準組織制訂的標準，比如ECMA（EuropeanComputer Manufacturers Association）的ECMAScript標準。
我們通過(guò)W3c技術(shù)架構可以看到Web標準是一系列標準的集合，我們在布局方面用到Xhtml+CSS，那麼有此可見(jiàn)DIV+CSS是根本不等于Web標準的。采用Xhtml+CSS對網(wǎng)站進(jìn)行制作，只是現階段一個(gè)良好的解決方案，當然也有其他的一些技術(shù)。
W3C（World Wide Web Consortium）
W3C組織是對網(wǎng)絡(luò )標準制定的一個(gè)非贏(yíng)利組織，像HTML、XHTML、CSS、XML的標準就是由W3C來(lái)定制。W3C會(huì )員（大約500名會(huì )員）包括生產(chǎn)技術(shù)產(chǎn)品及服務(wù)的廠(chǎng)商、內容供應商、團體用戶(hù)、研究實(shí)驗室、標準制定機構和政府部門(mén)，一起協(xié)同工作，致力在萬(wàn)維網(wǎng)發(fā)展方向上達成共識。
Web標準組織（W3C）于1998年發(fā)起，目的是說(shuō)服Netscape、Microsoft和其他瀏覽器生產(chǎn)商徹底支持標準。他采用從容進(jìn)行、堅持和策略性的方法，最終使得瀏覽器生產(chǎn)商同意引進(jìn)一系列標準。通過(guò)共同的標準協(xié)同工作，是Web 向前發(fā)展必需的觀(guān)點(diǎn)。
我們了解了以上幾點(diǎn)是很重要的，現在我們就明白了我們是在學(xué)習標準，那么是在學(xué)習誰(shuí)的標準呢，無(wú)可厚非我們是在學(xué)習W3C推薦的Web標準，而不是為了IE瀏覽器學(xué)的標準，注意是推薦，W3C組織是對網(wǎng)絡(luò )標準制定的一個(gè)非贏(yíng)利組織，他沒(méi)有強迫你一定要使用，雖然是推薦標準，但是已經(jīng)成為了全世界公認的標準，為什么呢，因為web方面的技術(shù)離不開(kāi)W3C，很多Web技術(shù)都是W3C研究出來(lái)的。
Netscape and Internet Explorer
早在1997年，有一個(gè)通用的慣例，Netscape瀏覽器使用Javascript，IE使用Jscript（一種類(lèi)似于Javasrcipt的腳本語(yǔ)言）。Javasrcipt只能運行在Netscape，而微軟的ActiveX和Jscript只能運行在IE。只能為不同的瀏覽器采用不同的代碼去適應，這些事情是為3.0版本瀏覽器做的，1997年下半年的時(shí)候，Netscape和IE都推出了4.0版本瀏覽器，他們各自吹噓自己的瀏覽器有強大的Dhtml（動(dòng)態(tài)的html），但他們的瀏覽器完全不兼容，更不用說(shuō)不知名的瀏覽器了，而且Netscape和IE跟他們3.0的版本也無(wú)法兼容，想讓自己的網(wǎng)站在幾個(gè)不同版本的瀏覽器中同時(shí)使用的話(huà)就要做幾個(gè)不同的版本，每個(gè)功能都要做幾個(gè)不同的版本去適應不同的瀏覽器，開(kāi)發(fā)成本至少增加了25%；所以一些開(kāi)發(fā)者限制他們的網(wǎng)站只適應其中一個(gè)版本的瀏覽器。而且網(wǎng)站隨時(shí)面臨著(zhù)過(guò)時(shí)的命運和被淘汰的怪圈。
在Web傳統網(wǎng)站的舊時(shí)代，Web非?；靵y，許多東西都沒(méi)有真正意義上的一個(gè)標準，當時(shí)的網(wǎng)景和IE的瀏覽器大戰就是個(gè)最好的例子，當時(shí)的瀏覽器沒(méi)有統一的標準，大家都各有自己私有的標準，加上當時(shí)的瀏覽器支持非常劣質(zhì)的CSS1.0，所以在當時(shí)沒(méi)有一個(gè)有效的方法可以解決瀏覽器之間的兼容性問(wèn)題，就是這個(gè)時(shí)候DavidSiegel利用Table和透明的GIF布局技術(shù)出現了，并引起了一片新的網(wǎng)站布局浪潮。也就是我們所說(shuō)的傳統網(wǎng)站。
看了這些我想大家應該了解為什么要遵循標準進(jìn)行開(kāi)發(fā)了吧，我們的日常生活中也一樣例如電視機的大小都有標準，我們的銀行卡也有一定標準，如果世界都是沒(méi)有一個(gè)相對的標準的話(huà)會(huì )變成什么樣，這個(gè)大家去思考。
瀏覽器內核
通常所謂的瀏覽器內核也就是瀏覽器所采用的渲染引擎，渲染引擎決定了瀏覽器如何顯示網(wǎng)頁(yè)的內容以及頁(yè)面的格式信息。不同的瀏覽器內核對網(wǎng)頁(yè)編寫(xiě)語(yǔ)法的解釋也有不同，因此同一網(wǎng)頁(yè)在不同的內核的瀏覽器里的渲染（顯示）效果也可能不同，這也是網(wǎng)頁(yè)編寫(xiě)者需要在不同內核的瀏覽器中測試網(wǎng)頁(yè)顯示效果的原因。
主流瀏覽器內核
Trident：IE瀏覽器使用的內核,該內核程序在1997年的IE4中首次被采用，是微軟在Mosaic代碼的基礎之上修改而來(lái)的，并沿用到目前的IE7。Trident實(shí)際上是一款開(kāi)放的內核，其接口內核設計的相當成熟，因此才有許多采用IE內核而非IE的瀏覽器涌現（如 Maxthon、TheWorld 、TT、GreenBrowser、AvantBrowser等）。
Geckos： Netcape6開(kāi)始采用的內核，后來(lái)的Mozilla FireFox也采用了該內核，Geckos的特點(diǎn)是代碼完全公開(kāi)，因此，其可開(kāi)發(fā)程度很高，全世界的程序員都可以為其編寫(xiě)代碼，增加功能。
Presto： 目前Opera采用的內核，該內核在2003年的Opera7中首次被使用，該款引擎的特點(diǎn)就是渲染速度的優(yōu)化達到了極致，也是目前公認網(wǎng)頁(yè)瀏覽速度最快的瀏覽器內核，然而代價(jià)是犧牲了網(wǎng)頁(yè)的兼容性。
Webkit：Safari瀏覽器使用的內核。Webkit引擎包含WebCore排版引擎及JavaScriptCore解析引擎，均是從KDE的KHTML及KJS引擎衍生而來(lái)，它們都是自由軟件，在GPL條約下授權，同時(shí)支持BSD系統的開(kāi)發(fā)。所以Webkit也是自由軟件，同時(shí)開(kāi)放源代碼。在安全方面不受IE、Firefox的制約，所以Safari瀏覽器還是比較安全的瀏覽器。(Google的Chrome瀏覽器也是采用Webkit)
注意，犧牲了網(wǎng)頁(yè)的兼容性是說(shuō)犧牲不好的網(wǎng)頁(yè)兼容，因為Opera瀏覽器以開(kāi)始就對標準支持的非常良好，所以對寫(xiě)法要求比較嚴格，那些不符合標準的網(wǎng)站在Opera下自然也就不能運行。
微軟屬下的MSN網(wǎng)站曾被指排擠Opera用者，迫使他們改用微軟產(chǎn)品。
2001年10月，在WindowsXP推出后不久，MSN即對主頁(yè)作出重大更新，Opera用者指無(wú)法進(jìn)入MSN主頁(yè)，微軟指“該主頁(yè)轉用了XHTML標準，Opera無(wú)法進(jìn)入是因為它不支持XHTML”，但Opera方面則反駁，指Opera瀏覽器更切合標準，并以W3CValidator證明，MSN的主頁(yè)并非使用正確的編碼，要求微軟“在指責其他人以前，請先看看自己是否尊重公開(kāi)標準”，并在網(wǎng)站有關(guān)的新聞稿頁(yè)面，另制作了一個(gè)標準 XHTML版本來(lái)“還擊”，IE6無(wú)法正確顯示，而Netscape6和Opera則可以。微軟有見(jiàn)于此，便停止排擠Opera用者，但隨后微軟也有在其主頁(yè)上“做手腳”，刻意對Opera及MozillaFirefox等用者使用錯誤的CSS，令MSN無(wú)法在其他瀏覽器上顯示
現代瀏覽器
瀏覽器兼容性
下面我們來(lái)看一下瀏覽器對css的兼容表
（弱弱的說(shuō)下，這上面的opera不是最新版本，opera粉絲們不要磚頭砸我 ）
通過(guò)以上的圖片我們可以大概看到各個(gè)瀏覽器對CSS支持的程度，可見(jiàn)IE瀏覽器的性能是最差的，當然IE也在慢慢向標準靠攏，最起碼IE7要比IE6和IE5好很多，有很多朋友會(huì )遇到一個(gè)問(wèn)題，為什么我的頁(yè)面效果在IE下正常了，在FF和OP其他瀏覽器中都不正常了，很簡(jiǎn)單，那就是你沒(méi)有符合標準，你首先選擇一個(gè)對標準本身就支持不好的瀏覽器，我們試著(zhù)想一下，用一個(gè)對標準支持不好的瀏覽器開(kāi)發(fā)標準，最終的結果就是在不標準的IE瀏覽器中正常了，其他符合Web標準對CSS支持良好的瀏覽器都不正常了，這種思路本身就是錯誤的，所以在我們開(kāi)發(fā)的時(shí)候首先要選擇一款符合標準的瀏覽器，例如firefox,opera,safari,ie7(ie瀏覽器在css支持上是這些瀏覽器中最差的).正常呢我們最起碼真確認我們做的是符合標準的，最后我們在通過(guò)一些辦法去修復那些對標準支持不好的瀏覽器IE6,這樣最終才能做到兼容的效果。
關(guān)于CSS hack
相信大多數朋友為了解決瀏覽器兼容的問(wèn)題，首先想到了css hack，很多css技術(shù)網(wǎng)站也在介紹csshack，這里我要提醒大家，我們做為只是了解下就可以，沒(méi)有必要深入，為什么呢，我來(lái)簡(jiǎn)單說(shuō)明下，現在瀏覽器基本對標準支持都非常好了，我們只要注意文檔的良好結構，基本上可以1個(gè)csshack都不去使用，因為我們不需要去考慮ie5了，ie6雖然說(shuō)對css支持不是很好，但是他畢竟支持css2，有些地方雖然不正確但是我們可以通過(guò)一些技巧對他進(jìn)行修復我們可以用ie特有的
<!--[if IE 6]>
<link href="css/layoutIE6.css" rel="stylesheet" type="text/css" />
<![endif]-->
條件注釋語(yǔ)句對ie6進(jìn)行修復，還有一些csshack告訴你如何修復mac版本的ie5的bug，這些都沒(méi)有必要了，因為ie在mac機器上早就停止開(kāi)發(fā)了，我們要了解技術(shù)是不斷更新的，以前流行的css hack在今天由于瀏覽器對標準支持良好我們完全可以?huà)仐壛?，就連瀏覽器官方都推薦大家不要去使用css hack。
瀏覽器的一些看法
很多人也在討論關(guān)于firefox和其他一些瀏覽器的問(wèn)題，說(shuō)這些瀏覽器很垃圾很不好，在ie下正常的效果，在firefox那是因為你亂用的web標準，是你的問(wèn)題不是瀏覽器的問(wèn)題，那是因為你拿ie錯誤的bug理解成對的，把本身對web標準支持好的瀏覽器當成錯的，更有寫(xiě)人說(shuō)了Firefox用的人不到1%或這10%，我們不需要做管他們，做為一個(gè)設計師和開(kāi)發(fā)人員，我只能說(shuō)你說(shuō)的話(huà)非常不負責，你可以去跑到你老板哪里說(shuō)老板我們1%-10%的潛在用戶(hù)可以不要了好嗎，你的老板會(huì )笑這跟你說(shuō)：行，不就百分之10%，不要就不要了。如果可以你就可以不考慮了，再說(shuō)了現在firefox也不至10%吧，我以自己的網(wǎng)站為例，2008-06-17到2008-06-30用firefox訪(fǎng)問(wèn)我網(wǎng)站的用戶(hù)占了21%，7月分到現在是占有了19%，有時(shí)間聽(tīng)別人說(shuō)不如自己去測試下就清楚了，不要把自己的能力不足找一些理由說(shuō)瀏覽器有問(wèn)題所以我們不要支持，當然ie也是用的瀏覽器，因為他比較流行所以bug會(huì )很快被找出來(lái)，如果是普通用戶(hù)的話(huà)，他們要的是服務(wù)，選擇什么樣的瀏覽器無(wú)所謂只要能達到我的要求，我們不會(huì )去管瀏覽器是什么東西，國內的許國網(wǎng)站不支持firefox，opera以及其他的瀏覽器，那不是其他瀏覽器的問(wèn)題，那是開(kāi)發(fā)人員的問(wèn)題，國外基本都支持符合標準的瀏覽器，做為開(kāi)發(fā)人員如果說(shuō)其他的瀏覽器不好，那他真的就是流氓了，還有要說(shuō)明一點(diǎn)許多人用的遨游，tt，世界之窗那不算是瀏覽器，那只是ie瀏覽器的皮膚和外加一些插件調用用ie的內核，沒(méi)有ie這些都用不了，國人目前還沒(méi)有自己的瀏覽器，ie7現在也越來(lái)越標準了，但是還是沒(méi)有完全支持標準，希望以后會(huì )越來(lái)越好。
希望我的這篇文章可以給大家帶來(lái)幫助，大家覺(jué)得有問(wèn)題的地方可以隨時(shí)跟我交流，多多支持標準瀏覽器?。?！
