學會利用Sitemap提高網站內容的曝光，Google是如何抓取網站的其他頁面？

是咁的，係我向Google請求索引大概等了一個星期左右，我最近寫嘅博客網站終於都被Google成功索引了。宜家可以係搜尋引擎到用關鍵字搵到。不過就發生咗一啲我無諗過嘅情況...

前言

就如開頭所言，我發現除了主頁之外，其他的文章都不能夠在搜尋引擎上找出來，這可能意味著Google的引擎並沒有索引主頁以外的頁面。所以為了查證問題的出處，我去了Google Search Console上查看網站的索引狀況。就如預想的一樣，在主控台中只有主頁的資料，並沒有索引到其他頁面。

Google Search Console是Google提供給網站開發者的後台，當中有著各種工具去報告網站在谷歌搜尋引擎中的表現。開發者可以申請讓引擎去主動索引自己的網站，當然開發者在使用主控台前需要證明網站的所有權。

問題

在查看Google的文檔後，我找了幾個會導致引擎沒有索引其他頁面的原因：

網站是新建立的
網站是獨立於主頁的，即沒有提供通往其他頁面的連結
網站太多頁面，導致可能忽視了新建立的頁面

另外此文章主要也是總結官方文檔中提及的要點，以及相關的最好做法，也會結合我自己的理解。

解決方法

解決方法有兩種。第一是一直等待直到引擎把網站再爬一遍，或是再發出索引請求，但是問題就是我們不確定引擎是否能爬到我們想要索引的頁面連結。第二就是使用Sitemap，讓引擎能更快地了解網站上有什麼重要的頁面。

介紹Sitemap

Sitemap是一個開發者放在伺服器上的一個文字檔案，檔案上會記錄了主頁的連結，其他頁面的連結，更進階的可以加上頁面中的一些相片和影片的連結。主要就是幫助引擎更迅速有效的知道網站中的更新或是新頁面。

一定要Sitemap嗎

官方文檔建議，當網站很大很多頁面時才需要提供Sitemap，但是對於新的網站以及很常更新的也會有幫助於搜尋引擎去索引新的頁面。總而言之，對於是否應該提供Sitemap，文檔的建議是提供會有助於網站的，反正也沒有害，所以如果不是特別麻煩就提供吧！

注意事項

據文檔所述，即使我們使用了Sitemap也不會保證Google一定會索引所有指定的頁面，爬蟲機器人會因應網站的內容或是排名去判斷是否索引網站上的頁面。可能是因為爬蟲也是一種相當耗費資源的操作，尤其網絡上有這麼多的網站和頁面，如果網站上的Sitemap記錄了很多沒有意義的頁面則會浪費爬蟲資源。以下是其他需要注意的事項：

爬蟲機器人不會每次爬蟲時都更新Sitemap，只會在第一次爬取到Sitemap時進行索引。
網站頁面很常會有多語言或重複內容等情況，在Sitemap上建議只記錄canonical的連結。
Sitemap上記錄的頁面連結需要是完整的，爬蟲機器人會直接爬記錄的連結。
有沒有使用Sitemap並不會影響SEO的排名。
單個sitemap檔案只能記錄50,000條連結，如果有更多的頁面需要把檔案分成多個檔案。

Sitemap的格式

以Google為例，他們支援幾種的Sitemap文檔格式。常見的會是XML，然後就是RSS，mRSS和Text純文字。這個博客網站的Sitemap則是使用XML的格式來記錄，也就是最普遍的做法。XML是一種標記語言，用於傳遞數據。就像HTML一樣，有著頭標籤與尾標籤一對的包裹著內容。

# https://blog.samkalok.com/sitemap-0.xml
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <url>
    <loc>https://blog.samkalok.com</loc>
      <lastmod>2023-01-30T15:44:36.459Z</lastmod>
      <changefreq>daily</changefreq>
      <priority>0.7</priority>
  </url>
  <url>
    <loc>https://blog.samkalok.com/en</loc>
      <lastmod>2023-01-30T15:44:36.459Z</lastmod>
      <changefreq>daily</changefreq>
      <priority>0.7</priority>
  </url>
  <url>
    <loc>https://blog.samkalok.com/post/setup-sitemap-for-google-search-engine-to-know-the-pages</loc>
      <lastmod>2023-01-30T15:44:36.459Z</lastmod>
      <changefreq>daily</changefreq>
      <priority>0.7</priority>
  </url>
</urlset>

