Fixing my tooltip accessibility mistake
文章记录了一次工具提示（tooltip）无障碍（accessibility）实现错误及修复过程。作者在制作基于popover='hint'的图标按钮提示时，初始使用aria-describedby将按钮与提示相关联，但因提示文字重叠导致屏幕阅读器重复朗读，便错误地移除了按钮的aria-label，使按钮失去可访问名称。在专家反馈后，作者将aria-describedby改为aria-labelledby，直接从提示元素获取可访问名称，解决了朗读重复和语义缺失问题。文中还讨论了分割标签与描述的备选方案，并强调需用多个屏幕阅读器测试以避免单一工具遗漏问题。本文适合需要为SVG图标按钮提供无障碍说明的前端开发者，明确区分了两个ARIA属性的适用场景与边界。
本文通过作者亲身踩坑案例，清晰对比了aria-describedby与aria-labelledby的无障碍语义差异，直接展示了从错误到修复的完整过程与测试依据，对前端开发者编写可访问的图标按钮、工具提示具有直接可迁移的指导价值。尤其适合关注Web无障碍实践与屏幕阅读器兼容性的开发者参考。