相关文章：
- 网页内容无障碍指引1.0
- 在 30 天內打造更具親和力的網站
- 腾讯网无障碍说明
- 如何开发无障碍的 Web 网页应用详细手册教程指南
- 开发和测试访问无障碍的 Web 应用
- WAI-ARIA 无障碍Web规范
- 使用 JAWS 测试 Web 应用的技巧
关于 Image
- 图片或者动画均需提供 alt 信息，使得读屏软件可以将图片动画的内容清楚的读出来。
- 对于某些用于装饰性的图片，则需设置 alt 为空，使得读屏软件可以忽略此元素。
- 对于图表文件，alt 属性的设置则需要简明扼要的表达出图表的信息，并不用把里面的细节都详细得描述出来。
- 对于图表文件，alt 属性的设置则需要简明扼要的表达出图表的信息，并不用把里面的细节都详细得描述出来。
<img src="cat.gif" alt="Image about cat" />
<img src="ring.gif" alt="" />
<a href="http://apple.com/iphone/">
<img src="iphone.jpg" alt="">Apple iPhone
</a>
CSS 将样式跟结构分离
很多装饰性的图片也都放在 CSS 里面来加载，带来的一个问题就是在 CSS 里面的图片在高对比度模式下都无法显示。如果这个图片并不仅仅是装饰性的，还可以触发功能，那就需要从 CSS 里面拿出来，当成一个独立的 img 或者 input元素。
<div class=” save_button” ></div>
.save_button{
background: url("images/save_button.png");
width: 33px;
height: 33px;
vertical-align:middle;
}
这样当用户切换到高对比度模式，这个图片就是一片空白，用户无法再去点击保存。
//推荐使用
<img src="images/save_button.png" alt="save"/>
<input type="image" src="images/save_button.png" alt="save"/>
关于 Table
- 布局用 table，读屏软件没必要知道这是一个表，可以通过设置 role=presentation 使 JAWS 忽略这个表，只关注里面的内容。
- 数据用 table，则需要设置 caption 属性，说明整个表是用来做什么的，使得 JAWS 可以告诉用户这个表的作用。对于每一个单元内的数据，还应该通过 th 属性使得 JAWS 能识别这个数据的表头是什么。对于复杂表，可以通过 id 和 header 属性来标识。
