結構化資料標記協助工具

結構化資料標記協助工具可協助你為網頁上的元素加上標記,以便 Google 解讀網頁上的資料。一旦 Google 更清楚解讀你的網頁資料,就能在 Google 搜尋中以全新的面貌呈現你的資料,並吸引更多目光。此外,如果你傳送 HTML 格式化的電子郵件給客戶,標記協助工具可示範如何變更電子郵件範本,讓 Gmail 以新穎而實用的方式向使用者呈現電子郵件中的資料。

開啟結構化資料標記協助工具

例如:

  • 活動:如果你標記了你網站上的活動,當 Google 下次檢索你的網站時,這些活動資料就可以顯示在搜尋結果頁面的複合式摘要中。

    針對網頁中多項活動顯示的複合式摘要

  • 電子郵件:如果航班相關電子郵件內包含有關機票預訂的標記,Gmail 就能在你的電腦用戶端或個人動態消息中顯示這些資訊。

    Gmail snippet for a flight reservation.

 

如果你不想為網站新增程式碼,可以改用資料螢光筆

如果你具備技術條件,建議你瞭解結構化資料,並為你的網站手動加上標記。

標記網頁或電子郵件

你可以標記 HTML 網頁或 HTML 電子郵件中的元素。

標記網頁

標記網頁中元素的方法如下。

  1. 開啟結構化資料標記協助工具
  2. 選取 [網站] 分頁。
  3. 選擇你要標記的網頁類型,例如電影網頁或活動網頁。你可以在單一網頁上標記多個項目,但我們建議所有項目應屬於同一類型 (例如都是電影或都是活動)。
  4. 輸入現有網頁的網址或原始網頁 HTML。如果輸入網址,請確定所有使用者不需登入即可存取網頁 (你可以開啟 Chrome 的無痕式視窗,然後嘗試造訪網頁,藉此測試網頁存取權。如果可以連上網頁,就表示沒問題)。
  5. 選取 [開始標記]。
  6. 讓網頁上含有重要資訊 (例如活動網頁上的開始時間) 的部分醒目顯示,並在隨後出現的下拉式選單中指出資訊類型 (「開始時間」)。
    1. 如有複雜的日期字串,或無法順利標記日期,請參閱進階日期標記
    2. 如要新增未於網頁中顯示的資訊,請參閱新增缺少的資料
    3. 如要移除結構化資料標記協助工具產生的標記,請參閱移除標記
  7. 請務必為特定資料類型提供所有必要的資訊。 「我的資料項目」窗格中會列出各項目所有可能的值,並標明必要的值。舉例來說,你必須為活動提供活動名稱、地點和開始日期。
  8. 在網頁上標記完所有適當的資料後,請選取 [建立 HTML] 來產生網頁程式碼。接著選擇輸出格式:預設值為 JSON-LD (Google 偏好的格式),但你也可以選擇微資料。然後複製並貼上輸出視窗中的程式碼,或是選取 [下載]。程式碼的使用方式取決於格式:
    1. JSON-LD:複製產生的程式碼並貼到現有網頁的內文中。
    2. 微資料:以產生的 HTML 取代你的網頁。
  9. 如要測試程式碼,請複製產生的程式碼並貼到複合式搜尋結果測試中。這項測試工具會告訴你是否有任何未填妥的欄位 (必須提供才能協助 Google 解讀網頁內容),並針對部分資料類型提供預覽畫面,讓你瞭解網頁在 Google 搜尋結果中呈現的樣貌。
  10. Google 可能需要經過幾週才會找到新的網頁程式碼。如果你的資料經過檢索且詳實正確,就會以複合式搜尋結果型態顯示。如果你的網站並未以複合式搜尋結果型態顯示,請參閱這些可能原因

標記電子郵件

