其實(shí)零才接觸HTML語義化也不是很久，還記得第一次接觸竟然是被某網(wǎng)絡(luò)公司W(wǎng)EB前端招聘的HR問到，當(dāng)時(shí)真的很囧。所謂吃一塹，長(zhǎng)一智，零才決定對(duì)WEB前端和SEO結(jié)合起來學(xué)習(xí)。什么是HTML語義化？如果大家對(duì)它也較為陌生，或者決定對(duì)下面的解釋理解起來有點(diǎn)吃力，可以參考下零才在微博中給的通俗解釋。

分離結(jié)構(gòu)與表現(xiàn)的另一個(gè)重要方面是使用語義化的標(biāo)記來構(gòu)造文檔內(nèi)容。一個(gè)XHTML元素的存在就意味被標(biāo)記內(nèi)容的那部分有相應(yīng)的結(jié)構(gòu)化的意義，沒有理由使用其他的標(biāo)記。換句話說，不要讓CSS使一個(gè)HTML元素看起來就像另一個(gè)HTML元素，比如用＜div＞來代替＜p＞標(biāo)記標(biāo)題。

雖然語義化的HTML屬于WEB標(biāo)準(zhǔn)化范疇，值得WEB前端的設(shè)計(jì)者學(xué)習(xí)，但對(duì)于一個(gè)全面的SEO來說，使用標(biāo)準(zhǔn)化的網(wǎng)頁結(jié)構(gòu)，對(duì)SEO是有百利而無一害的，而WEB標(biāo)準(zhǔn)化就必須談到語義化的HTML。其實(shí)，應(yīng)該很容易想象，如果整個(gè)HTML文檔中，都只用div來布局、表現(xiàn)數(shù)據(jù)，那還需要其他的那些HTML標(biāo)簽做什么呢？可以這么說，語義化的HTML讓我們的網(wǎng)頁更加容易被人或者機(jī)器理解，更容易清楚的表達(dá)網(wǎng)頁的真實(shí)含義。下面，我們就來了解下SEO種需要重點(diǎn)注意的一些語義化HTML。

標(biāo)題＜Hx＞

＜h1＞、＜h2＞、＜h3＞、＜h4＞、＜h5＞、＜h6＞，在WEB中作為標(biāo)題使用，并且依據(jù)重要性遞減。＜h1＞是最高的等級(jí)，所以你需要準(zhǔn)確確定每個(gè)頁面最重要的內(nèi)容是什么，要優(yōu)化的關(guān)鍵詞在哪里。以我們最常見的博客為例，博客首頁羅列最多的通常就是最新博文，而最重要的應(yīng)該就是博客的名稱了，比如零才的“零才網(wǎng)絡(luò)推廣博客”，而后面最新文章的鏈接標(biāo)題則可以使用＜H2＞或者＜H3＞，一般都使用＜H2＞，表示次級(jí)標(biāo)題。

但是，是不是每個(gè)頁面的H1標(biāo)簽都包含博客名稱呢？建議次級(jí)頁面的博客名稱鏈接都放在H2標(biāo)簽里，而你的文章標(biāo)題則使用H1標(biāo)簽，這樣對(duì)于整站優(yōu)化是很有幫助的，這也是優(yōu)化到每個(gè)頁面需要注意的一點(diǎn)。通過合理設(shè)置每個(gè)頁面的hx標(biāo)題，網(wǎng)站的內(nèi)容才會(huì)更具優(yōu)勢(shì)。

強(qiáng)調(diào)＜em＞、＜strong＞、＜b＞、＜i＞

＜em＞、＜strong＞這兩個(gè)標(biāo)簽對(duì)SEO有著較大影響效果，適當(dāng)使用它們，可使你的網(wǎng)頁增色不少。＜em＞、＜strong＞與Hx一樣，其區(qū)別也在于重要性不一樣。＜em＞ 表示強(qiáng)調(diào)，而＜strong＞意為重點(diǎn)強(qiáng)調(diào)，較em更重一些。在SEO時(shí)，我們可以將最重要的關(guān)鍵詞用strong標(biāo)記，對(duì)第二重要的用em標(biāo)記。結(jié)合前面使用的Hx標(biāo)簽，它們更適合放在文章正文的內(nèi)部，而Hx理所當(dāng)然是在用在正文的外部。有些WEB設(shè)計(jì)者為了達(dá)到網(wǎng)頁的某些效果，使用＜strong＞純粹是為了達(dá)到加粗，使用em就是為了傾斜，而這種做法根本沒必要，而且相反可能會(huì)影響到SEO的效果。在以前，為了達(dá)到粗體、斜體的效果，WEB設(shè)計(jì)者會(huì)使用＜b＞、＜i＞標(biāo)簽，而現(xiàn)在基本不用它們了，它們僅僅是用來表現(xiàn)文本樣式的，而最明智和常用的解決方案是用CSS來控制文字樣式。

