- 登入
- 註冊
Open Graph 是什麼？OG 必需屬性、圖片與分享驗證
內容目錄
顯示
Open Graph（常簡稱 OG）是一套寫在網頁 head 裡的 meta 標籤，用來告訴 Facebook 與 LINE 這類平台，網址被分享時要顯示什麼標題、圖片與說明。以 LINE 聊天室的連結預覽為例，標題來自 og:title，縮圖來自 og:image，說明文字來自 og:description。想確認有沒有設好，先檢視頁面原始碼裡的 OG 標籤，再用平台的檢查工具或實際貼一次連結。
設定正確能讓分享資料更一致，但平台的裁切、快取與顯示方式各有規則，不能承諾點擊率或流量增加幾倍。這篇從四個必需屬性、圖片及實際驗證開始，再整理縮圖不顯示或沒更新時的排查步驟。
Open Graph 的四個必需屬性
依 Open Graph 官方規範，基本屬性是 og:title、og:type、og:image、og:url；og:description 與 og:site_name 是常用的選用屬性。社群平台可能另有自己的標籤或需求，不能把 OG 設定視為所有平台完全相同的介面。
| 屬性 | 用途 | 注意事項 |
|---|---|---|
| og:title | 物件的標題 | 與內容一致，重要資訊放前面 |
| og:type | 物件類型 | 一般網站常用 website，文章可依規範用 article |
| og:image | 代表圖片網址 | 公開可抓取、HTTPS、裁切後仍可辨識 |
| og:url | 物件的標準識別網址 | 通常對應頁面 canonical；不直接改寫所有卡片點擊目的地 |
| og:description | 選用的簡短說明 | 補充內容，不保證平台一定顯示 |
| og:site_name | 選用的網站名稱 | 使用真實品牌名稱 |
寫進頁面後，四個必需屬性加上說明與網站名稱大致如下，網址與文字都是示意：
<meta property="og:title" content="文章標題" />
<meta property="og:type" content="article" />
<meta property="og:image" content="https://example.com/images/share.jpg" />
<meta property="og:url" content="https://example.com/article/" />
<meta property="og:description" content="一到兩句的內容說明" />
<meta property="og:site_name" content="網站名稱" />OG image 如何準備？尺寸與延伸屬性
先依主要分享平台的目前規格建立圖片。1200 × 630 是常見橫式起點，並非所有平台的唯一或通用強制尺寸。文字和人物放在安全範圍，保留裁切空間，再用手機預覽。格式、檔案大小與抓取限制依平台確認，不用單一 8 MB 規則套全部。
- 圖片網址公開可用，沒有登入或防盜連限制。
- 圖片內容與頁面一致，縮小後標題仍可辨識。
- 避免重要資訊貼邊，檢查不同平台的裁切。
- 同時核對頁面 title、description 與精選圖的預設值。
以 Facebook 為例，官方文件要求圖片至少 200 × 200 像素，檔案不超過 8 MB，高解析度裝置建議至少 1200 × 630 像素；小於 600 × 315 像素時縮圖會明顯變小，長寬比接近 1.91:1 才不會在動態消息被裁切（Facebook 開發人員文件：連結分享中的圖像，查證 2026-10-14）。這是 Facebook 自己的要求，其他平台仍要個別確認。
og:image 另有選用的延伸屬性，可以補充圖片的寬高、格式與替代文字；同一頁有多個 og:image 時，規範以由上而下的第一個為優先。
| 延伸屬性 | 填什麼 | 補充說明 |
|---|---|---|
| og:image:width 與 og:image:height | 圖片寬高，單位為像素 | Facebook 文件指出，提供後爬蟲不必先下載並處理圖片，第一次分享就能顯示縮圖 |
| og:image:type | 圖片的 MIME 類型 | Facebook 文件列出 image/jpeg、image/gif、image/png |
| og:image:alt | 描述圖片內容的文字，不是圖說 | 規範指出有 og:image 時就應該提供 |
屬性定義依 Open Graph 規範，Facebook 的補充出自前面的圖像文件與 Facebook 網站管理員分享指南（查證 2026-10-14）。
SEO meta 與 OG 各負責什麼？
title 和 meta description 提供搜尋引擎頁面資訊，Google 仍可能改寫搜尋標題及摘要。OG 描述社群分享物件，也不保證平台一定完全照填寫顯示。兩組欄位可採不同文案，但都要符合正文。搜尋結果怎麼產生是另一套流程，可以從 SEO 的白話入門看起。
如何驗證實際輸出？
驗證要看平台實際抓到的內容，後台欄位有填不代表輸出正確。
- 開啟頁面原始碼，核對 OG 名稱、值、圖片與標準網址。
- 使用目標平台目前提供的檢查工具，並實際分享測試。
- 修改後先確認網站快取已更新，再查看平台重新抓取結果。
- 一個平台的 debugger 只代表該平台，不能保證清掉 LINE 或其他平台快取。
Facebook 可使用 Sharing Debugger，LinkedIn 可使用 Post Inspector。其他平台以當下提供的工具及實際卡片為準，不承諾所有驗證器都提供完整預覽。
Facebook 的 Sharing Debugger 會列出爬蟲抓到的 meta 標籤與錯誤或警告，同時觸發一次重新抓取；LINE 的官方 FAQ 沒有列出對應工具。兩個平台的差異如下：
| 項目 | LINE | |
|---|---|---|
| 預覽使用的標籤 | 基本為 og:url、og:title、og:description、og:image | 只使用 og:title、og:description、og:image |
| 沒有 OG 標籤時 | 爬蟲自行推測標題、說明與預覽圖 | 標題改用 title 標籤的文字，說明改用 description 或內文，圖片從頁面自動擷取 |
| 檢查方式 | Sharing Debugger | FAQ 未列出檢查工具，實際貼連結確認 |
| 換圖後的更新 | 依圖片網址快取，新圖要用新的網址 | FAQ 未說明更新方式與時間 |
LINE 欄依 LINE Developers FAQ，Facebook 欄依前面引用的兩份文件，查證 2026-10-14。
分享縮圖不顯示或沒更新？依序排查五件事
縮圖沒出現或還是舊圖時，從自己能確認的地方往外查，最後才請平台重新抓取。
- 檢視頁面原始碼：搜尋 og:image，確認標籤存在且指向正確的圖。Facebook 要求 OG 標籤出現在頁面前 1 MB 之內，超過會被截斷。
- 直接開啟圖片網址：用無痕視窗開啟，不登入也要看得到圖。出現 403 或 404 時，先依 HTTP 狀態碼的判讀方式處理權限或路徑。
- 確認爬蟲抓得到：Facebook 的爬蟲以 facebookexternalhit 為使用者代理字串，官方要求加入允許清單，並在幾秒內回應。網站前面有 Cloudflare 這類 CDN 與安全服務時，把頁面網址貼進 Sharing Debugger，看結果有沒有列出抓取錯誤或警告；有錯誤就到該服務的設定確認沒有攔下這個爬蟲，回應過慢則請主機或平台方檢查網站伺服器。
- 分清楚是哪一層快取：網站的頁面快取、CDN 快取與平台的抓取快取是不同層，先確認未登入訪客看到的原始碼已是新版，做法見快取分層與網站更新後的排查順序。
- 請平台重新抓取：把頁面網址貼進 Sharing Debugger，重新抓取後確認結果列出的 og:image 已是新圖的網址。Facebook 依圖片網址快取，新圖要用新的網址，舊圖先保留給既有貼文引用；已發布的舊貼文預覽不會自動更新。
Facebook 的爬蟲要求出自 Meta 網路爬蟲說明，圖片更新規則出自前面的圖像文件，查證 2026-10-14。
LINE 還顯示舊圖怎麼處理？
先確認公開原始碼和圖片已更新且可抓取，再區分網站快取與 LINE 的抓取快取。Facebook 重新抓取不會替你控制 LINE 快取。不要直接把帶無意義參數的網址當成永久內容網址；若以變更圖片網址測試，仍維持正確 canonical 與 og:url。
前面引用的 LINE Developers FAQ 沒有公布預覽的更新時間，也沒有列出清除快取的方法，所以本文不提供固定的等待時間。FAQ 另提到，用 LINE 分享按鈕時部分網址可能不顯示預覽，但仍可分享。
網站平台可以自動繼承嗎？
自架 WordPress 可透過適合的 SEO 外掛管理 OG，並不是每篇都要手寫 HTML。使用任何網站服務時，新增內容仍應查看實際輸出、精選圖及預設值，重要頁面再逐頁核對。
以秒站為例，網站控制台的 SEO 設定可以逐頁查看分享標題、分享說明與分享圖片：標題與說明可沿用搜尋標題與摘要，圖片可沿用精選圖或全站預設分享圖，需要時再改成此頁專用（見頁面 SEO 與分享設定教學）。圖片上傳到媒體庫後，網址會轉成英數格式，避開中文檔名在 Facebook 或 LINE 分享時縮圖顯示失敗的狀況（見秒站圖片優化與 AI SEO 功能更新）。
平台代為輸出標籤，不代表各平台的預覽會立刻更新，發布後仍要用公開網址驗證。還在比較自架與代管的維護分工，可以看自架 WordPress 與 SaaS 架站服務的取捨。
內文精華總結
- OG 四個必需屬性是 title、type、image、url。
- description 常用但不是官方四個基本必需屬性之一。
- 卡片、圖片與快取需逐平台驗證，不能以單一工具證明全部更新。
- LINE 的網址預覽只使用 og:title、og:description 與 og:image 三個標籤。
- Facebook 依圖片網址快取，換圖要用新的圖片網址，再用 Sharing Debugger 重新抓取。
- OG 改善分享資料的一致性，不保證點擊或流量倍增。
先用自己的任務評估秒站
秒站是台灣團隊用 WordPress 打造的 SaaS 架站服務。可以從現成架構快速開始，用頁面編輯器調整版面，也能和 AI 協作，把自製頁面放進 Vibe 畫布。選購前先以日常工作試操作，再核對需要的方案與加購項目。
重點整理
Open Graph 哪四個屬性必需？
官方基本屬性為 og:title、og:type、og:image、og:url。og:description 和 og:site_name 常用但屬選用，目標平台可能另有需求。
OG 設好會讓流量多兩三倍嗎？
沒有通用倍數保證。它讓分享資訊更一致，成效仍依內容、曝光、受眾及平台顯示，用實際分享數據評估。
OG image 一定要 1200 × 630 嗎？
這是常見橫式起點，並非所有平台唯一規格。依主要分享平台確認尺寸、格式、檔案及裁切限制，再實際預覽。以 Facebook 為例，官方文件要求至少 200 × 200 像素，檔案不超過 8 MB，高解析度裝置建議至少 1200 × 630 像素；小於 600 × 315 像素時縮圖會明顯變小，長寬比接近 1.91:1 才不會在動態消息被裁切。
Facebook debugger 可以更新 LINE 舊圖嗎？
不能保證。平台各自抓取與快取，先確認公開輸出及圖片，再在目標平台測試。
自架網站需要每篇手寫 OG 嗎？
不一定。可使用適合的 SEO 外掛繼承預設與精選圖，重要頁面仍需核對實際輸出。
LINE 分享連結的標題和縮圖讀哪些標籤？
依 LINE Developers FAQ，聊天室的網址預覽只使用 og:title、og:description 與 og:image 三個標籤，其他 OG 標籤不會出現在預覽裡。沒有設定時，標題會改用 title 標籤的文字，說明會改用 description 或內文，圖片則從頁面自動擷取。
換了分享圖，Facebook 還是顯示舊圖怎麼辦？
Facebook 依圖片網址快取。官方文件說明新圖要使用新的圖片網址，舊圖先保留給既有貼文引用，再把頁面網址貼進 Sharing Debugger 觸發重新抓取。已經發布的舊貼文預覽不會自動更新。
og:image:width 和 og:image:height 需要填嗎？
兩者在 Open Graph 規範裡屬於選用的延伸屬性。Facebook 文件指出，提供寬高後爬蟲不必先下載並處理圖片，內容第一次被分享時就能顯示縮圖；沒有提供時，第一位分享的人可能看不到圖片。