可以看到以上的Sitemap，每一個頁面的資料都會用<url>標籤包著，而網址則會使用<loc>標籤包著。可以看到還有其他的標籤，例如<lastmod>、<changefreq>、<priority>。這些資料其實幫助並不大，官方文檔也表示只會使用三個標籤當中的<lastmod>，因為這個博客網站的Sitemap使用套件生成的（後面會提到），所以我就先放著這些標籤。

# https://blog.samkalok.com/sitemap.xml
<sitemapindex xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <sitemap>
    <loc>https://blog.samkalok.com/sitemap-0.xml</loc>
  </sitemap>
</sitemapindex>

下面的這個sitemap.xml其實才是這個網站sitemap的入口，用於整合不同sitemap檔案。由於我使用了套件去生成，而預設則是會分成多個sitemap文檔的，可能是方便後續多於50,000條連結時的考量。可以看到這個入口文檔是用<sitemapindex>的標籤來包著的，示意這是一個整合的sitemap。

製作Sitemap

製作Sitemap的方法主要有三個：手動打上所有網頁的連結、用網上的爬蟲平台生成、以及使用編程框架的套件生成。以下會大概講解爬蟲平台的做法，以及使用套件的方法。

爬蟲平台生成

線上的平台好像有很多，不過本次會使用更多人推薦的xml-sitemaps.com。使用方法也很直接，直接輸入網站的連結，平台就會立刻進行爬蟲，等一等就可以看到生成的Sitemap了。

不過由於這些爬蟲平台就像搜尋引擎的機制一樣，請確保網站上的連結是可以在源碼上看見的，例如連結使用<a>標籤中的屬性上有填寫到，不要使用JS函數的方式去跳轉。

另外這些爬蟲平台也不是免費的給所有使用者服務，通常爬取的頁面也會有數量限制。例如這次使用的平台則是500個頁面為上限。

套件生成 - next-sitemap

因為網站是使用Next.js去寫的，所以會利用這個框架提供的便利。這次演示的套件是next-sitemap，應該是Next.js上使用率最高的套件。以這個網站為例，所有的文章頁面都是在伺服器啟動時靜態生成的，套件會在網站頁面生成後把生成出來的頁面連結都記錄下來，然後放進新創建的sitemap.xml裡。同時也會創建robot.txt，讓搜尋引擎了解網站可以爬取與不可以爬取的頁面的相關資訊。

首先可以安裝套件：

npm i next-sitemap

再來就是在根目錄創建一個next-sitemap.config.js的設定檔案：

# next-sitemap.config.js

/** @type {import('next-sitemap').IConfig} */
module.exports = {
  siteUrl: process.env.SITE_URL || 'https://example.com',
  generateRobotsTxt: true, // (optional)
  exclue: [
    "*/en/*",
  ]
  // ...other options
}

套件會自動生成所有render的頁面，包括其他語言的文章。由於官方文檔提到建議只記錄主語言的連結，而且我也把繁體中文定為了主要語言，所以就使用了exlude去把所有含有/en/路徑的頁面都忽略了。

最後就是在package.json中加上運行next-sitemap功能的指令：

# package.json

{
  ...
  "scripts": {
    "build": "next build",
    "postbuild": "next-sitemap --config next-sitemap.config.js
  },
  ...
}

npm的腳本在執行build指令時會觸發到另外兩個的Hooks，prebuild和postbuild。分別是build指令前會執行腳本以及之後的腳本，以下的指令是等價於上面提到的。

"build": "next build && next-sitemap --config next-sitemap.config.js"

使用了這些腳本的Hooks就可以更加簡潔地管理我們的項目，不用把很多指令擠在一起。

當我們運行npm build時，當所有頁面生成後，next-sitemap就會通知我們sitemap.xml以及robot.txt已經創建了，除了告訴我們它對sitemap進行了分檔以外，還有相關檔案的位置。

總結

善用Sitemap可以讓搜尋引擎更有效地索引網站的不同頁面，即使Google不一定把所有的頁面都索引，但是對於新的網站也是很有幫助的。而且需要學會利用工具來生成sitemap的檔案，因為隨著網站頁面的增加，手打資料的話維護成本會很高。

參考資料

Sitemaps in Search Console - Google Search Console Training - https://www.youtube.com/watch?v=JlamLfyFjTA
Learn about sitemaps - Google Search Central Documentation - https://developers.google.com/search/docs/crawling-indexing/sitemaps/overview
Why is my page missing from Google Search? - https://support.google.com/webmasters/answer/7474347?hl=en
What is a Sitemap – Introduction to XML Sitemaps In SEO - https://www.infidigit.com/blog/what-is-sitemap/
Sitemaps XML format - https://www.sitemaps.org/protocol.html
Next Sitemap: Sitemap Generator for Next.js - https://morioh.com/p/2f2dc991cc60