標記 HTML 格式化電子郵件的方法如下:

  1. 開啟結構化資料標記協助工具
  2. 選取 [電子郵件] 分頁。
  3. 選擇你要標記的資訊類型,例如車票預訂或產品訂單。
  4. 輸入電子郵件的 HTML。
  5. 選取 [開始標記]。
  6. 讓電子郵件中含有重要資訊 (例如客運車票預訂號碼) 的部分醒目顯示,並在隨後出現的下拉式選單中選取資訊類型 (「預訂號碼」)。
    1. 如有複雜的日期字串,或無法順利標記日期,請參閱進階日期標記
    2. 如要新增未於電子郵件中顯示的資訊,請參閱新增缺少的資料
    3. 如要移除結構化資料標記協助工具產生的標記,請參閱移除標記
  7. 請務必為特定資料類型提供所有必要的資訊。「我的資料項目」窗格中會列出所有可能的值,並標明必要的值。如果你未提供所有必要的值,Google 將無法處理電子郵件。
  8. 如果標記的元素旁邊顯示警示圖示 (Alert Icon),請選取圖示旁邊的資料並檢閱標記,然後採取下列其中一種做法:
    • 如果標記不正確,請選取資料旁的 [X],然後重新為該資料加上標記。
    • 如果標記正確無誤,請選取警示圖示 (Alert Icon),然後選取 [清除警告]。
  9. 完成標記後,請選取 [建立 HTML] 來產生要用於電子郵件的 HTML。預設值為 Google 偏好的 JSON-LD,但你也可以選擇微資料。你可以選取 [下載],也可以直接複製並貼上產生的 HTML。
    1. JSON-LD:複製產生的程式碼並貼到電子郵件的內文中。
    2. 微資料:以產生的 HTML 取代你的電子郵件。
  10. 如要測試程式碼,請將電子郵件傳送至 Gmail 帳戶,或是使用電子郵件架構驗證工具

儲存並繼續編輯網頁或電子郵件

如要儲存標記目前的狀態,請在瀏覽器中為網頁加上書籤。結構化資料標記協助工具會將你的狀態儲存一個月,包括所有標記的值。

 

移除標記

你可以將結構化資料標記協助工具建立的部分或所有標記復原。

如何清除特定標記:

  1. 選取範例網頁或電子郵件中的標記。
  2. 從選取標記後顯示的彈出式選單中選取 [清除標記]。
你也可以在 [我的資料項目] 欄中找出要清除的資料,然後將滑鼠游標移至該項目上方並選取畫面上顯示的 [X]。

 

如何清除所有標記:

  1. 注意:清除所有標記後即無法復原,只能從頭開始標記。如果你的內容已經有標記,標記協助工具將不會移除現有的標記。清除所有標記的動作只會移除由標記協助工具所新增的標記。
  2. 選取齒輪圖示 設定
  3. 選取 [清除這個網頁上的所有標記]。
進階日期標記

結構化資料標記協助工具可解讀多種日期格式 (必須包含日、月和年)。如要提供任何缺少的資料 (例如年份),你可以將缺少的資料新增至網頁集

如果你的範例內容是將日期顯示為單一項目 (例如,2012 年 6 月 4 日),我們建議你建立單一日期標記。建立的標記越少,標記程序會越迅速,且標記協助工具的正確性也會越高。

建立單一日期標記:

  1. 依照標記網頁標記電子郵件等節的說明,開始標記資料。
  2. 在「標記工具」頁面中,使用滑鼠選取日期,例如選取下列項目:2012 年 6 月 4 日
  3. 在隨即顯示的內容選單中,依序選取 [日期] > [日期/時間或範圍]。

    標記協助工具會將該日期新增至 [我的資料項目] 欄中。

  4. 標記網頁標記電子郵件等節的說明,完成網頁標記程序。

建立獨立的日期標記

部分內容會將日期資訊顯示為獨立的項目,或是使用標籤來辨識個別日期元件。舉例來說,一個含有多項活動的網頁可能會將年份和月份統一顯示在頂端,然後將活動當日顯示在該活動旁。如果你的內容是將日期顯示為獨立項目,則你必須建立獨立的日期標記。

注意,標記協助工具無法解讀使用獨立項目標記,同時又指定範圍的日期 (例如 6 月 4-5 日2012 年)。

