• 您的位置：創(chuàng)新互聯(lián) >> 網(wǎng)站建設(shè) >> 網(wǎng)絡(luò)建設(shè)基礎(chǔ)知識 >> 合理利用HTML標(biāo)記優(yōu)化網(wǎng)頁布局

合理利用HTML標(biāo)記優(yōu)化網(wǎng)頁布局

• 王虎 文章來源：網(wǎng)站建設(shè) 點擊數(shù)：931 更新時間：2009-02-09

• 我們一直在講CSS網(wǎng)頁布局代碼的優(yōu)化，在建站學(xué)以往的文章中，也一直強(qiáng)調(diào)語義和文檔的結(jié)構(gòu)。隨著國外對WEB標(biāo)準(zhǔn)的推廣，有些新手認(rèn)為，web2.0就是把以前的table布局都改為DIV+CSS布局就是web2.0。其實不然， 我們要合理利用這些標(biāo)簽。 有一點值得引起注意，那就是在 web 開發(fā)人員圈子里通常被稱為“div-itis”的對 div 元素的濫用現(xiàn)象。
  通過大量的嵌套 div 或 span 元素來添加樣式確實很方便，但還是應(yīng)盡量避免這種誘惑。在多數(shù)情況下，為文檔內(nèi)現(xiàn)有元素附加樣式或 javascript 功能是可以做到不必引入 div 或 span 元素的。作為通用容器的 div 或 span 元素應(yīng)作為最后的手段使用——也就是說，最好是先盡量以語義化元素來編寫網(wǎng)頁，僅在確實需要時才加入通用容器元素。

  　　 所以我們要：優(yōu)化 優(yōu)化 再優(yōu)化 精簡和優(yōu)化CSS網(wǎng)頁布局代碼
  我要多用一些語義性標(biāo)簽，但是也要對號入座，標(biāo)簽語義要用對。
  HTML元素的語義類別 　結(jié)構(gòu) 這些元素的語義定義了他們在文檔中扮演著的結(jié)構(gòu)的角色
  div
  span
  ol,ul,li,dl,dt,dd
  del,ins
  h1..h6
  內(nèi)容
  這些元素的語義定義了在文檔中表示內(nèi)容標(biāo)記的語義
  a
  abbr
  acronym
  address
  blockquote
  cite
  code
  dfn
  kbd
  q
  samp
  var

  　　修飾形容
  這些元素起到對內(nèi)容的修飾和形容

  strong
  em

  " Once you've completed your markup, go over it two more times and find ways to reduce the number of elements on the page. Does that UL really need its own wrapping div? I think not. "

  　　注意您的樣式表
  當(dāng)我們的網(wǎng)頁內(nèi)容做得很多的時候，樣式表文件的代碼也隨著龐大和臃腫起來。
  我們也慢慢感覺到，有些地方不合理或重復(fù)定義。
  這就是你對CSS選擇符應(yīng)用上出現(xiàn)問題了，靈活使用這些CSS選擇符是使用CSS控制網(wǎng)頁的基礎(chǔ)，CSS選擇符也是CSS學(xué)習(xí)的重點和難點。
  我們是否應(yīng)在設(shè)計的開始應(yīng)該合理應(yīng)用這些CSS選擇符那？
  關(guān)于CSS選擇符的分類，使用，定義，由于內(nèi)容之大我就不說了，需要的可以在webjx.com找到答案，一些關(guān)于CSS樣式表的優(yōu)化技巧的文章學(xué)習(xí)一下。

• 上一篇文章：設(shè)計三要素：清晰、獨創(chuàng)、幽默
  下一篇文章：企業(yè)網(wǎng)站建設(shè)抓住先機(jī)，十大好處助你贏得成功