如何正確使用HTML標(biāo)記

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

　　分離結(jié)構(gòu)與表現(xiàn)的另一個(gè)重要方面是使用語義化的標(biāo)記來構(gòu)造文檔內(nèi)容。一個(gè)html元素的存在就意味著被標(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)該就是博客的名稱了， 是不是每個(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)勢。

　?、趶?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)勢了。從WEB標(biāo)準(zhǔn) 化的角度來看，文章正文使用＜p＞是理所當(dāng)然，也是更值得提倡的。不過如果使用＜div＞代替＜p＞，對(duì)SEO的影響還是甚微的，因?yàn)樗鼈儾]有任何強(qiáng)調(diào) 的意味在里面。但是如果你使用＜p＞來給網(wǎng)頁整體布局，就顯得有些怪異了。

　?、芰斜恚紆l＞、＜o(jì)l＞、＜li＞、＜table＞

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

　?、輙itle屬性（不是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ù)姆诺嚼锩嫒ァ０肽昵翱吹揭晃徊┯颜ftitle屬性（不是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)記。