没有可访问名称的“section”不过是一个div (#tilPost)

没有可访问名称的“section”不过是一个div (#tilPost)

💡 原文英文,约1000词,阅读约需4分钟。
📝

内容提要

<section>元素用于表示文档中的独立部分,通常应有标题。它在辅助技术中作为导航标记,需配有aria-label或aria-labelledby以确保可访问性。没有这些属性时,<section>仅为普通容器,无法提供导航优势。

🎯

关键要点

  • <section>元素用于表示文档中的独立部分,通常应有标题。
  • 在辅助技术中,<section>需配有aria-label或aria-labelledby以确保可访问性。
  • 没有这些属性时,<section>仅为普通容器,无法提供导航优势。
  • 使用<section>元素时,需考虑其可访问性名称的重要性。
  • aria-label的翻译问题使得通常推荐使用aria-labelledby。
  • 浏览器解析HTML时,会创建DOM树和可访问性树,后者用于辅助技术。
  • <section>元素映射到region角色,是地标角色的一部分。
  • 地标角色定义地标区域,帮助辅助技术导航HTML文档。
  • <section>只有在具有可访问性名称时才会被视为地标。
  • 如果没有aria-label或aria-labelledby,<section>将变为普通容器,无法通过地标导航访问。
  • 如果要暴露网站的重要区域,需确保使用合适的地标元素或提供可访问性名称。

延伸问答

<section>元素的主要功能是什么?

<section>元素用于表示文档中的独立部分,通常应有标题。

为什么要为<section>元素添加aria-label或aria-labelledby?

添加aria-label或aria-labelledby可以确保<section>元素具有可访问性名称,从而使其在辅助技术中可被识别为地标。

如果<section>元素没有可访问性名称,会发生什么?

如果没有可访问性名称,<section>元素将变为普通容器,无法通过地标导航访问。

如何确保<section>元素在辅助技术中被正确识别?

确保为<section>元素提供aria-label或aria-labelledby,以便它能被识别为地标。

<section>元素与其他HTML元素的地标角色有什么区别?

<section>元素被映射到region角色,只有在具有可访问性名称时才会被视为地标,而其他元素如<header>和<nav>在默认情况下就是地标。

使用<section>元素时需要注意哪些可访问性问题?

使用<section>元素时需注意提供可访问性名称,并考虑aria-label的翻译问题,通常推荐使用aria-labelledby。

➡️

继续阅读