When to use describedby:

For example you have a close button:

<button aria-describedby="closeReadable">X</button>
<p>Some kind of content</p>
<p id="closeReadable" class="visuallyHidden">Close this window</p>

When to use labelledby:

For example you have Billing section, inside you have address field. Just memtion address to the user, they won't understand, it is better to say "Billing address":

<h4 id="bukkubg_header">Billing </h4>

<label for ="form_address" id ="form_address">
<input type="text" name="form_address" aria-labelledby="billing_header form_address" />
</label>

[ARIA] aria-describedby & aria-labelledby的更多相关文章

  1. web语义化之SEO和ARIA

    在快速理解web语义化的时候,只知道web语义化有利于SEO和便于屏幕阅读器阅读,但并不知道它是如何有利于SEO和便于阅读器阅读的,带着这个疑问,进行了一番探索总结. SEO 什么是SEO? SEO( ...

  2. [翻译]如何在HTML5中有效使用ARIA

    ARIA是Accessible Rich Internet Application的简称,指无障碍富互联网应用.可以使一些有功能障碍(如听力,视力)的人群,使用你的网站.下面看一下做为开发人员的我们, ...

  3. WebComponent魔法堂:深究Custom Element 之 标准构建

    前言  通过<WebComponent魔法堂:深究Custom Element 之 面向痛点编程>,我们明白到其实Custom Element并不是什么新东西,我们甚至可以在IE5.5上定 ...

  4. datatables中的Options总结(2)

    datatables中的Options总结(2) 五.datatable,列 columnDefs.targets 分配一个或多个列的列定义. columnDefs 设置列定义初始化属性. colum ...

  5. 无障碍网页设计(WCAG2.0)

    无障碍化是指无论健全人还是残疾人,年轻人还是老年人都可以平等地获取互联网上的信息和服务.无障碍化网站建设不单可以增加网站的受益群体,更是一个有情怀.有担当的互联网企业的责任,也是一个互联网从业人员应该 ...

  6. 【jQuery UI 1.8 The User Interface Library for jQuery】.学习笔记.5.Accordion控件

    accordion是另一个UI控件,能允许你将一组content加入相互分隔的.能够被浏览者的交互打开或关闭的panels中.因此,它大多数的content在初始化的时候是隐藏的,很像tabs控件.每 ...

  7. (转)TCP注册端口号大全

    分类: 网络与安全 cisco-sccp 2000/tcp Cisco SCCPcisco-sccp 2000/udp Cisco SCCp# Dan Wing <dwing&cisco ...

  8. 使用 HTML5 设计辅助功能

    使用 HTML5 设计辅助功能 Rajesh Lal 下载代码示例 如果您真的对面向广大受众感兴趣,将需要为网站设计辅助功能. 辅助功能使网页更易于访问.更易于使用,可供每个人浏览. 通常,使用最新的 ...

  9. 雅虎UED--无障碍网页设计

    转自:http://www.sharetk.com/html/ued/Interactive-Design/1394.html 随着web使用量的增加和人们网络意识的增强,一些特殊用户开始被我们所关注 ...

  10. 如何通过fpmmm和zabbix来监控客户机上MariaDB数据库运行情况

    首先在客户机安装MariaDB和zabbix,参考上一篇 安装fpmmm的过程主要参考[1]. 安装fpmmm的依赖 shell> yum install php-cli php-process ...

随机推荐

  1. 什么是PHP?

    PHP起源于1995年,由Rasmus Lerdorf开发.到现在,PHP已经历了21年的时间洗涤,成为全球最受欢迎的脚本开发语言之一.由于PHP 5是一种面向对象.完全跨平台的新型Web开发语言.所 ...

  2. 单选 textarea 赋初值

    自闭合标签赋初值用$().val(),比如:<input type="text" name="text" value="123"> ...

  3. C语言 小球撞击反弹

    计算法(略) #include <stdio.h> #include <stdlib.h> int main() { int x, y, a, resu; scanf(&quo ...

  4. 对于Node中Express框架的中间件概念的感知

    中间件是什么呢? 中间件就是客户端http请求发起传送到服务器和服务器返回响应之间的一些处理函数. 为什么要使用中间件? 通过中间件,可以对数据进行操作使得我们能方便地操作请求数据编写服务器响应.如b ...

  5. hystrix中request cache请求缓存

    有一个概念,叫做reqeust context,请求上下文,一般来说,在一个web应用中, 我们会在一个filter里面,对每一个请求都施加一个请求上下文,就是说,tomcat容器内,每一次请求,就是 ...

  6. Navicat 导出 表结构

    Navicat 导出 表结构 转自:https://www.cnblogs.com/xianxiaobo/p/10254737.html 1. 首先点击新建查询,然后输入下面的语句 SELECT CO ...

  7. Stack布局中定位的方式

    //……省略无关代码…… child: new Column( children: <Widget>[ new SizedBox(height: 20.0), new Stack( ali ...

  8. Web漏洞扫描

    SkipFish skipfish语法格式,其他参数使用skipfish -h查看文档 skipfish -o skfish http://url/ -C 指定Cookie 最终会在~/root下面生 ...

  9. GoogleMap增加标记和路线轨迹的方法

    声明:本文基于JavaScript环境编写. 前言 按照目前的项目需求,我们需要在谷歌地图上标记出当前仓库的位置.司机补货的行车路径.司机当前班次需要补货的机器的位置,同时根据补货状态的不同标记成不同 ...

  10. 【故障处理】ORA-12162 错误的处理

    [故障处理]ORA-12162: TNS:net service name is incorrectly specified 一.1  场景 今天拿到一个新的环境,可是执行sqlplus / as s ...