段落＜p＞

當(dāng)搜索引擎讀取網(wǎng)頁內(nèi)容的時(shí)候，遇到P標(biāo)簽的時(shí)候，立馬就知道這是一個(gè)段落，而如果使用DIV，就無法體現(xiàn)HTML語義化的優(yōu)勢(shì)了。從WEB標(biāo)準(zhǔn)的角度來看，文章正文使用P是理所當(dāng)然，也是更值得提倡的。不過如果使用＜div＞代替＜p＞，對(duì)SEO的影響還是甚微的，因?yàn)樗鼈儾�沒有任何強(qiáng)調(diào)的意味在里面。但是如果你使用P來給網(wǎng)頁整體布局，就顯得有些怪異了。

列表＜ul＞、＜o(jì)l＞、＜li＞、＜table＞

＜ul＞為無序列表，大家廣泛使用的，有序列表＜o(jì)l＞也挺常用。在web標(biāo)準(zhǔn)化過程中，＜ul＞被更多的用于導(dǎo)航條，這樣做是完全正確的，而在文章列表里面，就可以使用ol了，因?yàn)槟切┝斜矶际怯幸欢�順序的。�?dāng)然，這兩個(gè)對(duì)于SEO的影響也是甚微的，但如果你使用表格＜table＞代替列表，不僅會(huì)使得HTML文檔變得冗長(zhǎng)，更沒能很好的利用HTML語義化的優(yōu)勢(shì)來優(yōu)化你的網(wǎng)頁，因?yàn)楸砀窀�適合來標(biāo)記列表的數(shù)據(jù)。

title屬性（不是title標(biāo)簽）和alt屬性

title屬性是用來為元素提供額外說明信息的，它可以用在除了base，basefont，head，html，meta，param，script和title之外的所有標(biāo)簽。alt屬性為不能顯示圖像、窗體或applets的用戶代理（UA），指定替換文字。alt屬性對(duì)圖片優(yōu)化的功能是毋庸置疑的，而且這也是SEO所提倡的，如果你非用圖片到HTML里面去，最好將圖片加上ALT屬性，而且可以將關(guān)鍵詞適當(dāng)?shù)姆诺嚼锩嫒�。半年前看到一位博友說title屬性（不是title標(biāo)簽）可以增加網(wǎng)站的關(guān)鍵詞密度，零才在這里持有不同的觀點(diǎn)，因?yàn)楝F(xiàn)在ALT屬性里的值都已經(jīng)被搜索引擎輕視了，title里面的內(nèi)容對(duì)關(guān)鍵詞密度的影響也會(huì)被搜索引擎放低，同時(shí)。title屬性里的內(nèi)容并不一定能夠增加關(guān)鍵詞的密度，如果大量使用，且里面的內(nèi)容不含關(guān)鍵詞，相反會(huì)削弱關(guān)鍵詞密度。

也許這篇文章更適合SEO初學(xué)者來看，但是對(duì)于很多只懂鏈接和內(nèi)容操作的SEO來說，WEB標(biāo)準(zhǔn)還是應(yīng)該引起大家的注意。同時(shí)，對(duì)于WEB設(shè)計(jì)者來說，考慮HTML對(duì)網(wǎng)站SEO的影響，更應(yīng)該正確的使用你手下的HTML標(biāo)記。

如果您對(duì)零才的文章有任何看法，可前往零才的博客參與討論，同時(shí)可以關(guān)注零才的新浪微博：http://t.sina.com.cn/yichang。本文原始出處：http://www.0cai.net/post/yuyihua-seo.html

標(biāo)簽： html 搜索引擎優(yōu)化 網(wǎng)站SEO 

版權(quán)申明：本站文章部分自網(wǎng)絡(luò)，如有侵權(quán)，請(qǐng)聯(lián)系：west999com@outlook.com
特別注意：本站所有轉(zhuǎn)載文章言論不代表本站觀點(diǎn)！
本站所提供的圖片等素材，版權(quán)歸原作者所有，如需使用，請(qǐng)與原作者聯(lián)系。