建立多個獨立的日期標記:

  1. 標記網頁標記電子郵件等節的說明,開始標記資料。
  2. 在「標記工具」頁面中,使用滑鼠選取日期的一部分,例如選取下列項目:6 月
  3. 在隨即顯示的內容選單中,依序選取 [日期] > [進階] > [日期項目]。舉例來說,依序選取 [日期] > [進階] > [月]。

    標記協助工具會將該日期新增至 [我的資料項目] 欄中。

  4. 繼續使用該日期項目來為所有適用日期加上標記。
  5. 標記網頁標記電子郵件等節的說明,完成標記程序。

日期標記範例

下列為您可標記的日期範例:

  • 單一日期。舉例來說,您可標記下列任一日期:
    • 6 月 4 日,2012 年
    • 2012 年 6 月 4 日
    • 6/4/12 - 您可標記其他分隔符號和 4 位數年份 (例如 6-4-2012)。當以數字表示的日期不夠明確時,Google 會將第一個數字認定為月份。舉例來說,Google 會將 6/4/12 解讀為 2012 年 6 月 4 日,而將 13/4/12 解讀為 2012 年 4 月 13。
    您可以在網頁上標記多個日期。舉例來說,如果您標記了 2012 年 6 月 4 日2012 年 6 月 6 日,系統會將活動解讀為發生兩次:6 月 4 日和 6 月 6 日各發生一次。
  • 日期範圍。例如 2012 年 6 月 4-7 日
    請注意,連接開始日期和結束日期之間的分隔符號必須為破折號 (-)。
  • 包含時間的日期。舉例來說,您可標記下列任一日期:
    • 2012 年 6 月 4 日下午 3 點:前面加上上午或下午的時間;Google 會使用一般營業時間來解讀前面未加上午或下午的時間。舉例來說,Google 會將11 解讀為上午 11 點,而將 2 解讀為下午 2 點。
    • 2012 年 6 月 4 日 15:00:24 小時制時間
    • 東部標準時間 2012 年 6 月 4 日下午 3 點2012 年 6 月 4 日下午 3-5 點:含時區或世界統一時間/格林威治標準時間差距的時間。
    • 2012 年 6 月 4 日下午 2-3 點2012 年 6 月 4-5 日下午 2-3 點:含/不含日期範圍的時間範圍。
  • 以獨立項目組成的日期。您可以透過進階標記選項,將下列獨立的文字片段辨識為一組日期:
    • 日期:6 月 4 日 (星期二) 年份:2013 年
    • 6 月 4 日 | 時間:下午 7:30-下午 9:302012 年
    Google 無法辨識已分割成多個標記的時間範圍。舉例來說,系統無法將下列標記辨識為一組有效日期:
    • 6 月 4-5 日和 2012 年

手動指定日期格式

標記協助工具會根據內容語言所適用的日期格式規則來判斷其中的日期。舉例來說,如果網頁的語言是英文 (美國),標記協助工具就會將 12-06-12 判斷為 2012 年 12 月 6 日;如果網頁的語言是英文 (英國),標記協助工具就會將 12-06-12 判斷為 2012 年 6 月 12 日。標記協助工具會自動判斷網頁的語言,進而判斷日期格式規則。

如何覆寫標記協助工具並指定其他日期格式:

  1. 依序選取齒輪圖示和 [設定]。
  2. 在 [設定] 彈出式視窗的 [日期格式] 清單中,選取要指定的格式。
  3. 選取 [儲存]。
新增缺少的資料

如果你的範例內容有缺少資料 (例如活動的年份),你可以為該資料指定要使用的值。結構化資料標記協助工具會為這些值加上標記。

你隨時都可以新增缺少的資料,並可視需求予以變更或刪除。

如何新增、變更或刪除缺少的資料:

  1. 在「我的資料項目」欄的底部,選取 [新增缺少的標記]。
  2. 執行下列任一操作:
    • 從 [選取標記] 清單中選取要使用的標記以新增值,然後在文字方塊中輸入值。舉例來說,你可以選取 [類別],然後輸入「愛爾蘭傳統音樂」。
    • 選取文字方塊中的 [X],將現有的資料刪除。
    • 變更文字方塊中的值以編輯現有資料。
  3. 選取 [儲存]。
    標記協助工具會在 [我的資料項目] 底下顯示指定的值。

