SEO優化，小白程序員如何做SEO優化流量從0到1

原文鏈接：SEO優化，小白程序員如何做SEO優化流量從0到1

1、SEO是什么？

SEO即：搜索引擎優化(Search Engine Optimization)，是一種通過優化網站結構、內容和外部鏈接等因素，提高網站在搜索引擎中的自然排名（即非付費搜索結果）的技術和過程。
我們通常都說：SEO優化、網站優化、搜尋引擎優化。

比如星云導航在Bing搜索引擎上的搜索結果，即SEO優化最終效果：

bing搜索星云導航.png

網站頁面的SEO及收錄情況是基于搜索引擎的爬蟲技術自動抓取、分析等操作。后面我們會再詳細介紹下搜索引擎的爬蟲技術。

2、優化網站排版

搜索引擎爬蟲喜歡的內容：語義化的HTML代碼，符合W3C規范。

對于網站內容的排版要合理，多使用語義化的HTML代碼，以下為一些常見的語義化HTML代碼：

<!-- 框架類 -->
<header>...</header>
<nav>...</nav>
<section>...</section>
<article>...</article>
<aside>...</aside>
<footer>...</footer><!-- 標題類 -->
<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6><!-- 列表類 -->
<ul></ul>
<ol></ol><!-- 表格類 -->
<table></table>
<th></th>
<tr></tr>
<td></td><!-- 段落標記 -->
<p></p><!-- 圖片標記 -->
<img /><!-- 鏈接標記 -->
<a></a><!-- 引用標記 -->
<blockquote></blockquote>
<q></q>

可能羅列不全,可以自行去看看W3C規范,盡量不要什么都用div、span，這些是無語義的，除非他們的必要性。網站頁面內容還是要做更為優質的內容才能更容易SEO優化。

3、title、meta關鍵字優化

關于title說明

<title> 標簽定義文檔的標題，在所有 HTML 文檔中是必需的。
<title>元素：定義瀏覽器工具欄中的標題、提供頁面被添加到收藏夾時的標題、顯示在搜索引擎結果中的頁面標題。

關于meta說明

元數據（Metadata）是數據的數據信息。
<meta> 標簽提供了 HTML 文檔的元數據。元數據不會顯示在客戶端，但是會被瀏覽器解析。
META元素通常用于指定網頁的描述，關鍵詞，文件的最后修改時間，作者及其他元數據。
元數據可以被使用瀏覽器（如何顯示內容或重新加載頁面），搜索引擎（關鍵詞），或其他 Web 服務調用。

引用: 菜鳥教程-HTML 標簽

對于搜索引擎爬蟲來說，標題會比meta權重更高一些，所以對于title的命名也是比較重要的。怎么才能在搜索引擎搜索的時候，搜索到你的標題內容呢？這個就需要對title關鍵字進行優化了。

3.1、 title關鍵字

對于關鍵字，搜索引擎對于長尾關鍵字更為友好，長尾關鍵字具有很多好處：減少競爭、更高的轉化率、幫助你優化語義搜索。所以我們更多的是用的長尾關鍵字。

對于長尾關鍵字的命名格式一般如下格式：

網站類：目標關鍵字（1-3個） + 修飾詞 + 品牌詞

星云導航 - 打破認知壁壘，導航你的網站世界

星云導航 - 暢游互聯網，從這里開始的導航網站

欄目類：欄目關鍵字 + 品牌詞

摸魚熱榜 - 星云摸魚熱榜是一個集合網上優質平臺的熱搜榜，上班摸魚的不二選擇。

文章類：直接可用文章標題

SEO優化，小白程序員如何做SEO優化流量從0到1

星云導航：開啟您的互聯網資源探索之旅

探索星云導航：一站式互聯網資源與工具大全

HTML頁面配置

每個頁面都按上面的格式定義自己的title長尾關鍵字，對于搜索引擎會更為友好。

<!DOCTYPE html>
<html lang="zh-CN"><head><title>星云導航 - 打破認知壁壘，導航你的網站世界</title></head><body><div id="app"></div></body>
</html>

3.2、meta關鍵字

meta關鍵字上面解釋過了是什么，接下來直接講幾個常用的meta標簽及內容。

keywords：文檔關鍵詞，用于搜索引擎內容一般為你用于搜索引擎搜索的一些關鍵字。

比如：星云導航定義的關鍵字如下：

<meta name="keywords" content="星云導航,星云系,網址導航,網址大全,工具導航推薦,上網導航推薦,網站導航推薦,導航網站,xygalaxy,最好的導航網站,星云導航網站,星云導航網站推薦,導航網站分類,網址大全分類">

description：web頁面描述內容一般為你用于搜索引擎搜索的描述。

比如：星云導航定義的關鍵字如下：

