日韩无码专区无码一级三级片|91人人爱网站中日韩无码电影|厨房大战丰满熟妇|AV高清无码在线免费观看|另类AV日韩少妇熟女|中文日本大黄一级黄色片|色情在线视频免费|亚洲成人特黄a片|黄片wwwav色图欧美|欧亚乱色一区二区三区

RELATEED CONSULTING
相關咨詢
選擇下列產品馬上在線溝通
服務時間：8:30-17:00
你可能遇到了下面的問題
關閉右側工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
前端通用SEO技術優(yōu)化指南

背景

近期團隊開發(fā)的新產品的官網(wǎng)上線了，隨之而來的問題就是如何讓網(wǎng)站更快更好的傳播出去。當然SEO就是最常見的手段之一，對官網(wǎng)的SEO工作有利于產品的網(wǎng)絡傳播和分享。

有的團隊會有專人負責SEO的工作，那么作為離網(wǎng)站頁面“最近”的前端工程師，可以為SEO做哪些工作呢？

為了更好的沉淀SEO相關內容，為后續(xù)web產品提供優(yōu)化指南，本文就以前端工程師的角度，通過調研沉淀出了前端通用SEO技術優(yōu)化指南。

優(yōu)化方向

SEO常見的技術優(yōu)化手段通常是針對于搜索引擎爬蟲的，通過建立一系列約定的規(guī)則或手段來使得搜索引擎更好地抓取到網(wǎng)站的信息。

我們可以通過兩種方式來提供搜索引擎想要的信息，一種是提供必要的信息在自身的網(wǎng)站服務上被動等待搜索引擎獲取，我們可以命名為：“被動式SEO”。

還有一種是通過搜索引擎服務商提供的后臺管理功能，直接把信息提供給搜索引擎服務商，我們可以命名為：“主動式SEO”。

被動式SEO是常規(guī)地針對所有搜索引擎都開放的優(yōu)化方式，涉及范圍廣，使用標準規(guī)范。而主動式SEO是針對特定的搜索引擎服務商的優(yōu)化，涉及范圍窄但更有針對性，使用標準規(guī)范和特制規(guī)范。

被動式SEO

以下為常見的技術優(yōu)化SEO的方式：

網(wǎng)站優(yōu)化方向：

1、優(yōu)化網(wǎng)站結構

  • 設計簡單易用：增加用戶體驗和爬蟲體驗，有助于搜索排名

  • 突出用戶引導 ：突出用戶留存的關鍵步驟（例如注冊、下載、登錄、快速開始等）

  • 移動端優(yōu)先：適配移動端更易獲取更多的流量和用戶留存

  • 簡單清晰的導航（內鏈）：利于用戶尋址、利于爬蟲爬取

  • 盡量減少使用js來渲染內容：搜索引擎對JS生成內容的爬取處理不佳，前端應用一般使用服務端渲染（SSR）來解決這類問題，避免使用純客戶端渲染（CSR）

  • 打印優(yōu)化：針對有打印需求的客戶，增加用戶體驗

2、優(yōu)化網(wǎng)站內容（內容是SEO的重中之重）

meta-tags

* 以下標簽，可能由于搜索引擎服務商不同而又不同處理

（1）Meta title：標題

  • 最佳實踐：

    • 一個頁面使用一個不重復的標題

    • 簡單精準，避免通用模糊

    • 使用短句或短語

    • 突出搜索意圖

    • 內容不要過長，少于60個字符

  • 編碼：

        
   
   
   
      
     
    
    
    
    1.  
      2. 
     
    
    
    
    2.     這里填寫標題 
      3. 
     
    
    
    
    3.  
      4.

  • 搜索引擎的關聯(lián)展示

 

（2）Meta description：描述

  • 最佳實踐：

    • 一個頁面使用一個獨立的描述

    • 精準地總結頁面內容，避免通用模糊的描述

    • 使用句子

    • 突出搜索意圖

    • 控制內容長度，少于160個字符

  • 編碼：

        
   
   
   
      
     
    
    
    
    1.  
      2. 
     
    
    
    
    2.   
      3. 
     
    
    
    
    3.  
      4.

  • 搜索引擎的關聯(lián)展示：如上圖

