OGP 與 Meta 標籤驗證器
貼上 HTML 原始碼，即可一次性驗證 Open Graph Protocol（OGP）和 Twitter Card 的 meta 標籤。檢測缺失的標籤以及不是絕對路徑的 og:image，並以卡片形式預覽在社交媒體上分享時的效果。
使用技巧
- og:image 推薦尺寸為 1200×630px（寬高比 1.91:1）。尺寸過小或比例不對的圖片，在社交平臺上可能會被意外裁剪。
- Facebook、LINE、Slack 等平臺的爬蟲讀取的是 og:title/og:description，而 X（Twitter）使用的是獨立的 twitter:title/twitter:description。兩者都設定好，才能在各平臺上都正確顯示。
- 如果沒有設定 twitter:card，X 會嘗試回退到 og:title/og:description，但圖片可能無法正確顯示，因此建議明確設定該標籤。
- og:url 應填寫頁面的規範化絕對路徑（https:// 開頭）。這也有助於避免帶引數的 URL 被誤判為重複內容。
- 剛修改完 meta 標籤後立即分享，社交平臺可能仍顯示舊的快取預覽。可以使用各平臺提供的重新抓取工具（例如 Facebook 的分享偵錯程式）來重新整理快取。
常見問題
最常見的原因是圖片地址使用了相對路徑（如
/img/a.png）。大多數爬蟲無法解析相對路徑，請務必使用以 https:// 開頭的絕對路徑。此外，伺服器遮蔽了爬蟲的 User-Agent，或圖片尺寸過小，也可能導致無法顯示。是的，兩者作用不同，建議都設定。
<title> 用於搜尋結果標題和瀏覽器標籤頁，og:title 用於社交媒體分享時的卡片標題。若缺少 og:title，多數爬蟲會回退使用 <title>，但結果未必符合預期。對於一般的文章或部落格頁面，推薦使用能大圖展示的
summary_large_image。如果只需要小圖縮圖，可使用 summary。app 和 player 分別用於引導下載應用和嵌入影片/音訊，通常不適用於普通網頁。各社交平臺會快取抓取結果，因此修改後仍可能顯示舊的預覽內容。需要使用各平臺提供的重新抓取工具（例如 Facebook/LINE 的分享偵錯程式，或 X 的 Card Validator）主動請求重新整理快取。
大多數爬蟲會回退使用
<title> 和 meta description 生成預覽，但不會顯示圖片，呈現出樸素的連結加文字效果。由於這會影響點選率，建議至少設定 og:title、og:description、og:image 這三項。
閒話 ― OGP 誕生的原因 ― Facebook 為了讓「贊」按鈕發揮作用而創造的機制
Open Graph Protocol（OGP）是 Facebook 於 2010 年為推廣自家「贊」按鈕而制定的規範。當時的網頁在 Facebook 上被分享後，往往只顯示一個簡單的連結和標題，點選率難以提升。Facebook 的思路是：如果頁面本身能夠宣告在社交媒體上應呈現的內容，就能打造更具吸引力的分享體驗。於是他們設計了 <meta property="og:xxx"> 這一獨立名稱空間，追加到普通 HTML 之上。
有趣的是，OGP 實際上建立在 RDFa（一種用於在 HTML 中嵌入結構化資料的 W3C 規範）之上。通過沿用已有標準，Facebook 無需瀏覽器廠商或其他公司的配合，只需在現有 HTML 中追加幾個 meta 標籤即可實現新功能。這種「不破壞向後相容性的擴充套件」思路取得了成功，OGP 逐漸成為事實標準，被 Slack、LINE、Discord 等 Facebook 以外的平臺廣泛採用。
X（Twitter）最初並未直接採用 OGP，而是設立了獨立的名稱空間 Twitter Cards（twitter:xxx）。據說這與其說是技術上的必然，不如說也帶有「不想直接採用競爭對手 Facebook 制定的規範」的考量。結果是，如今大多數網站仍需要同時重複書寫 og: 系和 twitter: 系標籤，這也是本類驗證工具至今仍然有用的原因之一。