开发支持屏幕读取软件的 Web 2.0 应用

核心提示： 例如下图中的表格，我们通过以下四步使得屏幕读取软件能很好的识别其中的信息，开发支持屏幕读取软件的 Web 2.0 应用(7)，图 5. Web 应用中的表格通过 <th> 标记指示行 / 列表头：创建易于访问的数据表格的第一步就是指明行 / 列表头，开发人员可以通过定义 <th

例如下图中的表格，我们通过以下四步使得屏幕读取软件能很好的识别其中的信息。

图 5. Web 应用中的表格

通过 <th> 标记指示行 / 列表头：创建易于访问的数据表格的第一步就是指明行 / 列表头。开发人员可以通过定义 <th> 标记明确的指示行 / 列表头。

将数据单元与适当的表头关联起来：有两种方式将数据单元和其相应的表头关联起来：

scope 属性 : scope 属性作用于标头元素中，值为 row 或者 col，分别表示该元素是行头或者列头。

headers 和 id 属性 : id 属性作用于表头元素，headers 属性作用于数据单元，与其相应的标头元素的 id 对应。它们的作用与 scope 相同，用以区分表头和数据。值得注意的是，这两个属性使用起来比较复杂，因此通常用于复杂表格，即表格中的一个数据单元与两个以上的表头相关联。

设置 table 元素的 summary 属性：summary 为用户提供表格的描述信息，屏幕读取软件可以读出 summary，同时 summary 的值是不可见的，因此不会对页面产生影响。例如，上图表格中列出当前所需的 Requirements，视力正常的用户可以通过阅读左上方的标题和表格上方的说明来了解表格的作用。而屏幕读取软件则可以根据 summary 属性，帮助用户直接了解表格中所含信息的结构或目的。

避免使用多于二层行 / 列表头的表格：一些屏幕读取软件不能识别多层行 /列表头的表格，因此 Web应用的开发人员要尽量使用简单的，一维或者二维表格 。