（3）Meta robots：搜索引擎告知

  • 編碼：

        
   
   
   
      
     
    
    
    
    1.  
      2. 
     
    
    
    
    2.    
      3. 
     
    
    
    
    3.   
      4. 
     
    
    
    
    4.  
      5.

（4）Meta charset：字符集

  • 編碼：

        
   
   
   
      
     
    
    
    
    1.  
      2. 
     
    
    
    
    2.   
      3. 
     
    
    
    
    3.  
      4. 
     
    
    
    
    4.  
      5.

（5）Meta keywords：關鍵詞

  • 警告：搜索引擎可能不使用該字段進行收錄了，有些甚至認為是垃圾信息

    • google不用：https://webmasters.googleblog.com/2009/09/google-does-not-use-keywords-meta-tag.html

    • bing不用：https://searchengineland.com/the-meta-keywords-tag-lives-at-bing-why-only-spammers-should-use-it-96874

    • 百度可能還在用：https://ziyuan.baidu.com/college/articleinfo?id=2961

  • 最佳實踐：

    • 由于百度中文還是流量大戶，如果使用，盡量簡短有效，過長可能被認為是垃圾信息

    • 如果不考慮百度，可以刪除此標簽

  • 關鍵詞可以讓產品同學確認，常見關鍵詞分類：

    • 核心關鍵詞

    • 品牌關鍵詞

    • 長尾關鍵詞

  • 編碼：

        
   
   
   
      
     
    
    
    
    1.  
      2. 
     
    
    
    
    2.   
      3. 
     
    
    
    
    3.  
      4.

body內容

  • 標題：分級恰當，層級關系明確（標簽：h1、h2、h3），標題含義明確

  • 內容：豐富，準確

圖片內容

  • 文件名稱語義化：img文件名稱最好是有語義的，能標識該圖片內容的

  • 圖片說明 alt-tag：img標簽的alt屬性值不能空，要填寫該圖片的描述

    • 編碼：

            
     
     
     
        
       
      
      
      
      1.  
        2.

3、語義化鏈接

網(wǎng)頁中所有的內鏈語義化：

  • bad case：www.example.com/?p=123456

  • good case：www.example.com/topic-name

4、提升網(wǎng)站速度

前端常規(guī)優(yōu)化手段進行網(wǎng)站速度優(yōu)化，具體手段就不在本文展開。優(yōu)化目標也是提升用戶體驗，當網(wǎng)站速度過慢（相關調查3s是極限），用戶就會引起流失。

* 測速工具：

https://developers.google.com/speed/pagespeed/insights/

5、外部引流

通過各種手段為本站進行引流，提升本站的流量，提升搜索引擎權重

  • 友情鏈接，站群等（跟搜索引擎機制有關，有些引擎會對外鏈增加搜索權重）

  • 結合社交賬號推廣

    • 在網(wǎng)站首屏顯眼位置擺放社交賬號

    • 提供內容分享到社交平臺功能

信息提供方向：

1、sitemaps 網(wǎng)站地圖

提供給搜索引擎網(wǎng)站地圖信息的協(xié)議，通過它可以告知搜索引擎關鍵path信息，類似網(wǎng)站的目錄，可以手動配置，也可以使用生成器自動生成：https://www.xml-sitemaps.com/。

（1）格式

可以是XML、txt等格式，XML格式如下：

 
 
 
 
    
  
  
  
  
  1.   
    2. 
  
  
  
  
  2.   
    3. 
  
  
  
  
  3.     
    4. 
  
  
  
  
  4.    
    5. 
  
  
  
  
  5.     http://www.example.com/ 
    6. 
  
  
  
  
  6.     2005-01-01 
    7. 
  
  
  
  
  7.     monthly 
    8. 
  
  
  
  
  8.     0.8 
    9. 
  
  
  
  
  9.    
    10. 
  
  
  
  
  10.  
    11.

(2) 配置位置

  • 網(wǎng)站根目錄，有些搜索引擎可能會主動爬取。

  • 可以在robots.txt中引用，見下個小結內容。

  • 可以通過主動SEO方式，在搜索引擎服務商后臺進行提交。

2、robots.txt 網(wǎng)絡爬蟲通信

該文件并不是一個標準規(guī)范，是一種約定俗成的協(xié)議。

（1）格式

 
 
 
 
    
  
  
  
  
  1. User-agent: * Disallow:  Sitemap: https://xxx.sohu.com/sitemap.xml 
    2.