<meta name="description" content="星云導航（www.xygalaxy.com）是一個集合網上優質網站網址導航。網站內容包括：摸魚熱榜，全棧知識技術體系，星云API，熱門推薦，AI智能，在線工具，技術文檔，開發工具，學習充電，視頻影視，模板圖庫，媒體運營，設計美化，休閑娛樂，音樂MV，必備軟件，導航網站，搜索引擎，其他相關等。致力于打破認知壁壘，導航你的網站世界。">

以上兩個是相對重要的，其他的還有一些就不一一展示了，可以自行查找meta關鍵字：

<!-- 指示搜索引擎不要追蹤(即抓取)網頁上的任何出站鏈接 -->
<meta name="robots” content="nofollow” />
<!-- 定義作者 -->
<meta name="author" content="banTang">
<!-- 每30秒刷新頁面 -->
<meta http-equiv="refresh" content="30">

3.3、星云導航首頁的完整title和meta

<!DOCTYPE html>
<html lang="zh-CN"><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><meta name="keywords" content="星云導航,星云系,網址導航,網址大全,工具導航推薦,上網導航推薦,網站導航推薦,導航網站,xygalaxy,最好的導航網站,星云導航網站,星云導航網站推薦,導航網站分類,網址大全分類"><meta name="description" content="星云導航（www.xygalaxy.com）是一個集合網上優質網站網址導航。網站內容包括：摸魚熱榜，全棧知識技術體系，星云API，熱門推薦，AI智能，在線工具，技術文檔，開發工具，學習充電，視頻影視，模板圖庫，媒體運營，設計美化，休閑娛樂，音樂MV，必備軟件，導航網站，搜索引擎，其他相關等。致力于打破認知壁壘，導航你的網站世界。"><title>星云導航 - 打破認知壁壘，導航你的網站世界</title></head><body><div id="app"></div></body>
</html>

4、爬蟲了解

搜索引擎爬蟲（Spider）是搜索引擎的重要組成部分，主要負責從互聯網上抓取網頁內容，并將其存儲到搜索引擎的數據庫中，以便后續的索引和檢索。

爬蟲工作原理通常包括以下幾個步驟：

確定抓取范圍：爬蟲程序首先需要確定需要抓取的網頁范圍，一般是從搜索引擎的數據庫中獲取待抓取的網頁 URL。
抓取網頁內容：爬蟲程序通過 HTTP 協議向網站發送請求，獲取網頁內容，并將其存儲到搜索引擎的數據庫中。
解析網頁內容：爬蟲程序需要對網頁內容進行解析，以提取出關鍵信息，例如網頁標題、網頁描述、網頁關鍵字、鏈接等。
存儲網頁內容：爬蟲程序需要將解析出的網頁內容存儲到搜索引擎的數據庫中，以便后續的索引和檢索。
更新網頁內容：爬蟲程序需要定期更新已經抓取的網頁內容，以保證搜索引擎的數據庫中的內容是最新的。

搜索引擎爬蟲的底層原理主要是基于 HTTP 協議和 Web 技術。爬蟲程序通過 HTTP 協議向網站發送請求，獲取網頁內容，并通過分析網頁內容來抓取和存儲網頁數據。爬蟲程序一般遵循 Web 標準，通過分析 HTML、CSS、JavaScript 等網頁技術，來抓取網頁內容和提取關鍵信息。同時，爬蟲程序還會對網頁的質量、內容等進行分析，以確定網頁的權重和排名。搜索引擎爬蟲的核心技術包括 URL 管理、網頁抓取、內容解析和數據存儲等方面。

知道了爬蟲喜歡什么，就可以明白相應的優化方向，上面我們已經優化好了網站頁面的結構和內容、title、meta關鍵字。接下來我們應該告知爬蟲我們有什么了。

引用參考：搜索引擎爬蟲的工作原理是什么？底層原理是什么？、google搜索引擎爬蟲爬網站原理

5、網站地圖Sitemap

sitemap就是網站的地圖導航，讓爬蟲來了知道爬取什么內容。

爬蟲不是會自動爬取網頁的URL鏈接嗎？為什么我們還要做網站地圖？

為什么我們還要做網站地圖.png

上面這個是真實的百度爬蟲爬取網頁內容，爬蟲為了不影響網站的性能，一般爬取一個頁面內容前200k（一般情況），所以一般都建議大家在設計網頁的時候盡量不要超過200K，如果網頁必須大于200K，則要將重要的鏈接和關鍵詞布局的重點放在網頁的上半部分，這樣也會讓網站獲得不錯的排名。

明細這個200k對于一個網頁來說不太合理吧？萬一一個很多鏈接內容什么的都在頁面底部就不能被爬蟲繼續爬取了。所以我們就需要制作一個網站地圖，讓爬蟲可以知道網站的哪些鏈接可以被爬取。

