為了使我們的網(wǎng)站更好的被搜索引擎抓取收錄,更自然的獲得更高的流量,網(wǎng)站標(biāo)簽的語(yǔ)義化就顯得尤為重要。所謂標(biāo)簽語(yǔ)義化,就是指標(biāo)簽的含義。為了更好的理解標(biāo)簽的語(yǔ)義化,先看下面這個(gè)例子:
<table>
<tr>
<td>娛樂項(xiàng)目</td>
<td>項(xiàng)目支出</td>
</tr>
<tr>
<td>聚餐</td>
<td>200元</td>
</tr>
</table>
上面這一段代碼就是明顯的沒有使用語(yǔ)義化標(biāo)簽的例子,為了讓它的結(jié)構(gòu)更加清晰,正確的做法如下:
<table>
<caption>支出統(tǒng)計(jì)</caption>
<thead>
<tr>
<th>娛樂項(xiàng)目</th>
<th>項(xiàng)目支出</th>
</tr>
</thead>
<tbody>
<td>聚餐</td>
<td>200元</td>
</tbody>
</table>
其中:
<caption>:表格的標(biāo)題;
<thead>:一表格的表頭;
<th>:表的某一列的列頭。
是的,標(biāo)簽語(yǔ)義化的目的就是對(duì)搜索引擎友好,有了良好的結(jié)構(gòu)和語(yǔ)義我們的網(wǎng)頁(yè)內(nèi)容便自然容易被搜索引擎抓取,這種符合搜索引擎收索規(guī)則的做法,網(wǎng)站的推廣便可以省下不少的功夫,而且可維護(hù)性更高,因?yàn)榻Y(jié)構(gòu)清晰,十分易于閱讀。這也是搜索引擎優(yōu)化SEO(search engine optimization)重要的一步,當(dāng)然關(guān)于SEO遠(yuǎn)遠(yuǎn)不止如此,要了解更多有關(guān)SEO的內(nèi)容知識(shí),可移步:
http://baike.baidu.com/link?url=f_v0cbvzTIxhwKNaJtdd-qGjGMefJww4ko9pJaZj4rJArylR_dpUZsobKKLlMKBi
http://www.seoxuetang.com/
言歸正傳,所以我們要做的,就是語(yǔ)義化我們的HTML標(biāo)簽和屬性,如:
div 語(yǔ)義:Division(分隔)
span 語(yǔ)義:Span(范圍)
ol 語(yǔ)義:Ordered List(排序列表)
ul 語(yǔ)義:Unordered List(不排序列表)
li 語(yǔ)義:List Item(列表項(xiàng)目)
1.<Hx>
<h1>、<h2>、<h3>、<h4>、<h5>、<h6>,作為標(biāo)題使用,并且依據(jù)重要性遞減。<h1>是最高的等級(jí)。
2.<p>
段落標(biāo)記,知道了<p>作為段落,你就不會(huì)再使用<br/>來?yè)Q行了,而且不需要<br/><br/>來區(qū)分段落與段落。<p></p>中的文字會(huì)自動(dòng)換行,而且換行的效果優(yōu)于<br>。
3.<b>、<em>和<strong>
<b>標(biāo)簽語(yǔ)義為“加粗”
<em>標(biāo)簽語(yǔ)義為“強(qiáng)調(diào)”
<strong>標(biāo)簽語(yǔ)義為“更強(qiáng)烈的強(qiáng)調(diào)” 而且em 默認(rèn)用斜體表示,strong 用粗體表示。
當(dāng)我們知道了這三個(gè)標(biāo)簽的語(yǔ)義時(shí),做SEO時(shí)就好決定用哪個(gè)來強(qiáng)調(diào)重要的關(guān)鍵字了,強(qiáng)調(diào)用<em>和<strong>,純粹加粗用<b>。
4.<ul>標(biāo)簽、<ol>標(biāo)簽、<li>標(biāo)簽
<ul>標(biāo)簽語(yǔ)義為定義無序列表
<ol>標(biāo)簽語(yǔ)義為定義有序列表
<li>標(biāo)簽語(yǔ)義為定義列表項(xiàng)目
因此當(dāng)涉及到列表的項(xiàng)目,應(yīng)該用<ul><li>或<ol><li>(或者是<dl><dt><dd>來布局),而不是用<table>或<p>甚至<span>。
5.<dl>標(biāo)簽、<dt>標(biāo)簽、<dd>標(biāo)簽
<dl>標(biāo)簽語(yǔ)義為定義了定義列表
<dt>標(biāo)簽語(yǔ)義為定義了定義列表中的項(xiàng)目(即術(shù)語(yǔ)部分)
<dd>標(biāo)簽語(yǔ)義為定義列表中定義條目的定義部分
所以,當(dāng)我們用帶標(biāo)題的列表時(shí),即可采用<dl><dt><dd>自定義列表實(shí)現(xiàn)
6.<span>標(biāo)簽
<span>標(biāo)簽的語(yǔ)義為被用來組合文檔中的行內(nèi)元素
(另外應(yīng)當(dāng)區(qū)分<span>和<div>的區(qū)別,<div>是塊級(jí)元素(block level),
而<span>是行內(nèi)元素,前者的內(nèi)容會(huì)自動(dòng)換行,而后者前后不會(huì)自動(dòng)換行
http://www.cnblogs.com/coco1s/p/3578947.html)
7.<q>、 <blockquote>、<cite>
<q>標(biāo)簽的語(yǔ)義為用來標(biāo)記簡(jiǎn)短的單行引用,Web瀏覽器會(huì)自動(dòng)識(shí)別在<q>之間的內(nèi)容
<blockquote>標(biāo)簽的語(yǔ)義為用來標(biāo)記那些一段或者好幾段的長(zhǎng)篇引用
<cite>標(biāo)簽既可以與<q> 一起用,也可以與<blockquote>一起用,用來提供引用內(nèi)容的來源地址。
看一個(gè)例子:
<p> <cite>孔子</cite>曰:<q>有朋自遠(yuǎn)方來,不亦樂乎</q>.
</p>
<blockquote cite="http://www.w3cn.org/">
<p>
我們大部分人都有深刻體驗(yàn),每當(dāng)主流瀏覽器版本的升級(jí),我們剛建立的網(wǎng)站就可能變得過時(shí),我們就需要升級(jí)或者重新建造一遍網(wǎng)站。例如1996-1999年典型的"瀏覽器大戰(zhàn)",為了兼容 Netscape 和 IE,網(wǎng)站不得不為這兩種瀏覽器寫不同的代碼。同樣的,每當(dāng)新的網(wǎng)絡(luò)技術(shù)和交互設(shè)備的出現(xiàn),我們也需要制作一個(gè)新版本來支持這種新技術(shù)或新設(shè)備,例如支持手機(jī)上網(wǎng)的 WAP 技術(shù)。類似的問題舉不勝舉:網(wǎng)站代碼臃腫、繁雜浪費(fèi)了我們大量的帶寬;針對(duì)某種瀏覽器的 DHTML 特效,屏蔽了部分潛在的客戶;不易用的代碼,殘障人士無法瀏覽網(wǎng)站等等。這是一種惡性循環(huán),是一種巨大的浪費(fèi)。
</p>
</blockquote>
8.<table>、<th>、<td>、<caption>
<table>標(biāo)簽的語(yǔ)義的為定義 HTML 表格
<th>標(biāo)簽的語(yǔ)義為定義表格內(nèi)的表頭單元格
<caption>標(biāo)簽的語(yǔ)義為定義表格標(biāo)題
9.<button>標(biāo)簽、<input>標(biāo)簽、<textarea>標(biāo)簽
<button>標(biāo)簽的語(yǔ)義為定義一個(gè)按鈕
<input> 標(biāo)簽的語(yǔ)義為用于搜集用戶信息,根據(jù)不同的 type 屬性值,輸入字段擁有很多種形式。輸入字段可以是文本字段、復(fù)選框、掩碼后的文本控件、單選按鈕、按鈕等等。
<textarea>標(biāo)簽的語(yǔ)義為定義多行的文本輸入控件
button控件 與 <input type="button"> 相比,提供了更為強(qiáng)大的功能和更豐富的內(nèi)容。<button> 與 </button> 標(biāo)簽之間的所有內(nèi)容都是按鈕的內(nèi)容,其中包括任何可接受的正文內(nèi)容,比如文本或多媒體內(nèi)容。
10.<label> 標(biāo)簽
<label>標(biāo)簽的語(yǔ)義為為input元素定義標(biāo)注(標(biāo)記)
11.<ins>, <del>
<ins>標(biāo)簽的語(yǔ)義為定義已經(jīng)被插入文檔中的文本。
<del>標(biāo)簽的語(yǔ)義為定義文檔中已被刪除的文本。
<ins>與 <del> 一同使用,來描述文檔中的更新和修正。知道del,就不要再用<s>做刪除線了,用del顯然更具有語(yǔ)義化。而且del還帶有cite和datetime來表明刪除的原因以及刪除的時(shí)間。ins是表示插入,也有這樣的屬性。
關(guān)于這兩個(gè)標(biāo)簽的用法,可以參看:
http://www.w3school.com.cn/tags/tag_ins.asp
http://www.w3school.com.cn/tags/tag_del.asp
【網(wǎng)站聲明】本站除付費(fèi)源碼經(jīng)過測(cè)試外,其他素材未做測(cè)試,不保證完整性,網(wǎng)站上部分源碼僅限學(xué)習(xí)交流,請(qǐng)勿用于商業(yè)用途。如損害你的權(quán)益請(qǐng)聯(lián)系客服QQ:2655101040 給予處理,謝謝支持。