（2）配置位置

  • 網(wǎng)站根目錄

（3）其它相關

獨立頁面也可以使用meta robots標簽，和robots.txt可以一起使用，見上方內容。

主動式SEO

依賴各家搜索引擎服務商提供的后臺服務功能來直接優(yōu)化網(wǎng)站搜索，有些功能是免費的，有些功能是付費的，當然付費效果更好：）。常見的如競價排名、直接購買搜索排名等方式。我們這里更關注技術優(yōu)化的內容。

搜索引擎服務商

  • 百度

  • 搜狗

  • 360

  • 必應

  • 谷歌

  • ...

我們可以以360提供的站長功能來說明如何優(yōu)化SEO：可以主動提供給360搜索引擎什么樣的信息以及可以從引擎方得到哪些效果和功能。

360的站長平臺的功能（實施方法參考指南：http://www.so.com/help/help_3_16.html）：

  • 數(shù)據(jù)提交：網(wǎng)站更快、更多的被360搜索引擎收錄（重點要去實施的）

  • 數(shù)據(jù)分析：及時了解網(wǎng)站在360搜索的數(shù)據(jù)情況

  • 搜索展現(xiàn)：優(yōu)化網(wǎng)站頁面在360搜索的展現(xiàn)

  • 優(yōu)化與維護：避免網(wǎng)站因改版或臨時性關停而帶來的收錄、流量、排序等的損失

實施計劃

通過以上的SEO調研，我們可以發(fā)現(xiàn)技術優(yōu)化手段是有跡可循的，所以可以形成一種通用的模式來幫助網(wǎng)站進行SEO優(yōu)化的自檢和實施方案。

我們總結了如下的 SEO checklist 列表，作為通用SEO優(yōu)化方案的實施手段應用在我們的網(wǎng)站上，也為之后其它產品進行SEO優(yōu)化提供了切實可行的實施指南。

通用SEO優(yōu)化方案 checklist

  • [ ] 1.優(yōu)化網(wǎng)站結構

    • [ ] 設計簡單易用

    • [ ] 突出用戶引導 Call-to-Action (CTA)

    • [ ] 移動端優(yōu)先

    • [ ] 打印優(yōu)化

    • [ ] 簡單清晰的導航（內鏈）

    • [ ] 盡量減少使用js來渲染內容

  • [ ] 2.優(yōu)化網(wǎng)站內容

    • [ ] title

    • [ ] description

    • [ ] robots

    • [ ] charset

    • [ ] keywords

    • [ ] meta-tags

    • [ ] body內容

    • [ ] 圖片內容

  • [ ] 3.語義化鏈接

  • [ ] 4.提升網(wǎng)站速度

  • [ ] 5.外部引流

  • [ ] 6.sitemaps 網(wǎng)站地圖

  • [ ] 7.robots.txt 網(wǎng)絡爬蟲通信

  • [ ] 8.搜索引擎服務商后臺SEO優(yōu)化

    • [ ] 百度

    • [ ] 搜狗

    • [ ] 必應

    • [ ] 360

效果評估

當然，實施SEO優(yōu)化方案之后要及時收集和統(tǒng)計數(shù)據(jù)，復盤優(yōu)化效果，為后續(xù)提升SEO優(yōu)化效果不斷積累經(jīng)驗，形成方案不斷自我進化的良性循環(huán)。但技術優(yōu)化手段畢竟是有限的，SEO的優(yōu)化同樣離不開產品的規(guī)劃、運營的引流、搜索引擎服務商洽談合作等有效手段。作為前端工程師，我們不僅僅可以提供SEO優(yōu)化的一條技術線，同樣可以把上游和下游連接起來，綜合推動SEO優(yōu)化的進行，不僅能“制造”網(wǎng)站，也能為網(wǎng)站的推廣和傳播貢獻自己的力量。

附錄

名詞解釋

SEO：Search Engine Optimisation 搜索引擎優(yōu)化

SERP：Search Engine Results Page 搜索引擎搜索結果頁

反鏈數(shù)（外鏈）：指從別的網(wǎng)站導入到某網(wǎng)站的鏈接數(shù)量


本文標題：前端通用SEO技術優(yōu)化指南
標題路徑：http://www.5511xx.com/article/cojiihh.html