網站地圖sitemap制作

在線的有很多，也可以在星云導航中查找sitemap，都是在線不錯的工具。

星云導航中查找sitemap.png

不過我們這里不用上面的在線工具，用比較有名的愛站SEO - 愛鏈工具，當然這個也能在星云導航中查找到。

愛站SEO - 愛鏈工具下載頁面

愛鏈工具.png

下載完成之后，打開愛站工具包，需要登錄一下

愛站工具包.png

添加網站直接爬取就可以了

添加網站直接爬取就可以了.png

之后就會生成一份網站完整的網站地圖sitemap了，之后搜索引擎收錄及優化需要用到，部署到網站的根目錄下，能夠正常訪問就行，一般都是sitemap.xml。星云導航的sitemap可以看下：
星云導航sitemap.xml、星云導航sitemap.html

還會有個robots.txt也要部署到根節點上：星云導航robots.txt

6、網站收錄

搜索引擎收錄了網站，才能被搜索引擎搜索到。需要到各個平臺進行收錄。

收錄平臺：

百度收錄
必應收錄
愛站網
谷歌收錄
360收錄
神馬站長
搜狗收錄
頭條收錄

可以查看星云導航中的站長工具，也可以搜索收錄，都是比較常用的。

收錄平臺.png

百度收錄實踐

注冊之后，增加站點（記得之前需要驗證），先抓取診斷一下，百度提交sitemap有錯的話后面會有限制，反正最好保證沒有問題了再提交sitemap。

百度收錄實踐.png

完成上面的步驟之后，就等爬蟲來爬取就可以了，定期查看是否有問題，一般內容沒問題在一周內都會有正常收錄。

7、外鏈

外鏈是指其他網站鏈接到你的網站的鏈接，具有提升搜索引擎排名的功效。

這里面提供幾種方式供大家參考：

超級SEO推廣工具，也就是外鏈推送工具，需要沒有nofollow規則，可在星云導航查找
導航類網站提交收錄
友情鏈接，歡迎大家需要的來星云導航找我交換友鏈

8、SEO軟文

軟文是指通過軟文推廣的方式，在互聯網上發布一些與網站相關的內容，以達到提升網站排名的目的。

發布平臺：

可以在一些媒體的圖文平臺進行發布，比如：微信公眾號、知乎、CSDN這些方面進行引流。

發布平臺.png

上面我們已經將SEO的優化基本都完成了，接下來就要看具體的效果了

9、網站統計工具

對于網站的內容監控，我們需要增加一下網站的統計。

常用的網站統計工具有：

百度統計
Google Analytics
Statcounter
友盟統計

百度統計案例

百度統計案例.png

星云導航案例如下：

<!DOCTYPE html>
<html lang="zh-CN"><head><meta charset="utf-8" /><meta http-equiv="X-UA-Compatible" content="IE=edge" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><meta name="keywords" content="星云導航,星云系,網址導航,網址大全,工具導航推薦,上網導航推薦,網站導航推薦,導航網站,xygalaxy,最好的導航網站,星云導航網站,星云導航網站推薦,導航網站分類,網址大全分類"><meta name="description" content="星云導航（www.xygalaxy.com）是一個集合網上優質網站網址導航。網站內容包括：摸魚熱榜，全棧知識技術體系，星云API，熱門推薦，AI智能，在線工具，技術文檔，開發工具，學習充電，視頻影視，模板圖庫，媒體運營，設計美化，休閑娛樂，音樂MV，必備軟件，導航網站，搜索引擎，其他相關等。致力于打破認知壁壘，導航你的網站世界。"><link rel="icon" href="/favicon.ico" /><title>星云導航 - 打破認知壁壘，導航你的網站世界</title><!-- 各平臺收錄驗證 --><meta name="360-site-verification" content="" /> <!--360--><meta name="sogou_site_verification" content="" /> <!--搜狗--><meta name="bytedance-verification-code" content="" /> <!--頭條搜索--><!-- 百度統計 --><script>var _hmt = _hmt || [];(function() {var hm = document.createElement("script");hm.src = "https://hm.baidu.com/hm.js?id";var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s);})();</script></head><body><div id="app"></div></body>
</html>

10、SPA應用的SEO問題

SPA應用為什么會SEO不友好，這里就不過多解釋，有遇到這個問題的可以網上看看。我用的是VUE開發的導航網站，所以永遠都是只有一個頁面，可以通過下面的命令進行查看。

crul 站點鏈接地址

對于VUE應用來說打包后都是JS腳本進行渲染的，所以爬蟲直接訪問都是沒有內容的，因為JS腳本沒有被執行，所以只會有APP一個節點，爬蟲不會去爬取執行JS腳本，如下：

