SEO 進階技巧，使用 Schema 結構化資料標記提升排名
Schema 目前被大多數人用來指稱網站中的結構化資料（structured data），但其實 Schema 是 Schema.org 網站的簡稱，最初這個網站是由四大搜尋引擎 Google、Yahoo、Bing和Yandex 在 2011 年共同發起的一項計畫，透過定義出網站原始碼端的標準規格與寫法，讓搜尋引擎能夠準確理解網站的架構與內容，進而更加精準地提供資訊給搜尋引擎的使用者！
（備註：之後文內會以 Schema 來指稱結構化資料。）
#1 結構化資料 VS. 非結構化資料
若要從數據分析的角度來談結構化資料，就須另外再寫一篇相關文章探討了，我們這裡先以數位行銷的角度來快速對資料類型做個比較，表格如下：
以往，建構網站的原始碼大部分都是以非結構化的寫法來編寫，比如進入一個咖啡品牌網站時，哪個部分有產品資訊？哪個部分有店家資訊？當網站內的非結構化的資料過多時，搜尋引擎爬蟲想要解讀網站、進一步收錄進搜尋引擎難度很高，但透過結構化資料的寫法，可以讓爬蟲快速且清楚地了解網站內容，並將其收錄、分類，這會極大程度地改善搜尋結果頁面（SERP）的呈現，將更精確的資訊傳遞給使用者。
雖然說結構化資料的發展最初是由搜尋引擎與程式碼的角度發起，目前也在搜尋引擎優化（SEO）上扮演著重點角色，但其是以改善使用者體驗作為核心，搜尋引擎會考量使用者搜尋意圖、搜尋紀錄、所在位置和裝置類型，提供給使用者最佳的搜尋體驗！
#2 Schema 改善了搜尋引擎結果頁（SERP）的使用者體驗！
使用搜尋引擎查找資訊時，使用者在搜尋框輸入想要查找的關鍵字後，就會產生搜尋引擎結果頁（Seach Engine Results Page, SERP），使用者可以從中找到想要的解答，SERP 內容包含網站排名、付費廣告等各種資訊，如下圖：
（備註：之後文內的搜尋引擎會以 Google 為代表。）
在這個 SERP 當中，可以清楚的了解搜尋引擎結果頁不僅呈現單純的網頁排名順序，還有許多不同的區塊、元素，這些都是搜尋引擎為了提供給使用者最精準的資訊和解答所做的努力，這裡可以區分成四個主要元素：
#2-1 自然搜尋結果（Organic Results ）
自然搜尋結果是 Google 演算法根據相關性、使用者體驗、網站權重等各種因素，依序為使用者列舉出最有幫助的網頁或資訊。隨著搜尋引擎不斷的進化，自然搜尋結果也出現更豐富、更符合使用者需求的資訊，同時，這些多樣化的資訊有一大部分是透過 Schema 所達到的效果之一，因此 Schema 的建立將能夠持續改善使用者的搜尋體驗。
這裡補充一點，根據 firstpage.com 於 2023 年的數據顯示，自然搜尋結果的排名對於點擊率有非常大的影響，第一名點擊率約為 39.8%，第二名僅 18.7％（只有第一名的 1/2 不到），第三名更是低到10.2%！參考資訊
#2-2 廣告結果（Paid Results ）
Google 在 2001 年推出 Google AdWords 功能（現已更名為 Google Ads），從此以後 SERP 上多了有廣告區塊，這也提供商家更多元的行銷操作。
付費廣告搜尋結果是商家使用 Google Ads 的廣告服務，進行廣告操作，商家可以在 SERP 醒目的版位上投放廣告，吸引潛在消費者點擊。
#2-3 知識圖譜（Knowledge Graph ）
2012年，知識圖譜的功能開始啟用，是為了讓使用者能夠更快速的獲得解答、得到更全面的訊息。
#2-4 通用搜尋結果（Universal Search Results ）
於 2007 年，Google 開始在搜尋結果嘗試混合除了網頁以外的其他資源，盡可能多為使用者提供最相關和最有用的資訊，讓使用者能夠從搜尋結果中直接得到想要的訊息，包含影片、新聞、圖像、地圖和圖書等。通用搜尋結果結合在自然搜尋當中，依照相關性出現在 SERP 上，不受排名演算法影響。
在過去的搜尋引擎當中，使用者在進行搜尋的的行為，只會得到網頁排名的結果，但自從 AdWords 在 2001 年加入 Google 的服務後，Google 搜尋引擎就致力於改善、豐富搜尋結果頁，現在的搜尋結果可以透過分析關鍵字背後的使用者需求，提供更多不同的管道與資訊，讓使用者在尋求解答的過程當中能夠更加的精準、多元。
#3 自然搜尋結果的元素有哪些？
討論到這，我們可以發現 Schema 能夠在自然搜尋結果頁面中大大改善使用者體驗，以下介紹幾項自然搜尋結果中的常見元素：
#3-1 網頁連結（Sitelinks）
當使用者使用有明確品牌搜尋意圖的關鍵字時，SERP 除了呈現品牌網站的標題、網址、摘要之外，下方也會額外出現網站內部的連結。當品牌網站在 SERP 中呈現出這個元素，能讓使用者更快速發現他們想要進入的品牌網站頁面。如下圖：
#3-2 論壇搜尋結果（Forum Results）
論壇搜尋結果是在使用者尋找論壇中的專業討論時，SERP 會出現的元素之一，論壇裡的討論文章頁面能夠以特定的方式呈現，如 Mobile01、PTT 都很常出現額外的文章連結。如下圖：
#3-3 複合式摘要（Rich Snippets）
Rich Snippets 是為了提供更準確、詳細的摘要資訊，讓使用者可以更輕鬆的找到想要的資訊，Rich Snippets 常見的類型有評分、價格、日期、電話…等資訊。
#3-4 本地結果（Local Pack）
本地結果會藉由 Google maps 搜尋，找出使用者位置附近、且符合條件的地點，並呈現在自然搜尋當中，需要提到一點，Loca Pack 的顯示位置不受排名演算法的影響。
Google 商家提供的在地資訊也會成為 SERP 的呈現要素之一，使用者能藉由SERP 快速得知當地的店家，因此有經營 Google 商家的店家、餐廳、地標等，有機會出現於搜尋結果中，如下圖：
#3-5 常見問題 （FAQ）
當使用者搜尋的關鍵字具有「問題與解答」意涵時，就可以透過 FAQ 的 Schema 來結構化相關資訊，有機會可以在 SERP 中看到特殊的展示資料：使用者可以點擊下拉式選單直接從 SERP 看到常見問答的資訊。
自然排名結果不僅包含網頁排名，隨著使用者意圖不同，Google也會將圖片、影片及地圖搜尋結果列在 SERP 上。不用點擊進入頁面就能在 SERP 看到航班、天氣、股票、翻譯、匯率換算等資訊，這些改變都是為了提高使用者體驗，讓使用者能在最短時間內獲得想要的資訊。
在這個前提下，Schema 能夠幫助搜索引擎了解網站內容，通過結構化網站的文字架構與資料，可以幫助搜尋引擎精準呈現需要的資訊給使用者！
#4 那麼 Schema 有哪些類型？
我們可以參考 Google 官方說明文件，目前 Google 支援的結構化資料類型，約有30幾種，下方列出比較常見的類型：
- 文章（Article）
- 書籍（Book）
- 導覽標記（BreadcrumbList）
- 課程（Course）
- 事件（Event）
- 常見問題（FAQ）
- 教學步驟（How-to）
- 當地商家（Local Business）
- 商標（Logo）
- 產品（Product）
- 評論摘錄（Review snippet）
- 影片（Video）
#5 建立 Schema 有哪些做法？
目前比較常見的 Schema 類別分別為：JSON-LD、RDFa、microdata
在這裡需提到一點，對於身為市占率最高的 Google 來說，官方也有提供自己的結構化資料說明文件，其中表明 schema.org 上有許多屬性或物件，對 Google 而言並不一定重要，如 Google 雖然也支援 JSON-LD 、微資料（Microdata）及 RDFa 的寫法，但 Google 仍建議盡可能使用 JSON-LD。
以下簡單從網頁擷取出不同格式的原始碼供大家參考：
#5-1 JSON-LD
<html>
<head>
<script>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Article",
"headline": "瞭解結構化資料的運作方式 | Google 搜尋中心"
}
</script>
</head>
</html>
- 透過 @context 來宣告正在使用 schema.org 規定的結構化資料；@type 宣告結構化資料的類型。
- 就算是程式碼苦手也不用擔心，可以透過 Google 提供的結構化資料標記協助工具，跟著步驟一步一步設定，再將跑出來的程式碼中的空位部分一一填妥就行。
- 原則上，結構化資料的類型很多種，也都有許多各自的細項與描述，這些細項能夠填寫的越詳細越好，這樣能夠給予搜尋引擎更準確的資訊，也會讓 SERP 上的呈現有更多可能性。
#5-2 RDFa
<html>
<div typeof="Person">
<p>
<span property="name">Alice Birpemswick</span>,
Email:
<a property="mbox" href="mailto:alice@example.com">
alice@example.com
</a>,
Phone:
<a property="phone" href="tel:+1-617-555-7332">
+1 617.555.7332
</a>
</p>
</div>
</html>
參考來源：https://www.w3.org/TR/rdfa-primer/
- 在<div> 裡添加 typeof 屬性，並指定結構化資料的類型（這裡是人物）。
- 用 property 添加更多附加資訊：例如 property = “名字”、property = “電話” 等不同資訊。
#5-3 Microdata
<html>
<div itemscope itemtype ="https://schema.org/Movie">
<h1 itemprop="name"> 阿凡達 Avatar </h1>
<div itemprop="director" itemscope itemtype="https://schema.org/Person">
導演：
<span itemprop="name">詹姆斯·卡麥隆（James Cameron）</span>
出生於：
<span itemprop="birthDate"> 西元1954年8月16日 </span>
</div>
<span itemprop="genre"> 科幻 </span>
</div>
</html>參考來源：Getting started with schema.org using Microdata
- 整個寫法與架構與 RDFa 類似。
- microdata 更進步的一點是，可以在＜div＞中新增 itemscope 屬性，宣示這個區塊屬於結構化資料，讓爬蟲能夠更快速找到！
- RDFa 裡的 typeof 換成 itemtype，宣告結構化資料的類型。
- RDFa 裡的 property 換成 itemprop，添加更多附加資訊。
#6 相關工具介紹
#6-1 結構化資料標記協助工具
在上一段介紹 JSON-LD 的時候，提到了結構化資料標記協助工具，這項工具支援基本的 12 種結構化資料類型，包含問與答、文章、活動、當地商家、產品、電影、餐廳等等，簡單的操作如下：
- 選擇結構化資料的類型。
- 輸入想要建構結構化資料的網站網址或HTML 原始碼，按下「開始標記」。
- 透過反白的方式選取想要新增結構化資料的區域。
- 設定跟填寫好相關細項後，按下「建立 HTML」（輸出格式有 JSON-LD 或Microdata 兩種）。
- 將代碼複製並貼到網頁 HTML 原始碼中的 <head> 標籤內。
#6-2 結構化資料測試工具
做好結構化資料以後，我們還需要測試 HTML 是否有誤，才能放心把原始碼加進網頁，這時可以使用 Google 提供的工具來測試：複合式搜尋結果測試
在工具內，可以貼上網址或代碼來檢測，此外也可以選擇電腦版或手機版來測試！
當然，如果有自己的網站的話，Google 也提供免費的網站監測工具一Google Search Console，當串接了這個服務後，就能開始蒐集網站的相關資料，以及檢查、監測網站內的結構化資料囉！
#7 小結
到了這裡，我們可以瞭解 Schema 是 搜尋引擎優化（Search Engine Optimization, SEO）的重要做法，不過其主要目的依舊是為了使用者體驗！在這大前提下，不要為了過度優化而走錯了方向，如果設定了過雜又不準確的 Schema，一旦被搜尋引擎檢測出來，反而會降低排名。
所以我們會比較建議，與其將網站的所有大小資料都結構化，更應該以使用者的角度出發，當一個使用者透過XX關鍵字找到某個頁面時，他想被解決的問題是什麼？想獲得的資訊是哪些？還可以提供什麼他沒想到但卻可能是更好的解決方案？透過這種角度去思考，我們不是要建立龐雜的結構化資料，而是精準的將頁面想表達的重要資訊結構化，讓使用者能夠快速找到想要的資訊才對！
最後，我們還要說：結構化資料就跟許多 SEO 的優化技術相同，不論是搜尋引擎的演算法，還是 SERP 中的資料展示邏輯，都很難有精確的分數與進度評估成效，SEO 能做的，就是盡量傳遞友善的訊號給搜尋引擎，讓搜尋引擎知道網頁的改版或更新都是為了使用者體驗，但最終 SERP 資料的呈現還是交由搜尋引擎所決定，不過其實當我們的目標與搜尋引擎的核心價值一致時，網站與網頁排名自然會不斷提升！
#8 常見問題
