屏幕阅读器不会显示 SplitText

SplitText 页面的 "屏幕阅读器可访问性" 部分声称支持屏幕阅读器，但遗漏了一些重要的注意事项。 具体来说，"内置 Aria*" 部分提到了使用 aria-label，并将其应用于示例代码中的 <h2>。 然而，SplitText 动画演示 使用的是 <div>。 似乎合理的用户不会总是将 SplitText 应用于标题，并且可能会使用演示中的代码。 因此，以下是挑战： * 演示使用了一个 <div>, 这在 HTML AAM 中映射到通用角色。 * 通用角色不允许作者为其命名(参见 w3c.GitHub.io/aria/#namefromprohibited ) - 这意味着 aria-label 在它上是禁止的(参见 w3c.GitHub.io/aria/#aria-label)。 * 演示使用了标题，允许使用 aria-label , 但没有任何解释。 * 此外，aria-label 可能不会自动翻译给用户(参见 adrianroselli.com/2019/11/aria-label-does-not-translate.html)。 * 页面还没有提到 WCAG SC 2.5.3 标签在名称中 当 aria-label 应用于任何控件(例如按钮) 时的风险(尽管它确实解决了链接通过重复文本的问题)。 我建议的修改： * 确定哪些 HTML 元素/ARIA 角色支持 aria-label。 * 反对使用不支持的元素。 * 提醒用户注意自动翻译的风险。 * 提醒用户不要在任何交互控件上使用 aria-label。 我还对链接的演示进行了屏幕阅读器测试：