內(nèi)容與表現(xiàn)分離，從標準到國人重視那天起，就已經(jīng)討論了，但是停留在div+css xhtml+css 純代碼的分離，思想上流程上，到底如何分離？
古老的話題：一首古詩的分離
1.給你一首古詩，保存為毫無格式的一堆文字，你去理解它的內(nèi)容，進行結(jié)構(gòu)的處理。用word排版之后，他有了結(jié)構(gòu)
2.這個結(jié)構(gòu)其實包含了語義和表現(xiàn)
3.用html進行結(jié)構(gòu)化，拋開一切的表現(xiàn)形式，只考慮語義
4.用CSS進行表現(xiàn)處理，包括html的默認表現(xiàn)，他擁有了視覺表現(xiàn)，這個表現(xiàn)體現(xiàn)出了結(jié)構(gòu)化，也體現(xiàn)出了用戶體驗，用戶體驗中包含了交互的排版和視覺體驗
5.如果加上行為，比如點擊注釋序號，緩緩跳轉(zhuǎn)到注釋內(nèi)容。
再看看css禪意花園
同樣是上面的5個步驟，形成第一版本的css禪意花園
而更多的模板提供者所做的工作是交互線稿+視覺設計。體現(xiàn)在網(wǎng)頁上就是CSS
可以看出從編碼角度來講
第一步，內(nèi)容處理為結(jié)構(gòu)，純HTML的編寫
第二步，結(jié)構(gòu)處理為表現(xiàn)，純CSS的編寫
第三步，給表現(xiàn)加上行為。
從流程的角度來講
第一步，策劃文檔
第二步，結(jié)構(gòu)處理
第三步，交互設計(交互樣式構(gòu)建)
第四步，視覺設計(視覺樣式構(gòu)建)
第五步，樣式構(gòu)建
