您是否只需要一个图标按钮而不会搞砸可访问性？

首先，认真思考：你真的需要纯图标按钮吗？如果可以的话，在图标旁边添加文字已被反复证明是最易访问、最清晰的用户体验（参见苹果最新的失误）。但如果你确实需要（我理解，有时你确实需要），Sara Soueidan 和 Scott O’Hara 各写了一篇文章，很好地阐述了所有选项，并提供了关于此主题的实际研究。

• Sara Soueidan: 无障碍图标按钮
• Scott O’Hara: 上下文标记无障碍图像和 SVG

如果你只想得到直接的答案，我建议你采用“在按钮中使用一些文字”的方法：

<button>
   <svg aria-hidden="true" focusable="false" height="32px" viewbox="0 0 32 32" width="32px"></svg>
   菜单
</button>

Sara 指出没有放之四海而皆准的方法，但似乎你确实需要在按钮内使用实际文本，并以某种方式隐藏或覆盖它。仅使用 SVG 并没有可靠的方法为按钮或链接提供无障碍名称。

这种模式难以正确实现，真是令人惊讶。

以上是您是否只需要一个图标按钮而不会搞砸可访问性？的详细内容。更多信息请关注PHP中文网其他相关文章！