共计 2409 个字符，预计需要花费 7 分钟才能阅读完成。
无障碍 Accessibility
无障碍 WAI 的意思是所有人都应该可能拜访互联网的内容。
无障碍帮忙：
- 视觉和听觉有问题的人
- 认知和神经有问题的人
- 物理和讲话有问题的人
W3C 提出了一系列反对 WAI（Web Accessibility）的资源，这起初成为了 Web 规范。
无障碍通常蕴含以下软件：
- 屏幕阅读器
- 语音辨认设施
- 字幕和文本
WAI 的指标是建设 ARIA（Accessible Rich Internet Application）。
代替图像的文本 Text Alternative
alt 属性中的文原本形容图片内容，作为备用文字。
alt 属性能够帮忙用户在图片加载失败或者不可见的状况下了解图片内容，搜索引擎也通过它来了解图片内容，并将其退出到搜寻后果中。
语义化 Semantic
语义化 的意思是，标签名能精确地表白它所含内容的信息类型。
在应用中，雷同级别（或者更高级别）的题目标签用于开启新的章节，低一级别的题目标签用于开启上一级题目标签的子大节。
应用 main 等构造元素
main 标签用于出现网页的主体内容，且每个页面应只有一个。这是为了围绕与页面核心主题相干的信息，而不应蕴含如导航连贯、网页横幅等须要在多个页面中反复呈现的内容。
article 是一个分段标签，用于出现独立及残缺的内容。这个标签实用于博客、论坛帖子或者新闻文章。
section 元素也是 HTML5 引入的新元素，其语义与 article 略有不同。article 用于独立且残缺的内容，而 section 用于对与主题相干的内容进行分组。它们能够依据须要来嵌套应用。举个例子：如果一本书是一个 article 的话，那么每个章节就是 section。当内容组之间没有分割时，能够应用 div。
header 该当在 HTML 文档的 body 标签内应用。它与蕴含页面题目、元信息的 head 标签不同。它能够为父级标签出现简介信息或者导航链接，实用于那些在多个页面顶部反复呈现的内容。
nav 它能够使屏幕阅读器疾速辨认出页面中的导航信息。它用于出现页面中的主导航链接。
footer 能够让辅助工具疾速定位到它。它位于页面底部，用于出现版权信息或者相干文档链接。
图片音频视频
音频 Audio
audio 标签用于出现音频内容或音频流，音频内容也须要备用文本，供聋哑人或听力艰难的人应用。
audio 标签反对 controls 属性，用于显示浏览器默认播放、进行和其余管制，以及反对键盘性能。这是一个布尔值属性，意味着它不须要一个值，它在标签上存在即开启设置。
<audio id="meowClip" controls>
<source src="audio/meow.mp3" type="audio/mpeg">
<source src="audio/meow.ogg" type="audio/ogg">
</audio>图片 Image
figure 标签以及与之相干的 figcaption 标签。它们一起用于展现可视化信息（如：图片、图表）及其题目。这样通过语义化对内容进行分组并配以用于解释 figure 的文字，能够极大地晋升内容的可拜访性。
<figure>
<img src="roundhouseDestruction.jpeg" alt="Photo of Camper Cat executing a roundhouse kick">
<br>
<figcaption>
Master Camper Cat demonstrates proper form of a roundhouse kick.
</figcaption>
</figure>视频 Video
video 标签用于出现视频内容或视频流，视频内容也须要备用文本，供盲人或视力艰难的人应用。
video 标签反对 controls 属性，用于显示浏览器默认播放、进行和其余管制，以及反对键盘性能。这是一个布尔值属性，意味着它不须要一个值，它在标签上存在即开启设置。
<video id="meowClip" controls>
<source src="video/meow.mp4" type="video/">
<source src="audio/meow.wbev" type="video/">
</video>accesskey 属性在链接之间疾速导航
HTML 提供 accesskey 属性，用于指定激活元素或者使元素取得焦点的快捷键。增加 accesskey 属性能够让应用键盘的用户更高效率地导航。
<a href=""accesskey="g"></a>tabindex 将键盘焦点增加到元素中
HTML 的 tabindex 属性有三种与标签焦点相干的性能。当它在一个元素上时，示意该元素能够取得焦点。tabindex 的值（能够是零、负整数或正整数）定义了行为。当用户应用键盘浏览页面时，诸如链接、表单控件等元素能够主动取得焦点。它们取得焦点的程序与它们呈现在 HTML 文档流中的程序统一。通过将其余标签（如 div、span、p 等）的 tabindex 属性值设为 0 来让它们实现相似的成果。
tabindex 属性值为负整数（通常为 -1）的标签也是能够取得焦点的，只是不能够通过键盘操作（如 tab 键）来取得焦点。这种办法通常用于以编程的形式使内容取得焦点（如：将焦点设置到用 div 实现的弹出框上）的场景。
<p tabindex="0">
something
</p>tabindex 属性还能够指定元素的 tab 键焦点程序，将它的值设置为大于等于 1 的整数，就能够实现这个性能。
给元素设置 tabindex="1"，键盘将首先把焦点放在这个元素上。而后它依照指定的 tabindex 值（2、3 等等）程序循环，再挪动到默认值和 tabindex="0" 我的项目。
须要留神的是，应用这种形式设置 tab 键焦点程序会笼罩默认程序，其中默认程序为标签在文档流中呈现的程序。这可能会让那些心愿从页面顶部开始导航的用户感到困惑。应用 tabindex 在某些状况下是必要的，但在应用时要充分考虑到页面的可拜访性。
