以前端的角度出發做好SEO需要考慮什麼
第一， 什麼是SEO?
搜尋引擎優化（Search Engine Optimization）,簡稱SEO。是按照搜尋引擎給出的優化建議，以增強網站核心價值為目標，從網站結構、內容建設方案、使用者互動傳播等角度進行合理規劃，以改善網站在搜尋引擎中的表現，吸引更多搜尋引擎使用者訪問網站。SEO與搜尋引擎，互相促進，互利互助。
要想更好理解以上一段廢話，首先需要理解關於搜尋引擎的兩個概念。
1、 搜尋引擎工作原理
可以將搜尋引擎比喻為一個偌大的圖書館，裡面所有的圖書都已經分門別類排列整齊了，分類分成大分類（可以理解為書架）小分類（可以理解為書架上擱架）以及具體到最小的分類（書的名字）。圖書館每天都在增加新的圖書，那麼一個新的網站就等於一本書，我們進入搜尋引擎輸入的關鍵詞就是圖書館裡面分類的名字或者直接是書名，通過搜尋引擎這個龐大的圖書館系統可以很快的找到我們需要的內容。那麼什麼書歸置於什麼分類下，如何擺到更容易被找到的位置就需要理解下面的內容了。
2、 搜尋引擎蜘蛛工作原理
搜尋引擎蜘蛛是搜尋引擎工程師開發出的模擬蜘蛛在蜘蛛網爬行的一個程式，因為類似蜘蛛的行為，就稱為搜尋引擎蜘蛛，用來抓取網頁資訊，分門別類的儲存在上面所說的圖書館裡，有需要的時候再進行調取。所以為了讓蜘蛛更容易抓取網頁內容，就要投其所好，才能為我所用。
第二， 我們為什麼需要SEO?
那麼我們為什麼需要做SEO呢，就是為了提高網站的權重，增強搜尋引擎友好度，以達到提高排名，增加流量，改善使用者體驗，促進銷售的作用。
1、 什麼樣的網站需要被搜尋引擎檢索到？
我有百度過關鍵詞“合肥房產網”，出來的結果是好居網排名21位，也就是說翻到第三頁第一個才是我們的網站。如果我是一位準備買房或者賣房的使用者，我用百度搜索也不太可能會翻到第三頁才決定我要找誰給我買或者賣這個房子吧。就算我們的服務我們的產品是最好的，但是使用者搜尋不到也是白搭，這就是SEO的作用所在，通過更高的排名，讓潛在使用者可以更便捷的找到我們。
2、 什麼樣的網站可以更好的被搜尋引擎檢索到？
對搜尋引擎越友好，網站權重越高，排名就越高，就更容易被檢索到。從擬人化的角度來看待搜尋引擎蜘蛛，可以得出一些結論。首先你需要投其所好，網站結構脈絡需要符合蜘蛛閱讀的習慣，程式碼雜亂無章，蜘蛛看著都頭疼，就無法給他留個好印象了；其次，網站深度不能太深，從首頁到目標頁跳轉最好不能超過四次，再多的話蜘蛛就頭暈了，轉不出來，下次他就不再光顧，我們只能往後站；再次，當蜘蛛進入一個網站，半天載入不出來，他每天這麼繁重的工作量，哪裡會有時間慢慢等載入完成，相信印象也不會有多好了；最後，內容是一個網站存在的基礎，蜘蛛循著一個關鍵詞來到我們的網站，轉了一圈，發現跟他想找的東西風馬牛不相及，他可就頭大了，直接就打入冷宮吧。
看到這裡相信大家會對SEO充滿好奇了吧，到底怎樣才能做好SEO呢？雖然說SEO更多的是運營的工作，布關鍵詞發外鏈是一項繁重而長期的工程，但是作為網站建設人員，我們也有一些點可以注意，一樣可以對SEO有所幫助，下面就是從前端的角度對網站進行的一些優化。
第三， 從前端角度出發有哪些注意事項有利於SEO?
- 提高頁面載入速度。 能用css解決的不用背景圖片，背景圖片也儘量壓縮大小，可以幾個icons放在一個圖片上，使用background-position找到需要的圖片位置。可以減少HTTP請求數，提高網頁載入速度。
- 結構、表現和行為的分離。另外一個重要的拖慢網頁載入速度的原因就是將css和JS都堆積在HTML頁面上，每次看到有人直接在頁面上編寫CSS和JS我都很痛心疾首。通過外鏈的方式能大大加快網頁載入速度的，css檔案可以放在head裡，JS檔案可以放置在body的最下方，在不影響閱讀的情況下再去載入JS檔案。
- 優化網站分級結構。在每個內頁加麵包屑導航是很有必要的，可以讓蜘蛛進入頁面之後不至於迷路，有條件的話，最好能單獨加個Sitemap頁面，將網站結構一目瞭然地展示在蜘蛛面前，更有利於蜘蛛抓取資訊。
- 集中網站權重。由於蜘蛛分配到每個頁面的權重是一定的，這些權重也將平均分配到每個a連結上，那麼為了集中網站權重，可以使用”rel=nofollow”屬性，它告訴蜘蛛無需抓取目標頁,可以將權重分給其他的連結。
- 文字強調標籤的使用。當著重強調某個關鍵詞需要加粗表示，選用strong標籤比使用b標籤要更有強調作用。
- a標籤的title屬性的使用。在不影響頁面功能的情況下，可以儘量給a標籤加上title屬性，可以更有利於蜘蛛抓取資訊。
- 圖片alt屬性的使用。這個屬性可以在圖片載入不出來的時候顯示在頁面上相關的文字資訊，作用同上。
H標籤的使用。主要是H1標籤的使用需要特別注意，因為它自帶權重，一個頁面有且最多隻能有一個H1標籤，放在該頁面最重要的標題上面，如首頁的logo上可以加H1標籤。
精減程式碼
清除網頁中一些冗餘的程式碼，網上有這樣的工具，可以輔助完成，如果需要的話，我們可以把程式碼中的註釋去掉，甚至空行之類的也去掉，儘量的減少程式碼量，從而減小頁面體積。CSS Sprites
通俗點講，就是圖片合併，可以把網站中一些比較通用的小圖片，合併到一張圖片上，然後利用CSS技術來分別呼叫圖片不同的部分。這樣可以大大的減少HTTP的請求量，在網頁載入的時候，速度就快很多，現在很多大中型網站都在用這個前端加速技術，效果也是很不錯的。為圖片指定寬度與高度
這也是很多人比較容易忽略的，在頁面中，請你為每一個圖片，都指定一個width屬性與height屬性，這樣在頁面載入的時候，瀏覽器會預先留出既定的位置，圖片下邊的程式碼可以繼續下載而不用等待，提高並行下載的速度，提高了頁面載入的速度。啟用Keep-Alive屬性
Keep-Alive你可以理解為長連線，在沒有啟用keep-alive屬性之前，瀏覽器向伺服器請求的connection是即連即斷的，執行一次HTTP請求完成後，馬上斷開這個連線的，而啟用Conncetion的Keep-Alive屬性之後，這個連線可以保持一段時間，從而可以提高頁面載入的速度。使用瀏覽器快取
可以使用快取技術來提高頁面的載入速度，為一些不經常變化的檔案，設定一個相對較長的過期時間，這樣當用戶訪問網站後，就會在它的瀏覽器中留下緩 存，當它在下次請求的時候，留在快取中的元件就不用再向伺服器發出HTTP請求了，這樣減少了瀏覽器向網站伺服器發出的HTTP請求數，從而提高了頁面加 載速度，這在一些圖片比較多的網站，效果是非常明顯的，我們要善於使用快取技術。啟用GZIP壓縮
大中型網站，基本都啟用了GZIP壓縮，如果你使用的是虛擬主機，你可以讓服務商為你啟用，如果自己有伺服器，自己啟用也很簡單的，為什麼啟用GZIP壓縮就會加快速度呢，因為當啟用了GZIP後，網站伺服器向你傳輸資料之前，是經過壓縮了的，當傳輸到你的瀏覽器後，會再被解壓縮的，從而可以在 你的瀏覽器上正常顯示，而且壓縮率可以達到很多高，效果非常好。一般你啟用了壓縮後，搜尋引擎對你網站的抓取量也是上升了的。
前端速度優化方面還有很多工作可以去做，例如大公司都啟用了CDN加速，你的圖片也可以進行無失真壓縮，CSS、JS檔案都可以用一些專業的工具去壓縮，在你網頁的head標頭要宣告字符集，儘量少用重定向，指定Last-Modified 或 ETag標頭等，當然這些都多少涉及了一些技術方面的問題，做頁面前端優化是一個系統的工程，是需要技術、SEO、運維等去配合完成的，不過這個投入是絕對值得的。