(翻译)复选框需要绑定标签的原因

  设计人员思考表单设计方式时,他们通常只想到文本字段和提交按钮,由于复选框用得不多,它们经常被忽视,是忽视复选框会影响用户填写表单。设计人员应更加注意复选框的使用方式,很多复选框都很难点击,这违反了可达性原则。

可点击的复选框标签

  所有复选框都有标签,但不是每个复选框都使用标签。这使得用户很难勾选复选框。 没有标签,用户无法单击标签来勾选复选框,相反,他们必须单击复选框本身。 由于复选框目标很小,这让用户,尤其是有运动障碍的用户,点击起来很费力。
(翻译)复选框需要绑定标签的原因
  当复选框绑定标签后,用户点击标签就能勾选复选框。标签的目标较大,用户点击起来不费力,能快速完成勾选操作。复选框绑定标签的做法也更直观,用户期望点击元素标签就能**元素,他们使用菜单和按钮时就是这么做的。
(翻译)复选框需要绑定标签的原因

屏幕阅读器可达性

  屏幕阅读器中无法使用未绑定标签的复选框,它无法根据位置识别标签和复选框的关联关系,这使得屏幕阅读器将标签和复选框分开读给用户听。
  用户很难弄清楚标签和复选框的关联关系。但如果复选框绑定了标签,屏幕阅读器就能正确的读出每个复选框关联的标签。
  标签像是所有表单元素的锚点,它不仅适用于复选框,还可用于所有具有标签的表单元素,用户点击标签就可以**表单元素。
  当要做的只是增加一小段代码时,提高用户体验也费不了多少事儿。让复选框标签具备可点击性,不仅给有运动障碍的用户带来奇迹,对网站的所有用户都有好处。

原文地址:https://uxmovement.com/forms/why-your-checkboxes-need-to-have-label-tags/