HTML5標籤對於seo的作用

html5增加了非常多的新的標籤，這些標籤能夠非常容易的將我們的網頁各個功能區域區分開來。

html5和html4的區別

我們知道HTML4 是採用“div+css”，也就是說，網頁的各個功能區域都是使用div標籤進行排版的，而這些div的區分只是使用css類名稱進行的，而搜尋引擎是不會理解類名稱是有什麼作用的。

下面的圖片可以幫助你理解HTML4的排版：

可以見到上圖。所有的功能區域，比如頭部（header）、導航（nav）、側邊欄（sidebar）、文章（artcle）和底部（footer），都是採用div標籤。

這些類名稱放到div標籤中可以讓css發揮作用，但是搜尋引擎卻不會讀取他們，也不知道具體的含義。

而下面這張圖片是HTML5新增的一些標籤的排版，這些新增的標籤可以讓搜尋引擎理解這些區塊的內容是什麼 ，從而更好地理解整個網站：

可見上圖所示，使用HTML5的排版使用了新的標籤，而這些標籤都是可以被搜尋引擎所理解的，這樣，搜尋引擎蜘蛛在我們的網頁上爬行的時候，就會知道什麼區域是頂部、什麼區域是導航等等。

這樣就能夠讓搜尋引擎更容易得到我們整個網站清晰的資訊了。

結構上，我們可以以上圖為例進行分析這些標籤的作用：

header：定義了站點的頭部資訊，也就是頁首，一般放置網站的站點名稱以及LOGO和導航欄。搜尋引擎更容易識別站點的型別。

nav：定義導航連結，也就是欄目或者頻道的連結。搜尋引擎可以更好了解網站的資訊架構，分類等。良好的資訊架構，更有利於蜘蛛的爬行和權重的分佈。

footer：定義了底部資訊，也就是頁尾。放置頁尾導航，一些比如公司介紹，聯絡我們之類的資訊。一般來說對網站比較不重要，有可能搜尋引擎會降低其位置的權重。

section：該元素用來表示網頁中不同的分割槽。優勢體現在每個部分都可以有其獨立的HTML標題。這可以讓搜尋引擎更好地瞭解網頁的結構是如何劃分的。搜尋引擎可能會根據網頁中的section 標籤找出其資訊架構。（同左撇子）

artcle：定義文章區域，可以更有利於搜尋引擎識別網頁的內容以及判斷相關性。

aside：定義頁面內容之外的內容，在左側或右側邊欄。比如知乎右側的“相關問題”就屬於aside 區域。aside標籤的文字資訊與article標籤區域的文字資訊最好是相關。可能會影響到該頁面和目標頁面的排名。這些結構元素有些在HTML4時代，一般是用div來定義。

figure ：定義媒介內容的分組，以及它們的標題，figcaption 定義 figure 元素的標題。這兩個元素可以說非常好的使媒介和文字說明聯絡在了一起。有利於搜尋引擎理解內容。文字說明是可見的。

time：定義日期/時間，time標籤可能會作為一個來判斷網頁文字源，也就是能夠透過time標籤來識別哪篇文章是原創的。

所開發的主題，逐步開發HTML5標籤的自定義使用以及最佳化

目前新出的主題，將會以HTML5新增的這些標籤進行佈局，讓整個網站的佈局更加容易讓搜尋引擎理解，

在首頁模組上，我們會增加外層標籤section和artcle的設定，你可以自由選擇這些包裹的標籤，其中 ，每一個首頁排版的模組都可以使用section來包裹，而artcle的包裹是指那些呼叫文章或者商品的模組可使用。

可見下截圖的設定方式：

在配合權重標籤的選擇（h標籤、strong和div），這樣就能夠自定義整個網站的結構和所佔權重了。

在分類目錄、文章和商品詳細頁面中，則不需要設定，這些最佳化的標籤我們已經按照w3cschool的介紹進行了最佳化，你可以在文章中插入一些H2~H4標籤進行文章段落的權重區分。

側邊欄我們使用aside包裹，你可以將側邊欄模組使用section包裹，而無需使用artcle包裹。

這樣的功能可以讓我們的整個網站更加容易讓搜尋引擎理解。