前端進階系列(一):SEO和HTML語義化

基本概念

SEO：(Search Engine Optimization)意爲搜索引擎優化。搜索引擎優化是一種利用搜索引擎的搜索規則來提升目的網站的天然排名的方式。說白了就是對品牌的自我宣傳，從而獲取收益。

HTML語義化：根據內容的結構的語義化，選擇合適的標籤（代碼語義化）便於開發者閱讀和寫出更優雅的代碼的同時利於SEO優化。

使用SEO和語義化的目的

前面也作了基本的闡述：

• SEO就是爲了對品牌的自我宣傳，從而得到收益；

• 語義化的目的:

  • 在沒有css的狀況下，頁面也能呈現出很好的內容結構，代碼結構；
  • 提高用戶體驗：例如title、alt用於解釋名詞和解釋圖片信息；
  • 有利於SEO優化：和搜索引擎創建良好的溝通，有助於爬蟲抓取更多的有效信息，爬蟲依賴於標籤來肯定上下文和各個關鍵字的權重；
  • 方便其餘設備解析如屏幕閱讀器、盲人閱讀器、移動設備；
  • 語義化更據有可讀性，便於團隊開發和維護。

語義化和SEO的重要性

Google、Yahoo、Bing 約定，對 http://schema.org 所列出來的標籤進行解析。

緣由其實很簡單，由於schema標籤對搜索引擎很重要。
目前，搜索引擎的發展趨勢是全能化，簡單化，讓用戶在最短的時間裏獲取到想要的信息，讓用戶在點擊搜索結果以前就獲取到足夠的信息進行判斷。

好比Google general search，Google會根據你搜索的關鍵詞推薦網頁、新聞、圖片、視頻、音樂、商品、地圖、本地結果、實時結果等等。

好比Google onebox，Google會根據某些特定的指令，直接給出針對性的結果，如今在搜索引擎能夠直接查天氣，查航班。

還有前段時間Google推出的網站截圖預覽，snippets lists等等。

Google的目標是要整合全部資源，讓用戶能方便獲取到。資源有不少種，文字目前搜索引擎能夠徹底識別到，可是圖片、flash、音樂、視頻搜索引擎不能識別或只能識別一小部分，因此以目前的技術，尚不能整合網站上全部呈現出來的資源，因此須要用戶進行配合。

我以爲這就是語義化標籤出現的意義吧。

搜索引擎但願每一個網站都把不一樣的資源標記出來，並打上搜索引擎容易識別的標籤，利於搜索引擎進行判斷歸類，並在搜索結果中更好的呈現出來。

從SEO角度來看，對搜索引擎重要的就是對SEO重要的。

網站若是按照schema上的規則進行重寫代碼，方便了搜索引擎對信息的抓取，對網站內容在搜索結果中的呈現會有很好的幫助，可以適應搜索引擎的發展趨勢。也許對某些關鍵詞排名不會有明顯的效果，可是從長遠來看，對於從搜索引擎獲取流量應該有不小的幫助。

HTML5的革新—語義化標籤

W3C定義了這些語義標籤，不可能徹底符合咱們有時的設計目標，就像制定出來的法律不可能流傳100年都不改變，更況且它才制定沒多久，不可能這些語義標籤對因此設計目標的適應。只是必定程度上的「通用」，咱們的目標是讓爬蟲讀懂重要的東西就夠了。

結論：不能由於有了HTML 5標籤就棄用了div，每一個事物都有它的獨有做用的。

參考文章：

• 理解HTML語義化
• HTML 5的革新——語義化標籤(一)
• 標籤語義化對 SEO 來講有多重要？重要性體如今哪裏？