HTML Meta Tags 是什麼？藏在網站後的 SEO 關鍵！
操作 SEO 一定不能不提到 HTML 的 Meta Tags（即 Meta 標籤），Meta Tags 是透過標記各種資訊來描述網頁當中的內容，對於網站的資訊架構來說非常重要！
那究竟什麼是 HTML Meta Tags 呢？字面上來看，Meta 是「Metadata」的意思，中文譯為「元資料」，即為「描述其他資料的資料」；而 Meta Tags 則被稱為「元標籤」，用以描述網頁資料的標籤，多以 HTML 的語法撰寫，因此 Meta Tags 內容一般不會直接顯示在網站中，而是會被撰寫在 HTML <head> 的區塊。
為什麼需要設定 Meta Tags 呢？原因在於，搜尋引擎爬蟲在讀取網頁時，會以 HTML 語法內容優先閱讀，Meta Tags 若設定得當，可以清楚地讓搜尋引擎爬蟲更明確地了解網頁中的資訊，後續就有機會取得好的 SEO 成效！
延伸閱讀 SEO HTML 基本概念： 【SEO HTML概念篇】SEO操作必學！從0到1的HTML基礎知識教學
影響 SEO Meta Tags 有哪些？7 個常見 Meta 標籤總整理！
了解 Meta Tags 的重要性後，以下整理 7 個最常見且對 SEO 影響較大的標籤種類，其中以 Meta Title 與 Meta Description 兩者最為重要且易操作。7 個 Meta 標籤的整理如下，可以直接點擊表格中的標籤名稱前往查看細節說明與 HTML 實際撰寫的語法範例喔！
| Meta 標籤名稱 | Meta 標籤作用 |
|---|---|
| Meta Title | 網頁的標題 |
| Meta Description | 網頁的內容摘要 |
| Meta Charset | 字元編碼 |
| Canonical | 網頁識別 |
| Viewport | 各裝置顯示 |
| Robots | 拒絕檢索／索引 |
| Hreflang | 語種設定 |
Meta Title－判斷網頁主題的關鍵 Meta 標籤
Meta Title 即是網頁標題，是判斷網頁主題相當重要的 Meta Tag。除了在 HTML 語法中影響爬蟲的解讀外，Meta Title 也會顯示於搜尋結果頁中，是決定使用者是否點擊網頁的關鍵因素！
值得注意的是，Meta Title 並不直接等於文章標題，但兩者通常會是相同的。在發想完一個好的文章標題後，也要再回頭確認 Meta Title 是否有同步設定好。
Meta Title 實際 HTML 語法撰寫的方式如下：
<head>
<title>網頁標題</title>
</head>
Meta Description－網頁內容精華摘要
另一個常和 Meta Title 一起討論的標籤是 Meta Description。Meta Description 可視為網頁內容的精選摘要，和 Meta Title 一樣，也會顯示於搜尋結果頁中。
Meta Description 實際 HTML 語法撰寫的方式如下：
<head>
<meta name=”description” content=”網頁內容敘述”>
</head>
網頁標題和網頁描述在使用者體驗上扮演舉足輕重的角色，在設計和撰寫上也有許多需要留意的小細節，所以大家如果想要操作 SEO，不要忘記搭配 Ranking 另外撰寫的 Meta Title Meta Description 教學文章一起閱讀喔！
Meta Charset－字元編碼
Charset 用以指定瀏覽器展示網頁內容時採用的字元編碼，主流網頁使用的字元編碼為 UTF-8。若未正確使用字元編碼，會讓使用者在瀏覽網頁時出現亂碼、影響使用者體驗。
<head>
<meta charset=”UTF-8”>
</head>
Canonical－網頁識別
Canonical 中文譯為「標準的；權威的」，Canonical Tag 在 SEO 領域則是用來處理無法避免的類似內容問題，設置這個 Meta Tag 可以告訴爬蟲在幾個類似頁面中何者才是最主要的網頁內容，並顯示於相關的搜尋結果頁中，以減少因搜尋引擎誤認重複內容而懲罰的可能性。
想進一步了解 Canonical 標籤，可以參考 Ranking 部落格獨立撰寫的 Canonical URL 教學文章喔！
延伸閱讀：重複內容全指南：一篇教你避免重複內容瓜分網站 SEO 排名
<link rel=”canonical” href=”網頁 URL”>
Viewport－裝置顯示
Meta Viewport 讓網頁能根據使用者使用的裝置顯示正確的排版。由於搜尋引擎演算法近年來對行動裝置的體驗愈加重視，因此妥善設定與裝置顯示相關的 Meta Tag Viewport 讓各裝置能正常顯示網頁尺寸與排版是不可少的。
<head>
<meta name=”viewport” content=”width=device-width, initial-scale=1”>
</head>
Robots－拒絕檢索／索引
一般未特別處理的網頁，皆會被搜尋引擎爬蟲爬取，後續進行檢索與索引。但若有特殊頁面不希望被爬蟲爬取或顯示於搜尋結果頁上（ex. 開發中的網頁、網站後台等），則可設定 Robots.txt 或 noindex 語法告知爬蟲，該頁面不希望被檢索／索引。
<head>
<meta name=”robots” content=”noindex,nofollow”>
</head>
Hreflang－語種設定
若網頁屬於多語種網頁，可以設定 Hreflang Tag 來告知搜尋引擎，讓不同地區的使用者能獲得對應的語種內容。
<link rel=”alternate” href=”網頁 URL” hreflang=”語言代碼”>
過往重要 Meta Tag 參考：Meta Keyword
介紹完重要的 7 個 Meta 標籤，最後提供一個過往很重要、但已被演算法淘汰的 Meta 標籤給讀者們參考－Meta Keyword。看到「Keyword」很快能聯想到跟關鍵字有關，但既然跟關鍵字有關，對 SEO 來說不是很重要嗎？
Meta Keyword 的確有段時間是搜尋引擎爬蟲參考網頁的重要依據之一，但因為設置容易且不影響閱讀體驗，Meta Keyword 標籤後期很常遭到濫用，被惡意操作塞入關鍵字，在 2009 年之後遭到 Google 棄用。因此目前就算有設定 Meta Keyword，對於網頁的 SEO 也不會有太大的幫助囉。
結語：善用 Meta Tags、搶佔 SEO 高位
本文介紹到的不同 Meta Tags 能夠讓搜尋引擎爬蟲獲得網頁不同面向的資訊，運用得當則能為 SEO 大大的加分！其中最重要的兩個標籤－Meta Title＆Meta Description 更是兩大重點，各位 SEOer 千萬不能忽略！
Ranking SEO 工具除了上面提到文案規劃工具，能幫助使用者在撰寫文章時一併規劃 Meta 標籤的內容外，另有網頁評測功能協助使用者檢查已上線網頁的 Meta Title 與 Meta Descriprion 是否符合格式；批量評測更能一次檢測多個網頁，協助用戶省下時間！若想體驗 Ranking SEO 強大火力，快點擊註冊，免費試用！
