站点运营

站点运营:标题层級自查,別让一篇文章里冒出三個 H1

很多站点的内容本身没問题,乱的是标题层級:模板自带一個 H1,編輯在正文里又贴一個,侧栏推荐位也顺手用 H1。本文说说标题层級如何影响搜尋引擎對頁面的理解,给出不用工具就能做完的自查步骤,並梳理模板與編輯規范配合时常见的几個坑。

站点运营

站点运营:标题层級自查,別让一篇文章里冒出三個 H1

很多站点的内容本身没問题,乱的是标题层級:模板自带一個 H1,編輯在正文里又贴一個 H1,侧栏的推荐位标题也顺手用了 H1。訪客视觉上看不出区別,但搜尋引擎讀到的是三個並列的主题,它很难判断這一頁到底在讲什么。

标题层級不是排版工具

H1 到 H6 最初的用途是表達内容的從属關系,不是用来調字号和颜色的。字号、粗细、間距属于样式問题,交给 CSS 處理更合适。把两件事混在一起,改版时就會互相牵制:想調样式不敢動标簽,想調结构又怕頁面變形。

比較通用的做法是:一個頁面保留一個 H1,用来概括整頁主题;下面用 H2 划分主要章节;H3 表示 H2 之下的细分;再往下同理。不跳級,也不要用 H4 去反包 H2 的内容。

最常见的四類問题

  • 一頁多個 H1:常见于模板 H1 加正文 H1,或者一個列表頁里每個摘要卡片都套了 H1。
  • 跳級:H2 之後直接跳到 H4,中間缺席的层級會让大纲出現断点,讀起来像漏了一节。
  • 把标题标簽当样式用:為了加粗、變色随手套一個标题标簽,而這段内容並不是一個章节标题。
  • 标题與内容不符:H2 寫的是「常见問题」,下面却是一段产品介绍;或者标题里塞满關鍵詞,讀起来不像人话。

不用工具也能做的自查

把頁面源碼打開,检索 h1 到 h6 這些标簽,按出現顺序抄一份清單下来,然後照着清單問几個問题:

  1. H1 是不是只有一個,而且出現在正文主标题的位置,而不是宽泛的站点名?
  2. 标题层級是不是连續的,有没有從 H2 直接掉到 H4 的情况?
  3. 把這份清單單獨讀一遍,能不能還原出文章大纲?如果讀起来前後不搭,多半是层級标错了。
  4. 抽查不同模板:首頁、栏目頁、詳情頁、专题頁各挑两三個,看問题是不是集中在某一個模板里。
  5. 看看有没有标题是為样式而生的:去掉样式之後,它還算不算一個章节标题。

這套检查不需要任何插件,一個頁面十几分钟就能過一遍。真正費時間的是改模板,尤其是标题层級由多個组件拼出来的站点。

修改时容易踩的坑

先改结构,再調样式

調整层級的时候,尽量不要同时動样式。先把标簽改對,再去补相應的 CSS,出問题时容易定位。改完抽查几個頁面的渲染效果,特別是标题字數特別長或者特別短的頁面,看會不會挤出容器或者換行难看。

規范要和後台對齐

還有一個容易被忽略的地方:編輯規范和模板要同步。如果編輯手册里寫着「正文小标题用 H2」,而模板的正文区根本不接受 H2,那這條規范就只能停在纸面上。規范、後台編輯器、前端模板三者對齐,层級才不會一次又一次地乱回去。

标题层級是给机器和人都看的结构說明。它不直接决定收錄或排名,但會影响一頁内容被理解得是否清楚。

说到底,标题层級只是站点结构里很小的一环,却经常是最先被弄乱的一环。每隔一段時間抽查几類頁面,把明顯不合理的地方改掉,比一次性大改要稳妥得多。