每个页面仅一个h1且须在main内,article用于独立内容、section用于逻辑分组,img必须有语义化alt,结构化数据需与html结构严格对应并验证。

每个页面只用一个 h1,且必须出现在 main 内部
搜索引擎把 h1 当作页面主题的最强信号。如果出现多个 h1,或它被包在 header 里但 main 里没再出现,爬虫容易误判主内容位置。
常见错误现象:
- 首页用
h1写“欢迎来到XX公司”,文章页却用h1写“关于我们”,导致主题漂移 -
h1放在header的 Logo 里,而正文标题用了h2,主内容失去最高级语义锚点
实操建议:
- 文章页、产品页等内容页,
h1必须是当前内容标题,且包裹在main标签内 - 首页可将品牌名设为
h1,但需确保它代表该页核心意图(如官网首页,“XX科技——AI基础设施提供商”) - 避免用 CSS 把
h2视觉放大来冒充h1,语义不可伪造
article 和 section 不是同义替换,用错会稀释内容权重
article 表示能独立分发、复用的内容单元(比如一篇博客、一条新闻),而 section 只是同一主题下的逻辑分组(比如“技术参数”“用户评价”“售后服务”)。混用会导致搜索引擎无法区分主次。
使用场景差异:
- 博客列表页:每个条目用
article,整个列表用section包裹 - 单篇文章页:全文用一个
article,内部小节用section+ 对应层级的h2/h3 - 首页的“客户案例”区块是
section,里面的每条案例才是article
性能影响:
- 滥用
article(例如把导航菜单、页脚版权都套进去)会让爬虫误以为存在大量独立内容,反而降低单页可信度 - 全用
div替代二者,等于放弃语义提示,SEO 权重回归“裸 HTML”水平
alt 属性不是可选填空,而是图片 SEO 的强制入口
所有 img 标签必须有 alt,空值 alt="" 仅适用于纯装饰图(如分隔线、背景花纹)。漏写或写成“图片1”“logo”这类无意义文本,等于主动屏蔽图片搜索流量和可访问性支持。
参数差异与写法要点:
- 内容图(如产品实拍、教程截图):
alt需描述画面+上下文,例如alt="MacBook Pro M3 14寸笔记本侧面接口特写,含HDMI、SD卡槽和两个Thunderbolt端口" - 图标类图像(如“搜索”放大镜):
alt="搜索"足够,不必加“图标”二字 - 带链接的图:
alt应说明点击后行为,例如alt="返回首页",而非“网站Logo”
容易踩的坑:
- 用
title属性替代alt——title是悬浮提示,不参与索引 - 在 CMS 后台上传时留空
alt,前端模板又没做兜底 fallback - 自动化生成页面时,用文件名(如
product_001.jpg)直接填充alt
结构化数据要配对验证,光写 JSON-LD 不等于生效
很多开发者把 JSON-LD 往 head 里一贴就认为完成 Schema 标记,但若页面实际 HTML 结构和标记字段不匹配(比如标记了 datePublished,但页面中找不到对应 time[datetime] 元素),Google 会忽略整段数据。
实操关键点:
- 用 Google Rich Results Test 或 Schema Markup Validator 实时校验,不只是看“无错误”,更要确认字段被成功提取
- 时间类字段优先用
time[datetime]标注,例如<time datetime="2026-04-28">2026年4月28日</time>,比纯文本更可靠 - 作者信息不能只靠
JSON-LD声明,页面上也得有可见的by <span>张三</span>或@#@#@#@#@#@#@#@#@#@0
最常被忽略的是:语义标签和结构化数据必须相互印证。单独强化任何一方,效果都会打折扣。
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!











