alt 与 aria 属性
alt 的使用规则分三种情况：信息性图片（图表、照片）写描述其内容的文字；功能性图片（图标按钮）描述其动作（"搜索"）；装饰性图片写空字符串 alt=""，让屏幕阅读器直接跳过。绝不省略 alt 属性——省略和留空是两回事。
当纯 HTML 表达不了控件含义时，用 WAI-ARIA 补充：aria-label 给没有文字的元素命名（如只有图标的按钮）；aria-labelledby 指向作为标签的元素 id；aria-hidden="true" 让纯装饰内容对读屏器隐身；role 声明元素扮演的角色。
一条重要原则：能用原生标签解决就不要用 ARIA——原生 button 自带键盘支持和读屏语义，div 加 role="button" 反而要自己补齐一堆行为。ARIA 是补充，不是替代。
本节要点信息图写内容、功能图写动作、装饰图 alt=""；aria-label 给无文字元素命名、aria-hidden 隐藏装饰；优先原生标签，ARIA 只做补充。
HTML
<!-- 只有图标的按钮：用 aria-label 命名 --> <button aria-label="关闭对话框">✕</button> <!-- 装饰性分隔图：alt 留空，读屏器跳过 --> <img src="wave.png" alt=""> <!-- aria-hidden：对读屏器隐藏纯装饰字符 --> <span aria-hidden="true">★</span> 4.9 分 <!-- 原生 button 自带语义与键盘支持，优先于 div+role --> <button>提交</button> <!-- 不推荐：<div role="button">，还需自己实现回车/空格触发 -->
