html - 如何修复此 WCAG 错误 "This form control has a blank label or title."

标签 html css accessibility wcag

我在我正在工作的网站上运行 Sortsite 以符合 ADA 要求,我收到此消息:

此表单控件有一个空白标签或标题。 向表单控件的标签添加描述性文本。

我已经尝试添加带有一些信息的标签元素,但由于我们不想显示它,所以将其隐藏。

<label style="display: none;" for="slide1">First slide</label>
<input checked type="radio" name="slider" id="slide1" title="First set of slides" />

最佳答案

屏幕阅读器和其他辅助设备不使用 DOM,而是构建和 accessibility tree基于它。看不见的元素不会放在那里。

如果您不想让您的标签可见,请使用 aria-label :

<div class="_po-r">
  <div class="_bl-zi-0a _w-01 _bl-bg-0l " id="slides">
    <input checked type="radio" name="slider" id="slide1" class="set" title="First set of slides" aria-label="First slide" />

关于html - 如何修复此 WCAG 错误 "This form control has a blank label or title.",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58623279/

相关文章:

css - 真假 : We should always use proper capitalization and never put whole sentences in all-uppercase

Android TalkBack 仅循环显示浏览器中的屏幕内容

javascript - 使用 jquery 将外部 css 样式表应用于动态添加的 html 内容

html - 是否可以组成 HTML 标签?

javascript - 到达 div(或图像)时开始 CSS 转换

html - 所有现代浏览器的样式浏览器验证

javascript - Wordpress 中的 Javascript 问题

javascript - 为什么内置的confirm()对话框很少被使用?

javascript - 单击链接转到包含嵌入内容的页面时,嵌入不显示

javascript - jQuery 如何从下拉菜单中更改 href 属性?