<html lang="zh-CN"><head><meta charset="utf-8" /><meta http-equiv="X-UA-Compatible" content="IE=edge" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><meta name="keywords" content="星云導航,星云系,網址導航,網址大全,工具導航推薦,上網導航推薦,網站導航推薦,導航網站,xygalaxy,最好的導航網站,星云導航網站,星云導航網站推薦,導航網站分類,網址大全分類"><meta name="description" content="星云導航（www.xygalaxy.com）是一個集合網上優質網站網址導航。網站內容包括：摸魚熱榜，全棧知識技術體系，星云API，熱門推薦，AI智能，在線工具，技術文檔，開發工具，學習充電，視頻影視，模板圖庫， 媒體運營，設計美化，休閑娛樂，音樂MV，必備軟件，導航網站，搜索引擎，其他相關等。致力于打破認知壁壘，導航你的網站世界。">                <link rel="icon" href="./favicon.ico" /><title>星云導航 - 打破認知壁壘，導航你的網站世界</title><!-- 各平臺收錄驗證 --><meta name="360-site-verification" content="" /> <!--360--><meta name="sogou_site_verification" content="" /> <!--搜狗--><meta name="bytedance-verification-code" content="" /> <!--頭條搜索--><!-- 百度統計 --><script>var _hmt = _hmt || [];(function() {var hm = document.createElement("script");hm.src = "https://hm.baidu.com/hm.js?id";var s = document.getElementsByTagName("script")[0];s.parentNode.insertBefore(hm, s);})();</script><script type="module" crossorigin src="./assets/js/index.js"></script></head><body><div id="app"></div></body>
</html>

VUE的SEO解決方案：預渲染、服務端渲染（SSR）

VUE官方給出的解決方案：

VUE官方給出的解決方案.png

下面是幾個思路，希望對你有幫助

預渲染插件：prerender-spa-plugin
Nuxt、Quasar、Vite SSR
Puppeteer服務端渲染
用后端進行渲染，比如SpringMVC就是渲染完之后才返回的，就是服務端渲染，構建一個空頁面嵌套好前端。

建議需要SEO的朋友還是一開始就選擇SEO友好的框架，不然真的累。

11、SEO綜合查詢分析

站長工具

摘抄了幾個常見的SEO專業術語，參考：SEO常用專業術語：

百度權重：百度權重是愛站、站長工具等網站推出的針對網站關鍵詞排名預計給網站帶來流量，劃分等級0-10的第三方網站歡迎度評估數據，百度官方明確表示不承認百度權重。
域名權重：一個域名在搜索引擎上的排名的綜合實力，域名權重是很多因素的總和，包括域名種類、歷史、文章內容原創性鏈接關系等。
robots協議：是搜索引擎的一部分來定位和索引互聯網上的每個可能回答搜索請求的網頁，通常只在討論 robots的HTML標簽或者robots.txt文件的時候使用。
alexa排名：Alexa是一家專門發布網站世界排名的網站。
關鍵詞排名(ranking)：搜索引擎所使用的技術來揀選匹配網頁，生成搜索結果頁面，有些搜索引擎是按日期揀選搜索結果，而大部分的搜索引擎是按照相關性排名，決定最終排名執行的軟件代碼被稱為排名算法，并且它是每個搜索引擎公司的核心商業機密。
死鏈接：死鏈接是網站建設中的專業術語，也就是無效鏈接，就是那些不可達到的鏈接，頁面已經無效化，無法給用戶提供任何有價值信息的頁面就是死鏈接，包括協議死鏈和內容死鏈兩種形式。
網站降權：利用搜索引擎策略缺陷，以惡意手段獲取與網頁質量不符排名，而引發搜索結果和用戶體驗下降的行為都會被搜索引擎視為作弊行為，作弊應為按照“輕者輕罰，重者重罰”原則：對用戶體驗及搜索結果質量影響不大的，去除作弊部分所獲權值，對用戶體驗及搜索結果質量影響嚴重的，去除作弊部分所獲權值并降低網站權重(降權)，直至徹底清理出搜索結果。
流量(traffic)：網站評測屬術語，被用來描述網站的訪問數量，網站評測會頻繁地分析流量的增減，并且它們通常會評估搜索營銷通過搜索引擎來訪問的成功。
網站關鍵字過度優化：過度優化是指網站SEO優化太明顯了，讓搜索引擎認為你的站是一個垃圾站點，認為你是在作弊，這樣你是為了做站而做站，做的站是給搜索引擎看的，而不是給瀏覽者看的!這樣的站點用戶體驗自然不好，用戶自然不喜歡，用戶不喜歡了搜索引擎自然也不會喜歡，所以這類站點是搜索引擎所討厭的站點。

SEO是個長時間的活，對于新站沒什么流量來說，需要較長的時間，提升網站質量內容，提升用戶體驗才是SEO的根本。