figcaption标签的作用：HTML figcaption图文标题搭配详解

作为HTML5的语义化标签，figcaption专为figure元素设计，能够有效提升内容可访问性和SEO表现。下面详细介绍其正确用法及注意事项。

figcaption 是什么，不是什么

不同于普通标题标签，figcaption是figure元素的专属子元素，用于为图片、图表等独立内容提供语义化说明。常见错误用法包括：将其作为通用标题容器、在单个figure内重复使用、或放置在中间位置。

figcaption 必须和 figure 搭配使用

脱离figure后，figcaption将失去语义价值，辅助技术和搜索引擎可能无法正确识别。合法的结构只有两种：

1. 

2. 

需特别注意：figcaption在figure内只能出现一次，放置在中间位置属于无效结构。

figcaption 对 SEO 和无障碍的实际影响

搜索引擎会将figcaption与关联媒体内容建立明确联系，相比仅依赖alt属性更具优势。对无障碍访问而言：

1. 它能清晰表明"这是图的标题"
2. 缺少时会妨碍视障用户获取完整信息
3. 不能替代alt属性，二者功能互补

容易被忽略的兼容性细节

虽然主流浏览器均支持figcaption，但旧版IE需要ARIA属性补充。样式方面需注意：

figure figcaption {
  font-size: 0.9em;
  line-height: 1.4;
}

合理使用figcaption能显著提升网页内容的结构化和可访问性，是前端开发不可忽视的重要元素。