google-maps - 谷歌地图和可访问性

Question

在嵌入谷歌地图 iframe 时，我有点难以让我的页面可访问。

添加时role="application" aria-label="Location of the listing on a map" tabindex="0"，我收到与 Google 地图图像上缺少 alt 标签相关的错误。

添加aria-hidden="true"有关 iframe 内可交互元素的 Wave 和 Ax 工具投诉。

哪个是最好的解决方案？

标签： google-mapsaccessibility

Answer 1

谷歌地图仍然是一个相当难以访问的产品。谷歌试图在可访问性方面取得一些进展，但总而言之，它仍然不是很好。

一个iframe谷歌地图将更加难以访问。您可以添加titleoraria-label或aria-labelledby属性，但这些内容只能描述框架的目的和意图。访问者仍然很难与嵌入式地图进行交互。我不建议将任何 ARIA 角色添加到 iframe。

通过超链接直接链接到 Google 地图页面提供了更好的体验（但仍然不是很好）。用户将能够比在 iframe 中更好地浏览地图和方向。与显示位置的地图相比，Google 地图上的转弯路线提供了更便捷的体验。

如果您不想，您不必从页面中删除iframe它，因为它对有视力的访问者仍然有价值。但是，您可能需要考虑：

• 添加链接以直接在 Google 地图网站上打开地图
• 提供一个链接，指向来自每条主要高速公路的基于文本的方向的单独页面（如果方向是地图的目标） - 您还可以使用隐藏文本，使有视力的访问者不可见

您还可以选择如何处理iframe自身。您可以：

• 添加aria-hidden到iframe，从而将其从辅助技术用户的流程中删除，但对有视力的用户可见，而不是提供上面介绍的替代解决方案
• 将 留iframe在页面流中（即不对任何人隐藏）添加可访问的名称（使用或），title以便使用辅助技术的访问者可以理解目的，但可能不会与之交互aria-labelaria-labelledbyiframe
• 完全删除iframe并让所有访问者使用谷歌地图网站上的链接

AX 和 WAVE 之类的东西是一个很好的起点，但不要太担心从它们那里获得“完美分数”。目标是使页面对真实的人尽可能有用。