認識結構化資料標記,增進你的SEO優化你的SERP,讓Google更懂你

結構化資料標記是在執行SEO時的另一個祕密武器,不僅可以增進執行SEO的效果,還能優化搜尋結果頁面SERP,讓你的網站在被搜尋到的時候看起來加倍的豐富,同時近年來的SEO趨勢將會是搶第0版位(Position Zero)為主,也就是我們常常期待出現的SEO關鍵指標「精選摘要(Featured Snippets)」,因此了解結構化資料標記、並在網站中確實執行,也會是目前優化網站的重要課題之一。結構化資料不僅能讓Google更加認識你的網站、加強SEO的效果,對網站體質的調整也會有許多好處!以下的文章將帶您逐步探討認識結構化資料標記。

結構化資料是什麼?

結構化資料是一種協助搜尋引擎理解網站內容的系統,以標準化的格式,針對網站所提供的訊息、內容特性進行分類。我們可以將結構化標記想像成統一格式的表格,如果是活動類型的網頁,可以依序填上活動名稱、時間、地點…等;文章類型的網頁,可以填上文章名稱、作者、發佈時間…等,不同類型的網站會有不同的資訊分類可以選擇。透過結構化資料的協助,搜尋引擎就可以理解各種頁面的主題及細節,在資訊的收集上也更加完整精確且快速。

在網站加上結構化資料標記的好處是什麼?

提升SEO效果,讓搜尋引擎更有效率

執行SEO時,透過結構化資料標記的幫助,能讓搜尋引擎在檢索整體網站上更有效率,例如:常用的麵包屑導覽列設置,就是利用結構化資料的標記來建立,讓搜尋引擎理解到目前在網站中的所在位置、網站頁面的分層,利用麵包屑導覽快速理解整體網站結構,避免搜尋引擎在爬取網站資料時在你的網站內迷路。

優化SERP,讓搜尋結果更加豐富

搜尋引擎透過結構化資料的協助,搜尋引擎可以在搜尋結果中提供更多樣化的資訊給使用者,在搜尋的過程中得到更豐富的訊息、更精確的結果。

例如電商網站就可以為自己的產品新增 「Product」屬性的結構化資料,加上有關於商品的名稱、價格、庫存數量…等資訊。搜尋引擎在接收到這些訊息之後,就可以在使用者搜尋相關商品時,以「複合式摘要」的方式,提供更加詳細的資訊在搜尋結果上,使用者也能夠藉由這些資訊,更快速地挑選自己有興趣的商品。


結構化資料標記常見種類


將組織結構化資料的標記在網站的首頁,表示您的網站是一個品牌網站。

在首頁標記品牌資訊(如商標、社群資料、電子郵件和企業聯繫資訊:例如電話號碼等),這些資訊能夠在我們使用者進行品牌關鍵字搜尋時,出現在知識圖譜的盒子中。

↑搜尋moz這個品牌時的知識圖譜。

 

如果你的網站中有站內搜尋的功能,你可以針對它做標記,使搜尋框出現在網站連結(sitelinks)中。

↑搜尋Pinterest時,出現的網站連結搜尋框。

 

透過添加麵包屑結構化標記,可以在讓網站在搜尋結果中獲得麵包屑。

↑如上圖以崴浤科技的相關搜尋結果為範例,紅框處即是麵包屑

 

如果網站當中有影片內容,這個標記可以讓網站中的影片,有機會出現在搜尋結果中的影片摘要(video snippets)中,顯示上傳者、上傳時間、影片長度、影片縮圖等等資訊。

↑搜尋"game theory video(賽局理論影片)"出現的影片摘要

  • 在搜尋結果中的星星評論(Star reviews)

透過標記我們的評論,可以獲得星星的評價在搜尋結果當中。但值得我們注意的是,儘管評論(Review)本身就是一種結構化資料的類型,需要在網站中標記相對應的資料,但其實評論可以同時存在於其他結構化資料類型,舉例來說:

↑這是單獨加評論結構化資料標記後的搜尋結果

↑  紅框是在食譜結構化資料標記當中的評論,藍框則是食譜結構化資料標記

 以上面的例子來說,要呈現第二張圖的效果,就要在食譜類型的結構化資料標記中,額外標記"累積使用者評分"在"評論(review)"這個屬性(property)。類似的應用方式,除了在食譜中,也可以在如人物(Person)等類型的結構化資料中做評論的屬性標記。另外是在使用時機上,假如這個頁面的主要資料類型並不是評論時(可能是食譜的資料類型),但頁面中又有評論的資料,就是一個應用這個方法的好時機。此外除了評論外,像是日期、時間長度等,也可以做為一個屬性在某一類的結構化資料標記中出現。

以上介紹的是較為通用的結構化資料標記類型,其實對於特定行業或類型的網站,還有其他不同的結構化資料標記類型可以使用。


認識Schema.org

提到了結構化資料絕對要知道 Schema.org,Schema.org 是由Google、Bing、Yandex 和 Yahoo 四個大型搜尋引擎共同制定的一套結構化標記架構,目的是為了創建一套可以適用於各個大型搜尋引擎的結構化資料系統,Schema.org 彙整了描述網頁資料常用的詞彙,將這些資料整理成統一的格式,讓往後推行及實際運用時可以降低阻礙。

