HTML 可访问性
HTML 可访问性
编写 HTML 代码时，请始终考虑可访问性！
为用户提供良好的方式来导航和与您的网站交互。使您的 HTML 代码尽可能具有语义性。
语义化 HTML
语义化 HTML 意味着尽可能使用正确的 HTML 元素来实现其正确的目的。语义化元素是具有意义的元素；如果您需要一个按钮，请使用 <button> 元素（而不是 <div> 元素）。
语义化 HTML 为屏幕阅读器提供上下文，屏幕阅读器会朗读页面的内容。
以按钮为例
- 按钮默认具有更合适的样式
- 屏幕阅读器将其识别为按钮
- 可聚焦
- 可点击
按钮对于仅依赖键盘导航的用户也是可访问的；它可以通过鼠标和按键点击，并且可以通过 Tab 键（使用键盘上的 Tab 键）在不同元素之间切换。
非语义化元素的例子：<div> 和 <span> - 没有说明其内容。
语义化元素的例子：<form>、<table> 和 <article> - 清楚地定义了其内容。
标题很重要
标题由 <h1> 到 <h6> 标签定义
搜索引擎使用标题来索引网页的结构和内容。
用户通过标题浏览页面。使用标题来显示文档结构和不同部分之间的关系非常重要。
屏幕阅读器也使用标题作为导航工具。不同类型的标题指定了页面的轮廓。<h1> 标题应用于主标题，其次是 <h2> 标题，然后是次要的 <h3>，依此类推。
注意：仅将 HTML 标题用于标题。不要使用标题来使文本大或粗体。
替代文本
alt 属性为图像提供替代文本，如果用户由于某种原因无法查看图像（因为连接缓慢、 src 属性中的错误或用户使用屏幕阅读器）。
alt 属性的值应描述图像
如果浏览器找不到图像，它将显示 alt 属性的值
声明语言
您应该始终在 <html> 标签内包含 lang 属性，以声明网页的语言。这旨在帮助搜索引擎和浏览器。
以下示例指定英语为语言
<!DOCTYPE html>
<html lang="en">
<body>
...
</body>
</html>
使用清晰的语言
始终使用清晰易懂的语言。还要尽量避免屏幕阅读器无法清晰阅读的字符。例如
- 尽量缩短句子
- 避免使用破折号。不要写 1-3，而是写 1 到 3
- 避免使用缩写。不要写 Feb，而是写 February
- 避免使用俚语
创建良好的链接文本
链接文本应清楚地解释读者点击该链接后将获得哪些信息。
良好和不良链接的示例
注意：本页面是网络可访问性的入门介绍。请访问我们的可访问性教程以获取更多详细信息。
