前端開發人員需要具備哪些SEO優化技巧

仲介交易 HTTP://www.aliyun.com/zixun/aggregation/6858.html">SEO診斷 淘寶客 雲主機 技術大廳

前端開發工程師不僅需要要跟10243.html">視覺設計師、互動式設計師配合，完美還原設計圖稿，編寫相容各大瀏覽器、載入速度快、使用者體驗好的頁面。 現在還需要跟SEO人員配合，調整頁面的代碼結構和標籤。 一些成熟的平臺，在開發初期並沒有考慮優化問題，所以做出來的頁面，就算是效果很炫，功能很強，但是對搜尋引擎非常的不友善。 任何一個成熟的網站，後期頁面都是動輒幾百萬的，到這個時候再來調整結構，既費時又費力，最怕的還是會影響到排名和收錄。

所以說與其在後期碰到問題再來調整，還不如把問題解決在源頭。 我本人也是從事前端開發工作的，下面把我工作過程中，積累的幾個開發過程中就需要做好的SEO優化技巧，分享給大家。

1、簡化代碼結構，更利於搜尋引擎分析抓取有用內容：頁面儘量採用DIV+CSS，當然，表格展現模式用table還是比div方便很多的;所有js、css採用外聯方式，圖片採用css精靈，減少請求次數。 看下下面同樣的內容，用div和talbe佈局的代碼比較，顯而易見用div簡便的多。

2、重要內容優先載入(第一個連結最好是網站主關鍵字，不刻意要求)，可以用css來處理，索引一篇文章的長度也是有限制的，一定要把最重要的內容，優先展現給蜘蛛，這方面你可以通過查看一些比較大的網頁快照來求證。

3、每個頁面只能出現一次H1標籤，H2標籤可以多次：H1權重很高，普遍認為僅次於title，一般資訊詳情頁的標題、商品詳情頁的標題，都放在H1裡。

4、圖片一定要添加alt屬性，title屬性可選：蜘蛛不認識圖片上的內容，只能通過alt屬性來判斷，如果是商品清單頁，所有商品都加了alt和title的話，容易造成堆砌關鍵字，所以我一般是只加alt屬性。

5、圖片大小聲明：如果圖片大小不做定義的話，頁面需要重新渲染，就會影響到載入速度。

6、連結可根據需求添加title屬性以及nofllow值;非特殊性連結，連結位址一定要寫入herf屬性，有些前端開發人員為了省事，直接用div加個click事件當連結，在視覺上和使用上確實是實現了連結效果， 但是做過SEO優化的人員都知道，蜘蛛目前對於js的支援很差，基本無法讀取裡面的連結位址。 所以說用click事件是絕對不允許的，特別是一些重要的導航連結。

7、頁面內容儘量不要做成flash、圖片、視頻，這些東西蜘蛛是抓不到的，就算是必須的，也要生成相應的靜態頁面。 有很多企業站看著很炫，全站flash，老闆看著是爽了，做SEO優化的人員就要抓狂了，全站沒一個連結。

8、除首頁外別的頁面最好要加上面包屑型導航，導航結構一定要清晰。

9、做好404頁面，一般會加首頁連結及錯誤提示，並測試其返回狀態碼為404：1、使用者體驗友好，可以留住使用者，不至於直接關閉頁面;2、蜘蛛友好，可以返回抓取其他頁面。

10、網站結構呈扁平狀樹型，目錄結構不宜過深，每個頁面離首頁最多點擊不超過3次，過深不利於搜尋引擎的抓取。

本文源自胖美美生活館HTTP://pangmm.org/，如需轉載請注明出處，謝謝!