Favicon02

Title Tag 是什麼?SEO 標題寫法與顯示差異

SEO 的各種標籤中,最重要的就是 Title Tag。Title Tag 寫好未必能獲得好排名,但沒寫好一定很難獲得好排名。

Title Tag 是 HTML 中用來描述網頁標題的元素,通常會顯示在瀏覽器分頁,也會成為 Google 產生搜尋標題的參考。它與正文 H1 相關,但兩者不是同一個欄位。

這篇會說明 Title Tag 怎麼寫、在哪裡確認,以及當 Google 顯示不同標題時,應該先檢查什麼。

Title Tag 是什麼?

Title 中文意思就是標題,它就是標示一個網頁最重要的標籤,說明這個網頁叫做什麼名字的標籤。

而 Google 的搜尋結果上面顯示的網頁標題,也會採用這個 Title Tag,進而被使用者看到網頁標題,所以 Title Tag 真的非常重要。

畫面框起來的是搜尋結果的標題連結;它可能採用 Title Tag,也可能由 Google 參考其他頁面訊號產生。


怎麼找到 Title Tag?

搜尋結果顯示的是標題連結,未必等於 HTML 的 Title Tag。要確認實際設定,可以先看瀏覽器分頁,再到原始碼查看 title 元素。

接下來最需要知道的,就是在「網頁原始碼」中找到 Title Tag,關於如何查閱網頁原始碼,可以參考文章《怎麼看網頁原始碼?SEO 人必會的網頁開發者工具(F12)》。

像是這個網頁的 Title Tag 就是:

<title>公關是什麼意思?公關不只是辦活動而已,而是關於品牌的一切 – Frank Chiu</title>

確實與我的網頁標籤、SERP 顯示的標題一致。


Title Tag、H1 和搜尋結果標題一樣嗎?

先分清楚你看到的是哪一種標題

Title Tag 是 HTML 中的 <title> 元素;H1 是頁面正文的主要標題。兩者應準確描述同一頁內容,但不必逐字相同,CMS 也可能用不同欄位管理。

Google 搜尋結果顯示的標題連結,可能參考 Title Tag、頁面上的主要標題與其他訊號重新產生。看到搜尋標題和後台不同時,要先分清「頁面實際輸出錯誤」與「Google 顯示不同文字」,再決定要修哪裡。

修改後查看網頁原始碼中的 title,再比對頁面 H1;搜尋結果的更新還需要重新處理。寫法與顯示原理見 Google 標題連結說明。


為什麼 Title Tag 對於 SEO 這麼重要?

Title Tag 能幫助使用者與搜尋引擎辨識頁面主題,也是搜尋標題的重要參考;標題寫得準確清楚值得優先處理,但不能只憑這個欄位推算排名或保證成效。

Title Tag 就是一個網頁的門面、像是一個書的書名,儘管字數不多,但卻能直接代表這個網頁的核心訊息,幫助搜尋引擎作為排名的重要依據。

更重要的是,Title Tag 要優化非常的容易,人人都能做到。

打個比方,SEO 如果是一棵果樹,Title Tag 就是最低垂、最甜美的果子,非常容易摘下來,不吃實在可惜。相對的,如果你的競爭對手都有吃 Title Tag 這顆果子,那麼你就會陷於非常不利的局面。

請記得要吃這顆果子。


怎麼寫好 Title Tag?

要怎麼寫好 Title Tag?我這邊建議有三個大方向可以參考。

一、標題符合網頁內容

Title Tag 就是網頁的門面、一本書的書名,所以標題要符合網頁網頁的內容,不然就是在欺騙讀者,這是 Google 不樂見的,也不會有好排名。

是什麼內容,就寫上對應的標題。


二、標題放置目標關鍵字

Title Tag 裡面要放上目標關鍵字,至少 1~2 次,這非常基本,但又極為重要。

你可以觀察排名不同搜尋結結果頁(SERP)前五名的標題,所有人幾乎都會帶到目標關鍵字。

好比前面我們截圖的「公關」SERP,可以看到裡面都有提到「公關」這個關鍵字。

  • 公關是什麼意思?公關公司工作內容有哪些?-公關行銷
  • 公關是什麼?完整解析工作內容,了解公關對企業的重要性
  • 公關是什麼意思?公關不只是辦活動而已,而是關於品牌的一切

如果你希望自己文章的 SEO 表現能變好,在標題加入目標關鍵字是非常重要的,而且盡量越前面越好。


三、標題長度要恰如其分

不曉得你有沒有發現,在前面的截圖中,我自己部落格 frankchiu.io 的標題出現了「…」。

我完整的 Title Tag 是:「公關是什麼意思?公關不只是辦活動而已,而是關於品牌的一切 – Frank Chiu」。

但最後只顯示了:「公關是什麼意思?公關不只是辦活動而已,而是關於品牌的…」,其中後面的「一切 – Frank Chiu」並沒有顯示,這就是因為我 title 寫太長,所以被 Google 截斷。

