市面上有很多 HTML 檢查工具,但是都無法很完整的檢查網頁內該有的元素是否存在以及是否正確,因此只好自己撰寫一個 Google Chrome 外掛 : SEO 研究院 HTML Checker,並且還可以將檢查結果匯出,以便日後查核。
這是一個完全免費的瀏覽器外掛工具,歡迎安裝並給予好評,如果有其他需求也歡迎提出。
這個外掛的主要功能如下 :
(1) 檢查連線與安全
1. 檢查網頁的 HTTP Response Code 是否為 200?
2. HTTPS 使用狀態是否正確?
3. 網頁內是否存在 Broken Link (失效連結)?
4. 網頁內是否存在 Mixed Content? 也就是在 HTTPS 內是否混雜著 HTTP ?
以上的檢查項目中,最常被忽略的就是 Mixed Content,根據 Google 在 2019年的公告 : No More Mixed Messages About HTTPS,清楚告訴大家 Mixed Content 會有安全疑慮,因此會預設封鎖。如此會導致三個後果 : 直接影響 HTTPS 排名加分失效與安全性警告、間接影響網站體驗與 SEO 核心指標下滑、以及使得 Googlebot 爬取失敗與資源缺失。
如果檢查網頁內的連結與資源太密集的話,很可能會被伺服器阻擋,因此介面上提供了三種抓取延遲 (Request Delay) : 0.5秒、1秒、1.5秒,如下圖。
如果你不確定伺服器阻擋的情況,建議從1.5秒開始使用。
因為網頁內部的連結可能很多,因此檢查範圍也提供選擇 : 隨機檢查5個連結、只檢查主文內的連結 (也就是不包含選單跟側邊欄的連結)、全部檢查,如下圖。
(2) HTML 基本結構
1. HTML 基本框架是否正確?
檢查 html、head、body 是否均唯一存在? 因為看過有些網站會莫名其妙的出現 2 個 <HTML> 或是 <BODY>,通常發生在手誤的情況、將 AI 給的語法直接放入內容、或是錯誤的套用範本。
2. HTML Lang 是否設定? 正常來說繁體中文 lang="zh-TW" 為有效的語言標記。 正確的語言設定有助於搜尋引擎、瀏覽器及輔助技術判斷頁面的主要語言。
3. Meta Charset 是否設定? 正常來說繁體中文 charset="UTF-8" 為有效的字元集。 UTF-8 可支援繁體中文及大多數語言文字,也是目前網頁最普遍使用的字元編碼。
4. Meta Viewport 是否設定? 在 head 內應該唯一存在且內容不為空白,Viewport 是行動裝置正確顯示網頁版面的基本設定,也是判斷網站是否具備響應式網頁設計 (RWD) 基礎條件之一。
(3) 搜尋引擎抓取與索引
1. Meta Robots 是否存在阻擋搜尋引擎抓取與索引的設定?
2. X-Robots-Tag 是否存在阻擋搜尋引擎抓取與索引的設定?
3. robots.txt 是否阻擋搜尋引擎抓取?
4. Canonical 是否存在且不重複?
5. Hreflang 是否存在且不重複?
6. Alternate 是否存在且不重複?
7. Sitemap 是否存在?
8. Atom Feed 是否存在?
9. RSS Feed 是否存在?
以上這些設定都會影響搜尋引擎抓取與索引的行為,因此必須嚴格的檢查。
(4) 頁面標題與內容結構
1. Title 標題是否存在於 head 區域內並且唯一存在且不為空白?
2. Meta Description 是否存在於 head 區域內並且唯一存在且不為空白?
3. H1 是否唯一存在且非空白?
4. H2~H6 是否內容均不為空白?
5. 圖片 Alt 是否均不為空白?
H1 是否必須唯一存在? 這點有不同的說法。Google 在文件撰寫規範中確實曾經要求「H1 唯一存在」,因此在這個檢查工具中,還是檢查「H1 是否唯一存在且非空白」,也當成一個檢查點。
如果你認為 H1 可以沒有 (首頁就可能沒有),也可以多個,那就忽略這項檢查。
(5) 結構化資料
1. Schema.org 是否存在? 有哪些格式與型別組合?
2. Open Graph 是否存在? 有哪些 Open Graph 宣告?
3. Twitter Card 是否存在? 有哪些 Twitter Card 宣告?
3. Twitter Card 是否存在? 有哪些 Twitter Card 宣告?
(6) 網站技術與數據工具
1. 前端框架檢查 : 用來了解網頁框架。
2. CMS 檢查 : 用來了解網頁的內容管理平台。
3. GA4/GTM : 用來了解網頁是否安裝數據工具?
4. Google Search Console 驗證線索 : 用來了解網頁是否使用 GSC? 當然 DNS 或檔案驗證方式無法由本頁確認。
5. Bing Webmaster Tools 驗證線索 : 用來了解網頁是否使用 BWT? 當然 DNS 或檔案驗證方式無法由本頁確認。
(7) AI 與代理協定
1. Universal Commerce Protocol (UCP) 是否存在?
2. Web Model Context Protocol (WebMCP) 是否存在?
3. LLMs.txt 系列檔案是否存在? 會尋找 llms.txt、llms-full.txt、llms-ctx.txt 或 llms-ctx-full.txt。
2. Web Model Context Protocol (WebMCP) 是否存在?
3. LLMs.txt 系列檔案是否存在? 會尋找 llms.txt、llms-full.txt、llms-ctx.txt 或 llms-ctx-full.txt。
以上三個跟 AI 有關的檔案及協定,雖然目前還不普遍,但是也必須開始關注。
SEO 研究院也曾經在"llms.txt 是必要的嗎? 是否該花時間建置?"提過,認為「如果不麻煩,可以建置,以備不時之需。但是如果你的網站是客製化網站,沒有外掛幫你產生,可以密切觀察再說。」
簡單來說,UCP 與 WebMCP 就是要讓網站更容易被 AI Agent 理解與操作,UCP 就是要讓 AI 代理可以直接在電子商務網站搜尋產品、下單、結帳的協定;WebMCP 就是要讓 AI Agent 可以「操作網站」的協定。
整個檢查完成之後,你可以將檢查結果匯出報表,如下圖 :
[使用注意事項]
SEO 研究院 HTML Checker 外掛在使用時,如果不要離開開啟的頁籤 (tab),外掛工具會停留在原來的工作狀態。也就是你正在檢查網頁A,只要不離開網頁A,點選外掛工具的圖示就會回到原來的工作狀態,不需要讓你重頭再檢查一遍。
但是如果你離開開啟的頁籤 (tab),也就是在檢查網頁A時,你點選其他頁籤 (tab) 的話,外掛工具就會回到初始狀態。
本工具完全符合 Google Web Store 相關規範,隱私權聲明請參考 :
https://blog.dns.com.tw/p/privacy.html
https://blog.dns.com.tw/p/privacy.html
