| 導購 | 订阅 | 在线投稿
分享
 
 
 

HTML文檔結構對Div+CSS布局的意義

來源:互聯網網民  2008-09-08 06:57:37  評論

主要就是我對結構和開發效率之間的矛盾的一個思考,css框架怎樣才能不破環結構的一個疑問。而且對于結構和效率我的觀點就是「擁有合理的結構,才是你web標准化的根本動機」,web是承載信息的,沒有理由爲了視覺效果,而破壞合理的結構。

Web標准的要把握幾點:

使用結構化,語義化的標簽

使用CSS分離出(X)HTML文檔中的表現元素

依靠Javascript去增強,而不是替代,網站的特征(舉個例子就是如果css做不了的,交給Javascript而不是替代css去做他能做的)

對于多樣式組合的結構我一直是很反感的,可能我理解的不夠深入,體會不到他的好處,或許合理的組合可以兼顧結構和開發效率,可是我沒有發現,我就要抵觸。

對樣式組合方式是這樣的

<div class=」class1 class2 … classn」></div>

舉個布局例子

<div class=」f-left w400 bgfff」>

幾個類組合成一個左浮動,寬400 背景爲白色的一個區域

你可能擁有一個龐大的庫,頁面只需要任意的class的組合就可以完成,省去大部分花費在css上的時間,可是帶來的是結構的混亂,改版的困難,甚至向後兼容受到限制。這樣做和table布局沒什麽兩樣,只是代碼看著好看而以,而且代碼量相差也不會太大。在應用web標准初期,合理的table布局也是允許的。

如此多的class讓我想起了table冗長的屬性

<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 ALIGN=CENTER WIDTH=100% HEIGHT=100%>

難道辛辛苦苦就是想使用div配合css模擬出一個table很容易實現的效果?而且達到和table布局一樣的拙劣?

語義化也是結構的一個部分,語義除了合理的使用(X)HTML標記語言,id也是一個語義組成的部分,div的id就像一個即時貼,告訴你某個div的語義,告訴你這個區塊的意義。

微格式(Microformat)是在標准 XHTML 代碼中嵌入結構化數據的一種新方法。他的誕生也很明確的說明了web的結構永遠是第一位,語義化的優勢很現實的體現出來,div的屬性規劃也體現著語義,而不僅僅是一個傳遞給樣式工作的接口。可以去看看ibm文檔中心的一篇「使用 microformats 分離數據與格式」了解它的工作原理。

 
特别声明:以上内容(如有图片或视频亦包括在内)为网络用户发布,本站仅提供信息存储服务。
 
  主要就是我對結構和開發效率之間的矛盾的一個思考,css框架怎樣才能不破環結構的一個疑問。而且對于結構和效率我的觀點就是「擁有合理的結構,才是你web標准化的根本動機」,web是承載信息的,沒有理由爲了視覺效果,而破壞合理的結構。   Web標准的要把握幾點:   使用結構化,語義化的標簽   使用CSS分離出(X)HTML文檔中的表現元素   依靠Javascript去增強,而不是替代,網站的特征(舉個例子就是如果css做不了的,交給Javascript而不是替代css去做他能做的)   對于多樣式組合的結構我一直是很反感的,可能我理解的不夠深入,體會不到他的好處,或許合理的組合可以兼顧結構和開發效率,可是我沒有發現,我就要抵觸。   對樣式組合方式是這樣的   <div class=」class1 class2 … classn」></div>   舉個布局例子   <div class=」f-left w400 bgfff」>   幾個類組合成一個左浮動,寬400 背景爲白色的一個區域   你可能擁有一個龐大的庫,頁面只需要任意的class的組合就可以完成,省去大部分花費在css上的時間,可是帶來的是結構的混亂,改版的困難,甚至向後兼容受到限制。這樣做和table布局沒什麽兩樣,只是代碼看著好看而以,而且代碼量相差也不會太大。在應用web標准初期,合理的table布局也是允許的。   如此多的class讓我想起了table冗長的屬性   <TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 ALIGN=CENTER WIDTH=100% HEIGHT=100%>   難道辛辛苦苦就是想使用div配合css模擬出一個table很容易實現的效果?而且達到和table布局一樣的拙劣?   語義化也是結構的一個部分,語義除了合理的使用(X)HTML標記語言,id也是一個語義組成的部分,div的id就像一個即時貼,告訴你某個div的語義,告訴你這個區塊的意義。   微格式(Microformat)是在標准 XHTML 代碼中嵌入結構化數據的一種新方法。他的誕生也很明確的說明了web的結構永遠是第一位,語義化的優勢很現實的體現出來,div的屬性規劃也體現著語義,而不僅僅是一個傳遞給樣式工作的接口。可以去看看ibm文檔中心的一篇「使用 microformats 分離數據與格式」了解它的工作原理。
󰈣󰈤
王朝萬家燈火計劃
期待原創作者加盟
 
 
 
>>返回首頁<<
 
 
 
 
 
 熱帖排行
 
 
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有