正確使用標題標籤提升 SEO:H1 到 H6 的結構規劃與常見錯誤

Published on: | Last updated:

嗯... 今天... 想來聊聊那個 H 標籤。就是 H1, H2, H3 那些。很多人,很多人在講 SEO 的時候都會提到這個,但好像... 常常有一些誤會。我試著... 把它講得清楚一點。

先說結論好了

嗯... 重點其實不是去背誦什麼「H1 只能一個」、「H2 可以很多個」這種規則。老實說,你應該把 H 標籤想成... 一本書的目錄。 H1 是書名,H2 是章節,H3 是章節裡的小節。它的核心價值... 是「結構」。 這個結構是給兩種「人」看的:一個是你的讀者,另一個... 就是 Google 的爬蟲機器人。

大家常搞混的:H1 到底能有幾個?

這個問題... 真的講到爛了。很多、非常多的 SEO 文章或教學,都會說一個頁面「只能有一個 H1」。 這個說法... 其實是來自以前的 HTML4 最佳實踐,很長一段時間都是對的。所以很多台灣的 SEO 專家,到現在還是會建議你為了單純、清楚,就維持一個 H1 就好。

不過呢... 現在是 HTML5 的時代了。HTML5 的語意結構,是允許你在一個頁面裡有多個 H1 的。 比如說,你的頁面裡有一個 `

` 區塊和一個 `
` 區塊,那這兩個區塊... 理論上,都可以有自己的 H1。Google 官方的 John Mueller 也親口說過好幾次,系統處理多個 H1 是沒問題的。他說,標籤的層級結構... 比你用的是 H1 還是 H2 更重要。所以... 不要再為了這個問題自己嚇自己了。

H 標籤的階層概念示意圖
H 標籤的階層概念示意圖

那... 到底要怎麼規劃?

既然說了是目錄,那就照著寫目錄的邏輯去想,就... 很簡單。忘掉 SEO,先想著怎麼讓讀者看懂你的文章。

你的思考流程應該是這樣:

  1. 整個頁面的核心主題是什麼? 好,這就是你的 H1。通常就是文章標題。
  2. 為了說明這個主題,我需要分成哪幾個大的部分? 這些... 就是 H2。
  3. 在某個 H2 的部分底下,是不是又能分出幾個小重點? 嗯,那就是 H3。
  4. ...以此類推,H4, H5, H6 就這樣下去。雖然說真的... 一般文章用到 H4 已經很少見了。

最重要的一點... 就是不要跳級。 比如說,寫完 H2,下一個小標題應該是 H3,而不是為了字體大小好看,直接跳到 H4。這會讓那個「目錄」的結構斷掉,Google 爬蟲... 和使用螢幕閱讀器的使用者,都會覺得很困惑。

一個實際的例子,好的跟壞的

我們直接來看程式碼,這樣比較有感覺。假設我們在寫一篇關於「貓咪的飲食習慣」的文章。

這是一個... 嗯,不太理想的結構:

<h1>貓咪的飲食全攻略</h1>
  <p>貓咪是肉食性動物...</p>
  
  <h3>乾飼料的選擇</h3> <!-- 錯誤:從 h1 直接跳到 h3 -->
  <p>乾飼料的優點是...</p>
  
  <h2>濕食的重要性</h2> <!-- 錯誤:h3 跑到了 h2 前面 -->
  <p>貓咪需要透過食物補充水分...</p>
  
  <h4>主食罐 vs 副食罐</h4> <!-- 錯誤:應該是 h3,不是 h4 -->
  <p>主食罐營養均衡...</p>
  

你看,這個結構就是亂的。現在我們把它... 修正一下:

<h1>貓咪的飲食全攻略</h1>
  <p>貓咪是肉食性動物...</p>
  
  <h2>貓咪主食的種類</h2>
  <p>貓咪的主食大致可以分為...</p>
  
  <h3>乾飼料的選擇</h3>
  <p>乾飼料的優點是...</p>
  
  <h3>濕食的重要性</h3>
  <p>貓咪需要透過食物補充水分...</p>
  
  <h4>主食罐 vs 副食罐</h4> <!-- 正確:在 h3 下一層,解釋濕食的細節 -->
  <p>主食罐營養均衡...</p>
  
  <h2>餵食的常見問題</h2>
  <p>很多新手飼主會問...</p>
  

這樣... 是不是就清楚多了?這就是一個有邏輯的結構。對人、對機器都友善。

標題結構混亂與清晰的對比
標題結構混亂與清晰的對比

常見的幾個錯法,我直接列出來

除了剛剛講的跳級之外,還有一些... 嗯,大家常犯的錯。我整理成一個表好了,比較清楚。

