SEO相關

前端須要注意哪些SEO

• 合理的title、description、keywords：
  -- 搜索對着三項的權重逐個減少，title值強調重點便可，重要關鍵詞出現不要超過2次，並且要靠前，不一樣頁面title要有所不一樣；
  -- description把頁面內容高度歸納，長度合適，不可過度堆砌關鍵詞，不一樣頁面description有所不一樣；
  -- keywords列舉出重要關鍵詞便可
• 語義化的HTML代碼，符合W3C規範：語義化代碼讓搜索引擎容易理解網頁
• 重要內容HTML代碼放在最前：搜索引擎抓取HTML順序是從上到下，有的搜索引擎對抓取長度有限制，保證重要內容必定會被抓取
• 重要內容不要用js輸出：爬蟲不會執行js獲取內容
• 少用iframe：搜索引擎不會抓取iframe中的內容
• 非裝飾性圖片必須加alt
• 提升網站速度：網站速度是搜索引擎排序的一個重要指標

什麼是標籤語義化

幾乎每一個標籤都是有含義的，標籤語義化是在適當的位置用適當的標籤。

標籤語義化的做用

標籤語義化的目的就是對搜索引擎友好！標籤語義化是爲了使爬蟲懂的你網站的含義，利於它採集有效有用的信息進入數據庫，即SEO優化（Search Engine Optimization）。

eg

div 語義：Division(分隔)
span 語義：Span(範圍)
ol 語義：Ordered List(排序列表)
ul 語義：Unordered List(不排序列表)
li 語義：List Item(列表項目)

小導航

• a標籤
• h標籤
• ul和ol和dl
• p標籤和br標籤
• caption標籤
• img標籤
• strong和b和em和i

那些標籤

a標籤

<a title="百度搜索" rel="nofollow">http://www.baidu.com</a>

• 使用 title 屬性，能夠讓鼠標懸停在超連接上的時候，顯示該超連接的文字註釋，也是讓爬蟲更理解這個連接的含義。
• 使用rel="nofollow"告訴機器(爬蟲)不須要跳到這個連接。(爬到其餘網站就不必定會來了，別讓它爬了)

h標籤

h1-h6多用於標題。

<h1>正文標題</h1>
<h2>副標題</h2>

其餘標題就不要隨便用h標籤了。

ul和ol和dl

ul標籤多用於無序列表
ol標籤多用於有序列表
dl標籤多用於定義數據列表

p標籤和br標籤

br標籤的錯誤使用案例

<div>
  <span>item1</span><br>
  <span>item2</span><br>
  <span>item3</span><br>
</div>

br標籤的正確使用

<p>
  文章內容<br>
  文章內容<br>
  文章內容
</p>

caption標籤

<table border="1">
  <caption>表格標題</caption>
  <tr>
    <th>一月</th>
    <th>二月</th>
  </tr>
  <tr>
    <td>31天</td>
    <td>28天</td>
  </tr>
</table>

img標籤

加上alt屬性和title屬性給予說明

strong和b和em和i

<strong>和<b>都是加粗的效果（強調做用），<strong>對seo有很好的效果而<b>不太起做用。
<em>和<i>都是斜體的效果。

• 若是你單純爲了顯示加粗斜體效果，那麼推薦使用<b> <i>;
• 若是爲了強調文字內容，那麼推薦使用<strong> <em>

能使用一個標籤完成的事情就不要使用兩個標籤。 爬蟲會把display:none;的自動過濾掉。