XHTML網頁與HTML網頁制作技術對比

   目前看來關於XHTML網頁的制作大家還存在很多的困惑，一一解答有些困難，我現在就XHTML網頁與HTML網頁制作技法上的不同來做一下說明。 

首先說一下HTML網頁的制作方法：

　　1.拿到美工設計圖開始切圖 
2.用表格把切的圖拼成一個網頁 
3.把內容放在已經編排好的空白處 

而XHTML網頁在制作技法與順序上是截然不同的，XHTML想要做的就是內容與版式的分離，那麼自然制作人員與設計師的工作可以做到一定程度的分離。 

我們以我給理想做的FarideaRSS網頁來進行一下XHTML網頁制作流程的說明：

　　1.內容劃分

　　將內容大刀闊斧的進行劃分：Logo，導航，文章標題，作者，發布時間，Copyright等等，用代碼表示就是： 

<div id="context"> 
<div id="logo"></div> 
<ul> 
<li>菜單1</li> 
<li>菜單2</li> 
</ul> 
<div id="items"> 
<div class="item"> 
<span class="title"></span> 
<span class="author"></span> 
<span class="time"></span> 
<div class="memo"> 
</div> 
</div> 

內容應當就是線性的排列下來，標簽的目的僅僅是為了區分內容的結構，而並不用關心設計師的設計稿，忘記陰影、顏色、背景圖吧，因為你和設計師在設計前已經商量好了網頁內有哪些內容，所以設計也是為內容服務。 

2.簡單排版

　　這時我們拿到了設計師的設計稿，設計師們已經用很漂亮的顏色，很漂亮的版式為我們設計出了這個網頁，這時就是CSS發揮威力的時候了，我們將原來定義的內容用CSS進行排版，用顏色塊（先不要著急切圖）對內容進行區分，先不要著急加背景圖，因為那樣只會擾亂你自己。示例如下： 
此主題相關圖片 

這時就是對制作人員的CSS功力的考驗了，只要堅信一個信念，沒有CSS做不到的就可以了：） 

3.細細品位

　　這是網頁的大體架構已經出來了，但是需要對設計師的頁面進行細細品位了，為了效果設計師多會加一些陰影或者好看的背景圖片，或者漸進式的圖片，此時我們可能要在原有內容中加入一些輔助的標簽來放置這些背景或點綴圖片，但原則是盡可能的少加，能用原標簽背景做的就用背景做，此處也比較考驗制作人的CSS功力。 

4.兼容性

　　我們還要在多款浏覽器中做一下測試，看一下是否在每個浏覽器中均正常，然後把代碼盡可能的向XHTML標准靠攏。咱們的FarideaRSS已經順利通過了XHTML的檢驗。  

然後咱們再來回顧一下，XHTML網頁制作步驟：

　　1.內容大刀闊斧劃分 
2.簡單排版 
3.細細品位設計 
4.兼容性與標准 

總體來說XHTML網頁制作時間要比傳統HTML網頁耗時，但出來的網頁容量小兼容性好，最主要的是，不知大家是否注意到了，可以脫離DW這種可視化工具依賴，只要有一個好的CSS編輯器就可以了，這種依賴的脫離是不容小視的。