網站圖示檢查
檢查網站的 favicon 是否符合 Google 搜尋的要求:正方形、至少 8×8 像素、以支援的 rel 宣告,且 Googlebot-Image 能夠檢索。
這裡的每一條規則都來自 Google 官方的網站圖示文件,而非坊間說法。
這個工具需要伺服器。瀏覽器不被允許讀取其他網站的原始碼,因此由我們的伺服器取得頁面、只讀取其 <head> 並回報結果。你輸入的網址會送到我們的伺服器;檢查內容不會被儲存。
這個工具做什麼
輸入網站位址,這個工具會取得該頁面、找出它宣告的每一個圖示、下載回來,並逐一比對 Google 公布的 favicon 要求,然後告訴你找到了什麼、哪些通過、哪些會讓圖示無法顯示。
在瀏覽器分頁上看起來完美的 favicon,仍然可能不會出現在 Google 的搜尋結果裡。瀏覽器很寬容 —— 長方形、沒有宣告的檔案、藏在轉址後面的圖示,它都照收。Google 不會。
Google 實際上要求什麼
以下是 Google 官方明文列出的規則,不是坊間傳聞:
| 要求 | 說明 |
|---|---|
| 正方形 | 1:1 的長寬比。這是最嚴格的一條 —— 長方形圖示根本不會被採用 |
| 至少 8×8 像素 | 下限。Google 建議大於 48×48 像素,一般也建議使用 48 的倍數 |
支援的 rel | icon、shortcut icon、apple-touch-icon 或 apple-touch-icon-precomposed |
| 可被檢索 | Googlebot-Image 必須能取得圖示,Googlebot 必須能取得首頁,兩者都不可在 robots.txt 中被封鎖 |
| 網址固定 | Google 希望 favicon 的網址不要經常變動 |
| 每個網站一個 | 這裡的「網站」指主機名稱。子目錄無法擁有自己的圖示 |
Google 另外會拒絕顯示它判定為色情或仇恨的圖示,並以預設的地球圖示取代。
為什麼圖示存在卻不顯示
依實際發生的頻率大致排序:
- 它不是正方形。 一張 32×16 的商標裁切是最常見的單一原因。瀏覽器會樂意縮放它,Google 則直接略過。
robots.txt把它擋住了。 多年前為了別的目的寫下的Disallow: /assets/,如今把圖示 也一併涵蓋。頁面的原始碼完全看不出這件事,所以它往往很久都沒被發現 —— 這個工具會明確 檢查這一項。- 它太小了。 一個 16×16 的
favicon.ico雖然過了 8 像素的門檻,卻遠低於 Google 建議的 48 像素,在任何顯示它的地方都會顯得模糊。 - 什麼都沒宣告。 Google 仍會依慣例找到
/favicon.ico,但<link rel="icon">才是可靠 的作法。 - 網址一直在變。 建置流程若把內容雜湊值寫進圖示檔名,等於每次部署都給 Google 一個新網址, 而它要求的是固定網址。
- 它只是還很新。 Google 依自己的排程重新檢索 favicon,可能要數週。昨天才修好的正確圖示 也許只是還沒被重看 —— 這個工具告訴你圖示本身沒問題,不代表 Google 已經再看過一次。
一份好的宣告長什麼樣
<link rel="icon" href="/favicon.ico" sizes="32x32">
<link rel="icon" href="/icon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
.ico 檔可以同時容納多種尺寸,這個工具會列出它宣告的每一個尺寸,而不只是最大的那個。SVG
是有效的 favicon 格式,檢查方式相同;只是真正可縮放的 SVG 不會標明像素尺寸 —— 這會被列為
說明,而非缺失。
有哪些資料會送到我們的伺服器
只有你輸入的網址。我們的伺服器會取得該頁面、只讀取它的 <head>,接著取得它指名的圖示與
robots.txt。檢查內容不會被儲存,頁面的原始碼也不會回傳到你的瀏覽器 —— 回傳的只有找到的
圖示清單與判定結果。
這是本站少數需要伺服器的工具之一。瀏覽器不被允許讀取其他網站的原始碼,而圖示必須從它自己的
位元組去量測,才能知道真正的尺寸,而不是 sizes 屬性所宣稱的尺寸。
指向私人網路的位址會被拒絕而不會被取得,包括任何由轉址所導向的位址。
相關工具
如果你要的是製作圖示而非檢查圖示,網站圖示產生器可以從單一張圖片產出整組檔案。