【问题标题】:(Custom) WAI-ARIA role(自定义)WAI-ARIA 角色
【发布时间】:2011-01-19 21:23:56
【问题描述】:

我对 ARIA 及其提供的角色、状态和属性非常陌生。我知道有不同类型的角色(例如地标、区域等),但它们都不代表“登录区域”或类似的区域。我想知道是否有办法指定这些信息的分组,以便屏幕阅读器可以为用户读出这些信息?例如。 "登录区域。用户名...密码..."

如果使用 ARIA 无法做到这一点,那么在 HTML 中的一般做法是什么?

提前致谢

【问题讨论】:

    标签: accessibility screen-readers wai-aria


    【解决方案1】:

    WAI-ARIA 通常适用于动态内容,例如新闻标题行情,而不适用于静态内容,例如登录表单。静态内容最好使用纯 HTML 来实现。

    假设您有一个始终显示登录表单的页面,以下内容应该会有所帮助。

    对于登录表单,从可访问性的角度来看,您应该主要确保正确标记表单字段。 fieldset\legend 对于小表单来说确实是可选的。

    正确编码标签意味着使用匹配的 for\id 属性,例如

    <label for="loginName">Login name</label>
    <input type="text" id="loginName" name="loginName" size="30" />
    <label for="loginPassword">Login password</label>
    <input type="password" id="loginPassword" name="loginPassword" size="10" />
    

    这确保屏幕阅读器(盲人)用户可以正确听到表单字段对应的标签读出。对于其他表单元素,例如复选框和单选按钮,使用这样的正确标签允许有灵活性问题的用户单击文本标签来切换表单输入(复选框\单选按钮),这意味着他们可以点击更大的目标区域页面。

    要让用户知道他们即将访问登录表单,您可以使用标题或 fieldset\legendf 组合,例如

    <h2>Login form</h2>
    <FORM HERE>
    

    或者

    <fieldset>
    <legend>Login form</legend>
    <FORM HERE>
    </fieldset>
    

    这两种方法都可以,尽管标题方法会稍微减少屏幕阅读器用户的音频混乱(使用字段集\图例,在每个表单字段之前读出图例)

    【讨论】:

    • 感谢 discojoe,fieldset 和 legend 会做到的。我只是想知道是否有办法用 ARIA 做到这一点。再次感谢..
    • 是否在标签上使用'for'属性比将其包裹在字段周围更容易访问,即将标签关闭标签放在它所属的字段之后?
    【解决方案2】:

    是和不是。形式应该被赋予“形式”的标志性作用。这允许辅助技术查看地标以进行导航。

    请参阅spec

    虽然使用地标有助于浏览页面,但地标本身不会产生表单本身的项目的阅读。遵循所提到的已知 HTML 实践将处理其余部分。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2012-04-07
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多