XHTML標(biāo)簽語義化介紹
發(fā)布時間：2011-01-25 12:52:52 作者：佚名 
我要評論
我要評論前兩天參加了公司組織的一個WD培訓(xùn)，有一節(jié)課講了標(biāo)簽語義化，聽了之后感覺特別有用，更正了我以前對 HTML 和 CSS 的錯誤看法。
首先說明的一點是，人可以通過視覺的劃分判斷內(nèi)容的語義,搜索引擎看到的只是代碼。搜索引擎只能通過標(biāo)簽來判斷內(nèi)容的語義。 以前我真的沒有怎么重視過搜索引擎，現(xiàn)在開始比較在意了，因為頁面的很大一部分流量是來自搜索引擎的，要使頁面盡可能地對搜索引擎友好，所以就要盡可能地使標(biāo)簽語義化。
以前以我對web開發(fā)的粗淺理解，覺得寫一個好的符合標(biāo)準的頁面只需要把結(jié)構(gòu)和表現(xiàn)分離，然后不要使用table，font等標(biāo)簽就行了，至于通篇都是div我也不會覺得有什么問題，因為CSS很強大。但是，所有的標(biāo)簽都是有自己的語義的，下面給出一部分標(biāo)簽的語義：
div 語義：Division（分隔）
span 語義：Span（范圍）
ol 語義：Ordered List（排序列表）
ul 語義：Unordered List（不排序列表）
li 語義：List Item（列表項目）
…………
如果無視標(biāo)簽語義和默認樣式，所有標(biāo)簽都用div，其實也是可以寫出來視覺效果很好的頁面，只要你靈活運用CSS。但是那樣的話雖然視覺上達到了要求，但是整個頁面一點語義都沒有，搜索引擎還是看不懂。所以，要記?。?
結(jié)構(gòu)(html)才是重點，樣式(css)是用來修飾結(jié)構(gòu)的。所以，要先確定html，確定標(biāo)簽，再來選用合適的css。
一般來說，所有的標(biāo)簽都會有一個默認的樣式，所以一個簡單的判斷網(wǎng)頁標(biāo)簽語義是否良好的方法就是：去掉樣式，看網(wǎng)頁結(jié)構(gòu)是否組織良好有序，是否仍然有很好的可讀性。
另外，值得重點提及的是h標(biāo)簽，h標(biāo)簽的語意是標(biāo)題，搜索引擎對這個標(biāo)簽比較敏感，特別是h1,和h2。一個語義良好的頁面，h標(biāo)簽應(yīng)該是完整有序沒有斷層的。也就是說，要h1,h2,h3,h4這樣推下來，不要h1,h3,h4，漏掉h2。一個結(jié)構(gòu)良好的網(wǎng)頁，h標(biāo)簽可以組織起一個網(wǎng)頁的大綱。
以前以我對web開發(fā)的粗淺理解，覺得寫一個好的符合標(biāo)準的頁面只需要把結(jié)構(gòu)和表現(xiàn)分離，然后不要使用table，font等標(biāo)簽就行了，至于通篇都是div我也不會覺得有什么問題，因為CSS很強大。但是，所有的標(biāo)簽都是有自己的語義的，下面給出一部分標(biāo)簽的語義：
div 語義：Division（分隔）
span 語義：Span（范圍）
ol 語義：Ordered List（排序列表）
ul 語義：Unordered List（不排序列表）
li 語義：List Item（列表項目）
…………
如果無視標(biāo)簽語義和默認樣式，所有標(biāo)簽都用div，其實也是可以寫出來視覺效果很好的頁面，只要你靈活運用CSS。但是那樣的話雖然視覺上達到了要求，但是整個頁面一點語義都沒有，搜索引擎還是看不懂。所以，要記?。?
結(jié)構(gòu)(html)才是重點，樣式(css)是用來修飾結(jié)構(gòu)的。所以，要先確定html，確定標(biāo)簽，再來選用合適的css。
一般來說，所有的標(biāo)簽都會有一個默認的樣式，所以一個簡單的判斷網(wǎng)頁標(biāo)簽語義是否良好的方法就是：去掉樣式，看網(wǎng)頁結(jié)構(gòu)是否組織良好有序，是否仍然有很好的可讀性。
另外，值得重點提及的是h標(biāo)簽，h標(biāo)簽的語意是標(biāo)題，搜索引擎對這個標(biāo)簽比較敏感，特別是h1,和h2。一個語義良好的頁面，h標(biāo)簽應(yīng)該是完整有序沒有斷層的。也就是說，要h1,h2,h3,h4這樣推下來，不要h1,h3,h4，漏掉h2。一個結(jié)構(gòu)良好的網(wǎng)頁，h標(biāo)簽可以組織起一個網(wǎng)頁的大綱。
相關(guān)文章
- 這篇文章主要介紹了HTML5語義化元素的相關(guān)知識，非常不錯，具有一定的參考借鑒價值，需要的朋友參考下吧2019-08-22
- HTML5 只有一個簡單的文檔類型：<!DOCTYPE html>，表示瀏覽器會按照標(biāo)準模式解析。今天小編給大家?guī)砹薍TML5新特性之語義化標(biāo)簽，感興趣的朋友一起看看吧2017-10-31
- b 和 i 標(biāo)簽在現(xiàn)在的 Web 標(biāo)準潛規(guī)則中是不推薦使用，甚至是反對使用的，因為認為他們只是“表現(xiàn)”粗體和斜體，而沒有任何“語義”。更多的用 strong2008-10-17
HTML5 語義化結(jié)構(gòu)化規(guī)范化
HTML結(jié)構(gòu)更加清晰、規(guī)范，學(xué)習(xí)HTML5優(yōu)化結(jié)構(gòu)的思路。 HTML5添加了一些新元素，用來標(biāo)識常用的結(jié)構(gòu)，是html更具語義化，可是我們無法直接使用，即使可能用到還要等他個十年2008-10-17- 本篇文章小編為大家介紹HTML標(biāo)簽語義化（含H5） ，有需要的朋友可以參考一下2013-04-08
這篇文章主要介紹了詳解HTML5常用的語義化標(biāo)簽的相關(guān)資料,需要的朋友可以參考下2019-09-27- 下面小編就為大家?guī)硪黄獪\談HTML的語義化和一些簡單優(yōu)化。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-10-12
淺談?wù)Z義化的HTML結(jié)構(gòu)到底有什么好處
下面小編就為大家?guī)硪黄獪\談?wù)Z義化的HTML結(jié)構(gòu)到底有什么好處。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-08-05使用語義化標(biāo)簽去寫你的HTML 兼容IE6,7,8
下面小編就為大家?guī)硪黄褂谜Z義化標(biāo)簽去寫你的HTML 兼容IE6,7,8。小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考，一起跟隨小編過來看看吧2016-04-14- html標(biāo)簽語義：即html標(biāo)簽的含義2012-11-17
