Alt文本(替代文本)是添加到HTML图片的简短描述。它有两个关键目的:帮助依赖屏幕阅读器的视障用户了解 图片所示的内容,并为搜索引擎提供图片内容的上下文。编写好的alt文本是您可以对网站的可访问性和图片SEO 做出的最简单、影响最大的改进之一。
什么是Alt文本,它在哪里?
在HTML中,alt文本是img元素上的alt属性:
<img src="golden-retriever.jpg" alt="金色猎犬幼犬在秋天落叶中玩耍">
Alt文本在两种情况下显示:
- 当图片加载失败时(链接损坏、连接缓慢)
- 当屏幕阅读器为视障用户朗读页面时
搜索引擎爬虫(Googlebot、Bingbot)读取alt文本来了解图片所示的内容,并使用此内容在Google图片中索引 图片,并了解周围内容的上下文。
编写好Alt文本的规则
- 具体且描述性: "木桌上带绿色手柄的白色陶瓷咖啡杯"远比"咖啡杯" 或"图片"好得多。描述图片实际显示的内容。
- 保持简洁: 大多数屏幕阅读器与周围内容一起朗读alt文本。长的alt文本(超过125个字符) 会干扰听取。目标是1-2句话。
- 不要以"图片"或"照片"开头: 屏幕阅读器在读取alt文本之前已经 宣布了"图片"。添加"图片的"是多余的。
- 自然地包含关键词: 如果图片显示您的产品、服务或主题,请包含相关关键词 — 但前提是它真正描述了图片所示的内容。
何时使用空Alt文本
某些图片纯粹是装饰性的 — 不传达信息而增添视觉趣味的分隔线、背景纹理、抽象形状。对于这些,使用空的 alt属性:
<img src="decorative-wave.svg" alt="">
空的alt=""告诉屏幕阅读器完全跳过图片。对于装饰性图片,始终包含alt="", 永远不要完全删除该属性。
SEO的Alt文本:Google实际使用什么
- 没有alt文本的图片更难在Google图片中排名: 没有alt属性,Google无法确信地确定 图片显示什么。
- Alt文本有助于页面相关性: 带有适当alt文本面包照片的关于自制面包的博客文章 向Google强化了页面的主题相关性。
- 不需要精确的关键词匹配: 包含相关词汇的自然描述比强制插入关键词表现更好。 首先为人类而写。
避免常见的Alt文本错误
- 关键词堆砌: 这是垃圾邮件信号。Google可以检测关键词堆砌的alt文本,它对排名没有帮助。
- 使用文件名作为alt文本: 对用户和搜索引擎都没用。始终编写有意义的描述。
- 对所有图片编写相同的alt文本: 每张图片应有唯一的alt文本来描述该特定图片。
超越Alt文本优化您的图片
Alt文本是图片SEO拼图的一部分。用适当优化的图片文件来补充它:
- 使用描述性文件名而不是通用名称(
homemade-sourdough-bread.jpg优于DSC_0019.jpg) - 使用Picovert的压缩器压缩图片以提高页面速度 — 这本身就是SEO信号
- 将图片调整为它们将显示的最大尺寸 — 使用图片调整大小工具匹配显示尺寸。
- 在发布前从图片中删除包含GPS数据的EXIF元数据。使用Picovert的EXIF删除工具进行隐私保护。
好的alt文本与适当优化的图片(正确尺寸、压缩、描述性文件名)相结合,创建了完整的图片SEO信号, 对用户和搜索引擎都有帮助。