變更網頁語言

結構化資料標記協助工具會自動偵測你範例內容的語言,以便正確解讀網頁中的資料。如果標記協助工具所建立的標記不正確,你可以將你所使用的語言明確地告知標記協助工具。

如何手動指定語言:

  1. 依序選取齒輪圖示和 [設定]。
  2. 在 [設定] 彈出式視窗的 [網站語言] 清單中,選取要指定的語言。
  3. 選取 [儲存]。
什麼是 schema.org?

schema.org 是由 Google、Microsoft 與 Yahoo! 聯手打造的計劃,旨在建立描述網頁資料的常用詞彙,藉此改善網路瀏覽體驗。如果您在 HTML 網頁中加入 schema.org 標記,即可讓許多公司與產品 (包括 Google 搜尋) 解讀您網站上的資料。同樣地,如果您在 HTML 格式化的電子郵件中加入 schema.org 標記,也能讓 Gmail 以外的其他電子郵件產品解讀其中的資料。

您可以使用不同類型的標記,透過 schema.org 詞彙來描述您的資料。標記協助工具可為您示範如何使用微資料與 JSON-LD。

如需進一步瞭解 schema.org,請參閱 schema.org 常見問題

JSON-LD 和微資料是什麼?

JSON-LD 和微資料是兩種使用 schema.org 詞彙的資料標記方法。Google 建議針對網頁內容使用 JSON-LD。

JSON-LD

JSON-LD 會使用 HTML 網頁上的 JavaScript 物件來定義資料。舉例來說,以下是描述活動的 JSON-LD:

<script type="application/ld+json">
{
  "@context" : "http://schema.org",
  "@type" : "Event",
  "name" : "已故經典民歌演唱者追思音樂會",
  "startDate" : "2013 年 7 月 6 日",
  "location" : {
    "@type" : "Place",
    "name" : "台北小巨蛋"
  }
}
</script>

新增 JSON-LD 時,標記協助工具會傾向為現有的 HTML 元素加上標記。舉例來說,當您標明一項編碼為 <h4>我的活動</h4> 的活動時,標記協助工具就會將下列這類 JSON-LD 新增至您的範例中:

<script type="application/ld+json">
{
  "@context" : "http://schema.org",
  "@type" : "Event",
  "name" : "我的活動"
}
</script>

詳情請參閱 JSON-LD

 

微資料

微資料使用 HTML 標記與屬性來定義資料。舉例來說,以下是描述活動的 HTML 片段:

<div> 
  快來聽聽國家交響樂團的現場演奏會 
  歡迎在 2013 年 7 月 6 日蒞臨美輪美奐的國家音樂廳!
</div>

以下是使用微資料標記同一段 HTML 的結果:

<div itemscope itemtype="http://schema.org/Event"> 
  快來聽聽
  <span itemprop="name">國家交響樂團</span>, 
  的現場演奏會
  歡迎在 <span itemprop="startDate" 
  content="2013-07-06>2013 年 7 月 6 日</span> 
  蒞臨美輪美奐的
  <span itemprop="location" itemscope 
    itemtype="http://schema.org/Place"> 
    <span itemprop="name">國家音樂廳</span>!
  </span>
</div>

詳情請參閱關於微資料

標記協助工具會如何處理我現有的標記?

標記協助工具會忽略你在範例網頁或電子郵件中所加上的所有現有標記。因此,當你要標記的文字已由現有標記所定義時,標記協助工具會予以忽略,然後為該文字新增額外的標記。

 
如果你對結構化資料標記協助工具有任何意見,請前往結構化資料 Search Console 論壇,和我們分享你的想法。

這對您有幫助嗎?

我們應如何改進呢?
true
第一次使用 Search Console 嗎?

第一次使用 Search Console 嗎?不論您是初學者、搜尋引擎最佳化 (SEO) 專家,還是網站開發人員,都可以從這裡踏出第一步。

搜尋
清除搜尋內容
關閉搜尋
主選單
10082243868383367425
true
搜尋說明中心
true
true
true
true
true
83844
false
false