SEO 配置 (搜尋引擎最佳化)
前言
什麼是 SEO 呢? > 搜尋引擎最佳化(英語:search engine optimization,縮寫為 SEO)是透過了解搜尋引擎的運作規則來調整網站,以及提高目的網站在有關搜尋引擎內排名的方式。(摘自維基百科)
SEO 優化就是讓搜尋引擎更喜歡你的網站,讓你的網站可以讓更多人看到的過程,接下來我會先從怎麼知道目前網頁的 SEO 狀況,再一一列舉優化的方法,如果只是想要知道如何能在 google 上搜尋到自己網頁的人可以直接看最後一項 google search console 的使用方式。
- 網頁目前 SEO 狀況
- 網頁優化方法
2.1. 網址
2.2. 新增 description
2.3. Nofollow
2.4. sitemap
2.5. robots.txt
2.6. Google Search Console
網頁目前 SEO 狀況
要優化前當然要先看看自己的目前的狀況,可以到 PageSpeed Insights,輸入自己的網頁的網址,就可以知道目前自己網頁的狀況 另外可以搜尋 site:網域
,看看自己的網站是否有被收錄到 google 內,如果還沒做過優化之前應該是什麼都沒有的,那在經過以下的操作後,可以確認你的網頁最少最少可以被搜尋到,如果你的網頁名稱不要太普遍,基本上要出現在第一頁應該不是問題
網頁優化方法
網址
搜尋引擎不喜歡過長或是索引過多的網址 (例如說 https://example.com/abc/def/ghi/jkl/mn
),因此建議把網址設定成你的檔案名稱(但就是要注意檔案名稱不能是中文,不然會變成亂碼),而且盡量跟文章要有關係,像是我這篇文章的檔案名稱就是 success@SEO-Search-Engine-Optimization.md
,如果覺得這樣太麻煩的話可以使用 abbrlink 插件
新增 description
添加 description 可以讓使用者更快速了解你的文章在講什麼,所以對 SEO 也是很重要的部分,而我們需要分別在首頁和文章都個別設定相關的描述
首頁 到最外層的_config.yml
去修改 description
文章 要新增文章的 description 有兩中方法,一個是在文章最上端的細節設定新增 description: 你的description
,但我覺得略顯麻煩,因為我的文章幾乎都有一個前言,因此我就想說直接將前言當作 description,作法很簡單,在前言的底下新增一行 <!--more-->
,就完成了
另外補充,可以在主題內的_config.yml
,將 read_more_btn
設定為 true
,如此一來在瀏覽你的網站時,就只會將文章中 description 的部分呈現出來,讓可讀性更高
Nofollow
關於 nofollow 是什麼詳細可以看這篇文章,總之就是避免你的搜尋引擎權重值被別人分走,使用的是這個插件,如果沒有要設定什麼特別的東西的話,直接執行 npm install hexo-filter-nofollow
,就完成了
sitemap
sitemap 就是用來告訴搜尋引擎我這個網站有哪些網頁,方便搜尋引擎索引,要使用的插件是這個,執行 npm install hexo-generator-sitemap
下載插件 接著到最外層的_config.yml
,添加以下程式碼就完成了1
2sitemap:
path: sitemap.xml
可以試試看你的網址/sitemap.xml
(如果是在本機跑的話應該就是 localhost:4000/sitemap.xml
,有沒有出現東西,有的話就是成功了
robots.txt
到最外層資料夾中的 source
新增一個檔案 robots.txt
接下來再 robots.txt
內貼上以下內容,記得 Sitemap 後面要改成你自己的網址1
2
3
4
5
6
7
8
9
10User-agent: *
Allow: /
Allow: /archives/
Allow: /categories/
Allow: /tags/
Disallow: /vendors/
Disallow: /fonts/
Disallow: /fancybox/
Sitemap: https://你的網址/sitemap.xml
User-agent 是代表要讓哪些搜尋引擎抓取你的網頁,*
就是全部都可以
Allow 這裡是代表允許搜尋引擎抓取網頁的哪些部分,照理來說如果有 Allow: /
就代表全部都可以,後面那些都是保平安用的(xd
Disallow 這裡就是避免搜尋引擎抓到你的字體、程式之類的
Sitemap 就是上面講到的 sitemap.xml
Google Search Console
這個是最重要的一步,前面那些事讓你的 SEO 更好,但如果沒有這個你的網頁大概根本搜尋不到,進入 Google Search Console,新增資源
如果是使用 github page 的就只能用右邊的那個,他會叫你把一個 html 檔放到你的網頁中,你就將它下載,然後儲存到 themes/NexT(或你用其他主題)/source
,重新部署之後稍等一下應該就完成了
如果是有自己網域的話,建議使用左邊的,這樣它涵蓋的範圍會比較廣,將它提供的 TXT 紀錄複製下來,然後添加網域的 DNS 設定,我這裡是用 namecheap,各家的使用方式也都大同小異,新增 TXT Record
,Host
設定 @
,Value
設定剛剛複製的 TXT 紀錄,幾分鐘後就會通過驗證了
進入你的資源後裡面有很多資訊可以查詢,以下列出三點我認為較重要的說明
搜尋網頁索引狀態 可以透過上面的搜尋看自己網頁的索引狀態,如果發現沒有建立索引可以點擊要求建立索引
,加速建立索引的時間,讓搜尋可以在更短的時間內將它放在搜尋的頁面上
檢查網頁索引狀態 這個頁面可以很快看到哪些頁面已經被搜尋引擎找到,哪些已經建立索引,搭配剛剛上面的搜尋就可以迅速知道目前各個網頁的狀態
新增 Sitemap 在這個頁面就是用來把之前生成的 Sitemap 交給 google 看,讓他更清楚你的網頁們
結語
恭喜你的網頁現在已經可以在 google 上被查詢上了,可以在使用 PageSpeed Insights 看看 SEO 的分數有沒有上升,也可以看他說你哪個地方不足去修正,分數應該就可以拿到幾乎 100 的分數了,如果有問題或者發現我有哪裡講錯,歡迎大家到底下留言區跟我討論喔~
其他功能
側邊欄
SEO:搜尋引擎最佳化 (Search Engine Optimization) ✅