在使用XHTML CSS制作標準化的界面原型的時候，我覺得需要把握兩個原則：

　　1.良好的語義化的結(jié)構(gòu)描述

　　2.結(jié)合CSS，實現(xiàn)最大限度的表現(xiàn)與數(shù)據(jù)相分離

　　這兩個要素其實也是WEB標準化的意義所在，�？吹揭恍┲谱鲙熤粸閷崿F(xiàn)而實現(xiàn)，思路還是在沿襲Table時代的思路，這已經(jīng)背棄了WEB標準化的原則。

　　一個有著良好的語義化描述的結(jié)構(gòu)，應(yīng)該就是一個結(jié)構(gòu)良好的XML，理想的情況下，除了數(shù)據(jù)，不應(yīng)該再出現(xiàn)任何的冗余（當然在XHTML中，完全做到?jīng)]有冗余不太可能）。所有的描述應(yīng)該基于語義，例如結(jié)構(gòu)的劃分，ID的定義，偽類的建立等等。一個良好的結(jié)構(gòu)或許會占用你更多的思考時間，或許也會增加你實現(xiàn)的難度，但它帶來的極強的可讀性和更好的擴展性將讓你獲益匪淺，同時實際上也降低了維護的成本，長遠看，也為跨各種瀏覽終端做了鋪墊。

　　具體舉例來說，假如你在ID定義中使用了“Left”，“Right”諸如此類的詞語，你已經(jīng)在不知不覺中犯錯誤了，或許某一天你的界面布局會做一個“乾坤大挪移”，那時候“Left”或“Right”的定義還有何意義？同理，“Red”，“Size12” 等等，在語義描述中，應(yīng)該都屬于杜絕使用的詞語。

　　假如你的界面布局中有一條分隔線，你會怎么做？或許你會使用<div class="line"></div>這樣的寫法，實際上，為基于表現(xiàn)的元素建立標簽是錯誤的，你應(yīng)該巧妙的將它用于內(nèi)容所在的容器上，具體實現(xiàn)方法不再闡述。

　　甚至有時候，為了保持一個良好的結(jié)構(gòu)，同時要實現(xiàn)一些比較復(fù)雜的交互方式，比如滑動門效果，我們需要將種種復(fù)雜的行為都封裝到JavaScript文件中。在界面元素上寫onmouseover等事件是不可取的，因為這樣會破壞良好的語義結(jié)構(gòu)，同時也限制了界面的可擴展性，事實上，你可以很巧妙的將它們統(tǒng)統(tǒng)封裝到JavaScript中去，這并不太難。繁雜的工作總要有人做，那就交給Javascript去做吧，反正它的使命其實就是這樣的。

　　假如你已經(jīng)建立了一個結(jié)構(gòu)良好的XHTML文檔，為它書寫對應(yīng)的CSS也不是難事，CSS更多依靠的是技巧，而良好的語義結(jié)構(gòu)是需要你來思考的。

　　本文作者：Richbox