|
剛開始接受WEB標(biāo)準(zhǔn)是在2004年的6月份，那時(shí)經(jīng)典里有一些高手們正在討論一個(gè)新東西。當(dāng)時(shí)叫什么我不清楚，反正不叫DIV+CSS，只是覺得挺有意思的，就進(jìn)去看看。發(fā)現(xiàn)高手們談的不是很明白，當(dāng)時(shí)自己HTML代碼都認(rèn)識不全的，只會(huì)用DW(Dreamweaver簡寫，下同)。只是看看高手們發(fā)的一些國外的作品，覺得很漂亮。但是由于當(dāng)時(shí)自己對HTML的不熟悉也并沒有立刻進(jìn)入學(xué)習(xí)。但是開始了解WEB標(biāo)準(zhǔn)的一些優(yōu)點(diǎn)了，而最吸引我的就是那種HTML不用動(dòng)，只需要更新CSS就能把網(wǎng)站變成另一個(gè)樣子。我是個(gè)設(shè)計(jì)師，程序的美妙我是不能理解的，但是這個(gè)換膚的特性卻深深的吸引我了。
正式開始學(xué)習(xí)是在九月份的時(shí)候。我采用了局部應(yīng)用法，也就是說網(wǎng)頁的大部分依然使用表格，只在局部采用CSS來定義樣式，通過這樣的方式我先了解了CSS的一些特性。但是只用了很少的CSS功能。也只局限于文字上的一些應(yīng)用。對于布局，大面積的布局根本沒有涉及。正是由于這樣的局部應(yīng)用法，提升了我的信心，并且?guī)椭宋以鷮?shí)了基本，因?yàn)槟抢镂议_始練習(xí)看HTML代碼了。
后來我已經(jīng)不滿足于這種局部的應(yīng)用了，所以我希望全局的應(yīng)用，但是當(dāng)時(shí)國內(nèi)根本沒有什么相關(guān)的資料可查，有一些高手翻譯的文檔基本上還是理論層面上的，根本不起什么作用。但是這些問題并不大，因?yàn)槲覍W(xué)習(xí)網(wǎng)頁就是從拆別人的網(wǎng)頁開始的，原來是在DW中拆可看到的格式，現(xiàn)在在記事本中拆代碼。我想問題不大，那里我就必需要找到一個(gè)全世界做得最好的WEB標(biāo)準(zhǔn)網(wǎng)站來拆，當(dāng)時(shí)一直在看Dave Shea 的禪意花園的一些翻譯過來的中文資料，其中看到Dave非常推崇StopDesign的作者Douglas Bowman我想Dave這么推崇他，我想他的網(wǎng)站必然可以算是當(dāng)時(shí)世界上最好的WEB標(biāo)準(zhǔn)站點(diǎn)了。事實(shí)上等我拆看他的代碼時(shí)發(fā)現(xiàn)，他真的非常牛。直到現(xiàn)在有很多代碼都是我所不能理解的。
榜樣找到了，下面就是拆了，想要把他的網(wǎng)站代碼下載下來沒問題，關(guān)健是怎么樣去分析。一開始我把他的代碼分成了兩個(gè)部分，一個(gè)是HTML結(jié)構(gòu)，一個(gè)是CSS樣式。分別打印出來。一開始我先看的是他的HTML結(jié)構(gòu)，他的HTML結(jié)構(gòu)寫得非常的嚴(yán)謹(jǐn)，我現(xiàn)在的結(jié)構(gòu)思路基本上是依據(jù)StopDesign結(jié)構(gòu)改變的。主要是研究他是怎么劃分的，然后還研究了他的命名，我現(xiàn)在的命名與他的命名不一樣，我采用了一些編程人員使用的命名標(biāo)準(zhǔn)。能過研究HTML代碼絕對會(huì)讓你有很大的進(jìn)步。這一步非常的重要。
當(dāng)結(jié)構(gòu)基本上懂了之后，就開始讀他的CSS代碼，一開始就是單純的讀CSS關(guān)鍵是看高手是怎么寫代碼的。并且不同的CSS文件之間的關(guān)系，以及一些CSS Hack的東西。但是單純的看是沒用的，還需要對應(yīng)HTML來理解，不然根本不能完全理解CSS的作用。那要怎么樣對應(yīng)HTML來理解呢。我的辦法還是一個(gè)字“拆”。怎么拆呢，我先把他們還原成為一個(gè)正常的樣式。然后為了弄明白一句CSS的意思，我就把這句CSS刪除然后看效果。如果刪除后還是沒出現(xiàn)預(yù)料的變化，那我就會(huì)再查找一下，倒底是怎么回事。有時(shí)還會(huì)自己去改動(dòng)，設(shè)置來看效。也就是在這樣的拆拆改改中就基本上知道了WEB標(biāo)準(zhǔn)的一些技巧。
正在學(xué)習(xí)之中公司要去接個(gè)項(xiàng)目，是個(gè)政府項(xiàng)目。當(dāng)時(shí)記得好像是十一月份了，為了拿到這個(gè)項(xiàng)目我開始用最迷人的換膚特性去引誘我的客戶，果然客戶被這種特性深深的吸引，并且我告訴他們，通過這種方式的構(gòu)建在改版時(shí)可以節(jié)約大約百分之三十到百分之四十的費(fèi)用。最終我們拿到了這個(gè)項(xiàng)目當(dāng)然價(jià)格不菲，開發(fā)周期也破天荒的達(dá)到了兩個(gè)月之久。錢有了，時(shí)間也有了。下面我要做的就是如何為客戶實(shí)現(xiàn)這些，與是我開始了我非常大膽的舉動(dòng)，我要用WEB標(biāo)準(zhǔn)來開發(fā)這個(gè)項(xiàng)目，于是我開始了結(jié)構(gòu)的策劃，CSS的預(yù)想。依據(jù)設(shè)計(jì)稿，我不斷的修改原來的結(jié)構(gòu)，不斷的修改CSS，同時(shí)還要應(yīng)對IE5的瀏覽器，工作中也出現(xiàn)過解決不了的問題，最后我還去修改了設(shè)計(jì)稿。使之能更容易用WEB標(biāo)準(zhǔn)開發(fā)。
通過不斷的努力，我第一個(gè)WEB標(biāo)準(zhǔn)的網(wǎng)站就這樣完成了，雖然沒辦法通過驗(yàn)證，但是換膚的特性是絕對沒問題的，并且可以適合IE5~IE6，F(xiàn)irefox等瀏覽器。
以上是我從一無所知到，基本掌握這樣技術(shù)的過程，雖然也有很多不是沒說清楚，但是有一點(diǎn)，學(xué)標(biāo)準(zhǔn)需要非常的毅力，因?yàn)槟銜?huì)遇到很多困難，有時(shí)你會(huì)覺得學(xué)不下去，但是要學(xué)會(huì)想辦法解決問題才能讓你沉到更多的知識。希望以上的文字能讓大家有所收獲。
原文地址：http://www.andymao.com/andy/post/58.html
經(jīng)典論壇討論：http://bbs.blueidea.com/thread-2681081-1-3.html
出處：藍(lán)色理想
責(zé)任編輯：moby
◎進(jìn)入論壇網(wǎng)站綜合、網(wǎng)頁制作版塊參加討論
|