而 Schema.org 的創建,同時也有利於網站管理者、搜尋引擎與使用者三方。

  1. 網站管理者:Schema.org 提供了網站管理者統一的格式,不用額外去學習多種不同的規則。
  2. 搜尋引擎:Schema.org 所制定的結構化資料項目,都是對搜尋引擎有價值的項目,就能夠確保所接收到的結構化資料都是搜尋引擎可運用的,避免無效的資料影響效率。
  3. 使用者:當結構化資料更加普及時,使用者也就能透過搜尋結果得到更多所需的資訊。

建立結構化資料標記的方式

從瞭解結構化資料是什麼,再到結構化資料的優點,種種結構化資料的好處都讓你想要為自己網站建立結構化資料了吧!依照 Schema.org 規則中,建立結構化資料的方式可以分成三種方式,分別是「JSON-LD」、「Microdata」、「RDFa」,除了這三種語法之外,另外也有不需要程式語言的結構化資料建立方式喔!

JSON-LD(Google推薦使用)

JSON-LD 是 Javascript 格式的程式碼,也是Google官方推薦使用的方式,JSON-LD 在不必更動原本的 HTML 內容,在撰寫上會獨立成一段程式碼,讓撰寫與維護上更加的便利。可以將 JSON-LD 想像成一張「便條紙」,在課本(網頁)上加註解時,不直接寫在課文(HTML)旁,而是將筆記寫成一張便條紙,直接貼在空白處即可。

Microdata

Microdata 對於不熟悉程式語言的使用者來說較好入門,撰寫的方式就是在原有的 HTML上,依照 schema.org 所規範的標籤類型,依序將相符的屬性填在 HTML 後。Microdata 就可以想像成「筆記」,在課本(網頁)上加註解時,直接在課文(HTML)旁加上筆記。

Microdata 雖然可以在原有的 HTML 上直接加註,不用像 JSON-LD 要額外撰寫一段程式碼,但這樣的形式所產生的缺點,就是不像 JSON-LD 可以在同一個地方進行,造成往後在維護網站的作業上會較難執行。

RDFa

第三種 RDFa 誕生的年代最早,目前也已經很少使用了,RDFa 可以將網頁中所需的屬性,添加在可供讀取的後設資料中,這些在後設資料中的屬性就可以被運用在XML檔案中。 RDFa 同樣可以直接寫在原本的程式碼當中,不過也就與 Microdata 有相同的缺點。

資料螢光筆、結構化資料標記協助工具

如果想要新增結構化資料,但是上述的3種程式碼都讓你看得霧煞煞,別擔心!還有另一種貼心的方式可以讓你輕鬆的新增結構化資料,就是使用「資料螢光筆」,資料螢光筆是 Google 為了讓結構化資料能夠更輕鬆、便利的新增,而創造出來的免費工具,就算不懂程式碼也能新增結構化資料。

運用資料螢光筆能夠在不改變網站原始碼的狀況下,讓 Google 理解你網站中結構化資料的模式,只需要進入 Google Search Console 中(如果網站沒有使用Search Console,也可使用結構化資料標記協助工具),就可以使用資料螢光筆對網站中的內容直接進行標記,完全不需要學會其他的程式語言就能夠完成,而且還能夠一次標記所有相同版型的網頁。不過資料螢光筆所支援的結構化資料有限,有許多的結構化資料還是要依靠上述的三種程式碼來新增。

結構化資料測試工具

依照了前述的方式辛苦的建立結構化資料後,若是因為一點點小錯誤而導致結構化資料無法運作,就真的是功虧一簣了。為了確保每個結構化資料都能夠正確無誤,讓搜尋引擎可以順利的判讀,Google 就有一個工具可以來解決這個問題,藉由結構化資料測試工具的幫助,我們可以直接輸入網頁網址或是含有標記的 HTML 程式碼,就可以即時檢測到目前的結構化資料問題,並顯示出現問題的地方與其他建議;透過使用結構化資料測試工具,可以快速的檢測出結構化資料的問題,在除錯與維護上都是一大助力。

!!重點提醒!!

使用結構化資料可以讓搜尋引擎判讀到所需資訊,即使結構化資料已經正確的標記網頁中的內容,但還是不能夠保證以上呈現方式會出現在搜尋結果上,Google 也有對於此狀況的原因,提出幾點說明。

  1. Google 演算法會依照許多的因素,包括搜尋歷史紀錄、所在位置、所使用的裝置,來給予 Google 所認定最適合使用者體驗的結果。
  2. 結構化資料的內容與頁面內容不符,或是可能具有誤導性。
  3. 結構化數據所標記的內容,對使用者採隱藏內容的方式。
  4. 該頁面不符合結構化資料指南特定類型的指南網站管理員指南


經過上述內容的講解,想必大家都已經有些概念,可見得結構化資料在執行SEO的成效上有一定的助益存在,增加了一定不會有壞處,但如果沒有增加就可能讓你的網站輸在起跑點,只要針對網站內容挑選適合的結構化資料標記來進行更新,就可以繼續在SEO的這條道路上持續奮鬥!趕快來了解結構化資料,適度的為你的網站增添畫龍點睛的一筆吧。

*提供您Google官方的結構化資料標記相關參考文章:
(1)一般結構化資料指南
(2)瞭解結構化資料的運作方式


資料來源:

1.  awoo 的 用結構化資料與Google溝通,分析結構化資料的優點、寫法
2.  奇寶 的 結構化資料與語意標記,讓Google更懂網站的心!