所以說,標題不能寫太長,標題的長度約莫是 550 pixel 寬度左右,這個長度 Google 會不定期變長或變短,但約莫就是在這個區間。

之所以用 pixel 寬度,是因為搜尋引擎是算寬度,不是看字數,我們如果使用標點符號、空白符號等等,也都會算進去這個寬度。


為了方便大家理解,這個寬度約莫是 28 個中文的全形字元,給大家對比一下這個寬度約莫多長。

示範(你可以從下面一二三對應字數):

  • 公關是什麼意思?公關不只是辦活動而已,而是關於品牌的…
  • 一二三四五六七八九十一二三四五六七八九十一二三四五六七八

如果你擔心被裁切標題,可以把字數控制在 25 個、甚至更短,這樣就更不容易被砍標題。

但有些兩難的是,有時候我們的確需要這麼多字數才能放好目標關鍵字以及表達文章的精神,這就仰賴我們撰寫標題的文案功力了!

這邊也推薦一個實用工具「Google SERP Snippet Optimization Tool」,這個工具可以幫助我們觀看 title 長度是否會過長。

網址:https://www.highervisibility.com/seo/tools/serp-snippet-optimizer/


哪裡設定 Title Tag?

如果像是 WordPress 或 Vocus 等部落格平台,文章的標題就是 Title Tag。

如果是像是 Shopline 這些電商平台,也會有一個欄位可以設定 Title Tag,搜尋一下說明中心、或在後台摸索一下相信很快就能找到。



Google 顯示不同標題時的處理方式

Google 為何要改我的標題?這題很常見,每個人都希望自己寫的標題被原汁原味呈現,但還是很常碰到被 Google 改標題的狀況。

當被改標題,通常這意味:Google 認為改過的比較好。

常見的理由如:

  • 標題跟關鍵字之間不夠相關
  • 標題太長了,需要砍字數

我的建議:

  • 如果排名很好,那建議就放著、不要改
  • 如果排名不好,那可以改改看標題跟內文

網站名稱尾綴如何影響標題長度

所謂的網站尾綴就是網站名稱,通常都會一起顯示在 title 當中,讓品牌名稱可以跟網頁一起曝光。

好比說我的 Title Tag 的樣貌都是「OOO– Frank Chiu」,當中的「– Frank Chiu」就是尾綴。

有些的人尾綴會很長、希望裡面能多塞一些行銷用詞或關鍵字,像是會想寫成「OOO–Frank Chiu 給你最白話的 SEO 教學」,這乍看很棒對吧?

但如果回到上面公關的標題,套上去就會變成「公關是什麼意思?公關不只是辦活動而已,而是關於品牌的一切 – Frank Chiu 給你最白話的 SEO 教學」,這樣的標題變成了 899 pixel 寬,變成了 43 個全形中文字寬,嚴重超標。

因此我建議網站的尾綴能短則短,首頁或特殊頁面可以再寫得更花俏一點,這時候再把你的品牌定位跟訴求放進去即可。

好比說我的首頁 Title Tag 就是:「邱韜誠 Frank Chiu:SEO 白話文、行銷策略、邏輯思考」。

而蘋果的 title 也非常簡潔,你也可以多參考你喜歡品牌的 title 寫法。

  • 首頁:Apple (台灣)
  • 一般頁面:OOO – Apple (台灣)

另一方面,Google 官方也不喜歡網站 title 尾綴過常,可以參考以下說明:

「Google建議品牌標題時要簡明扼要。這表示使用網站名稱是可以的,但在整個網站上重複行銷口號不一定算是簡潔的做法。」

資料來源:《Google Answers If Matching How It Rewrites Title Is A Good Idea》。

Title Tag、H1 與 Open Graph 的關係

H1 跟 Title Tag 通常一樣

一般網頁中,尤其是文章資訊頁,通常會有該頁的文章大標,這個大標通常都是跟 Title Tag 相同的。

但如果網站後臺功允許,你是可以設定 H1 與 Title Tag 有不同的內容的。


Open Graph (aka 社群分享的標題)通常跟 Title Tag 一樣

我們在社群媒體上分享連結,同樣會顯示標題。像是在 Facebook、Line、Linkedin 分享連結,也會顯示連結的標題。

這個叫做 open graph,簡稱 og,是一種為社群傳播而設計的標籤,而這個 og 的內容原則上也會跟我們設定的 title tag 相同,它叫做「og:title」,裡面也有 title!



重點整理

Google 為何改我的標題?

Google 可能因標題與查詢不夠相關或標題過長而調整顯示。是否修改,還要一起觀察頁面內容與實際排名表現。

為什麼不建議網站尾綴太長?

網站名稱尾綴會占用標題的顯示空間,過長的口號容易讓主要內容被截斷。一般頁面的品牌名稱宜簡短,首頁再完整表達定位。

Frank Chiu
Frank Chiu

SEO/GEO 顧問、行銷顧問。協助本地企業與跨國企業導入 SEO、GEO 跟行銷方案,包括:雀巢、凱基銀行、大人學、居家先生、IKEA、vocus 等。

訂閱電子報