常見錯誤 為什麼不好... 還有該怎麼做
為了外觀亂用標籤 這個最常見。就是想讓字變大變粗,就隨手給個 H2 或 H3。但 H 標籤是「語意」,不是「樣式」。想改外觀... 拜託,去用 CSS。
所有標題都塞滿關鍵字 嗯... 以前可能有用吧。但現在 Google 沒那麼笨了。標題自然、能描述段落內容最重要。硬塞關鍵字,反而讓句子不通順,讀者體驗很差。
標題跟內文對不上 這個... 有點像標題黨。標題寫得很聳動,結果內文根本沒講到。Google 跟你說的一樣,會覺得你在騙點擊,對排名沒好處。
整個頁面只有 H1 就是... 一大篇文章從頭到尾都沒有小標題。對讀者來說是個災難,根本找不到重點。對 Google 來說,它也抓不到你這篇文章的架構跟重點段落。

H 標籤不只為了 SEO,還有...

這點我覺得... 其實比 SEO 更重要。就是「網站的可及性」,Accessibility,常常簡寫成 a11y。

你要知道,很多視障朋友是使用「螢幕閱讀器」來上網的。 這個軟體會... 會把網頁上的文字唸出來。當它們遇到一個結構良好的頁面時,使用者可以叫軟體「只唸出所有標題」。就像我們用眼睛掃描目錄一樣,他們可以用耳朵「聽」目錄,然後快速跳到自己想看的段落。

如果你亂用 H 標籤,或者根本沒用,那對他們來說... 這整個頁面就是一堵巨大的文字牆,完全沒有入口。所以,把 H 標籤結構做好,你不只是在做 SEO,你是在做一件... 嗯,更體貼、更基本的事。

螢幕閱讀器如何利用標題結構來導覽
螢幕閱讀器如何利用標題結構來導覽

結語... 呃,該怎麼說呢

總之... 不要把 H 標籤想得太複雜、太技術。它就是一個很基本的... 內容組織工具。 先把你的讀者服務好,讓他們能輕鬆閱讀,Google 自然也會喜歡你的頁面。 因為 Google 的終極目標,就是提供有用的、好讀的內容給使用者。你們的目標... 其實是一樣的。

所以,下次寫文章,先別想關鍵字、別想排名。先把目錄大綱列好,H1、H2、H3... 把它們安排得清清楚楚。光是這樣,你的 SEO 基礎就已經打得比很多人都好了。


換你思考一下:

回想一下你自己最近寫的一篇文章,或是你公司網站的某個頁面。它的 H 標籤結構是清楚的嗎?還是看完這篇才發現... 啊,好像都亂掉了?在下面留言分享你的「啊哈!」時刻吧。

Related to this topic:

Comments

  1. profile
    Guest 2025-10-05 Reply
    其實這個網站標題的問題,自己也真的遇過一些很妙的狀況,特別是家長身份在幫小孩找資料的時候。嗯,有些網頁內容超多,資訊很齊全,但結果那個title平平淡淡的,就是什麼「學習資源首頁」或「數學教材」,根本看不出重點在哪,只能一頁一頁點開來比對,蠻花時間的。我有印象上次找小學數學補充資料,全都用同樣類型的標題,搞到很無助,所以後來覺得,如果可以把單元或主題名稱直接寫進title,好像對家長或老師會省很多麻煩,也比較快就能判斷要不要點進去。 然後還想到一件事,就是朋友提到Google有時候會自動調整你網頁原本設計好的title - 這個我當初聽到也滿驚訝。你想說用心想好關鍵字結果跑出去變成別的,看起來蠻崩潰。其實不是只有站長難過,用戶端如果每次查詢結果標題一直在變,也是會覺得這網站亂糟糟的不太可靠。特別小網站,有人力有限,其實就先優化流量大或重點頁面,不用全部都急著改,不然反而效果不好。差不多就是這樣,你們有遇到嗎?
  2. profile
    Guest 2025-09-19 Reply
    超讚的文章!剛好最近在做部落格SEO,標題這塊真的很頭痛。尤其是要平衡關鍵字和吸引力,感覺Google越來越聰明了,我們要更聰明才行
  3. profile
    Guest 2025-09-17 Reply
    老師,想請教一下 SEO 的小撇步!剛開始接觸網站優化,對 title 這塊還蠻迷惑的。有沒有機會約個時間討論?感覺這篇文章好像很有乾貨的樣子
  4. profile
    Guest 2025-04-17 Reply
    嗨!我是一位家長,最近在學校的網站上看到了一些標題標籤的問題,想請問有沒有資源或建議可以幫助我們更好地理解和運用這些標籤呢?謝謝!