alt=""是主动声明图片无语义，屏幕阅读器静音跳过；缺失alt则被读屏误读文件名或报“图像”，造成语义污染，且w3c等工具将其视为硬性错误。
alt="" 会让屏幕阅读器静音跳过，不是“没声音”而是“明确忽略”
空字符串 alt="" 是一种主动声明：这张图不承载语义信息，辅助技术应完全跳过，不打断朗读流。NVDA、VoiceOver、JAWS 等主流读屏工具都按此逻辑处理——既不报“图像”，也不读文件名，就像 DOM 中根本不存在这个 <img> 节点一样。
这和“加载失败时显示断裂图标但无文字”是两回事：alt="" 解决的是语义缺失问题，不是视觉降级问题。
不写 alt 属性反而更危险：读屏器可能读出 src 文件名
省略 alt 属性 ≠ 图片不重要，而是等于没告诉读屏器“该怎么处理”。结果因工具而异：
- NVDA（最新版）可能直接报“图像”，不带上下文
- VoiceOver 在 Safari 中常读
src值，比如"cart-icon-2026.png"→ 用户听到“购物车图标二零二六点png”，完全无法理解 - JAWS 旧版本甚至会拼读路径，如
"slash assets slash icons slash home-dot.png"
这些都不是“安静”，而是**错误语义污染**——打断用户注意力，且无法修正。
构建工具和验证器对 alt="" 和缺失 alt 的报错逻辑完全不同
W3C 验证器、eslint-plugin-jsx-a11y、Lighthouse 都把缺失 alt 当作硬性错误拦截，但对 alt="" 完全放行。原因很直接：HTML5 规范明确定义 alt 是 required 属性，alt="" 是合法取值，而缺失就是语法违规。
常见触发报错的写法包括：
-
<img src="line.png">→ 报错Element img is missing required attribute alt -
<img src="line.png" alt=" ">（含空格）→ 报错Attribute value should not be only whitespace - CMS 后台填了标题字段，但模板没渲染进
alt→ 实际仍是缺失，等同于第一种
alt="" 不等于“随便用”，必须满足纯装饰性前提
能否用 alt="" 不看图长得像不像装饰，而看它被删掉后是否影响信息完整性与功能可用性：
- ✅ 可用：
<img src="dot.png" alt="">作为列表项前缀，语义由<ul></ul>和 CSSlist-style承担 - ✅ 可用：
<img src="deco-border.png" alt="">仅用于老浏览器兜底的分割线，CSS 已实现同等效果 - ❌ 禁用：
<img src="search-icon.png" alt="">—— 这是按钮，点击有行为，必须写alt="搜索"或alt="展开筛选条件" - ❌ 禁用：
<img src="error-banner.png" alt="">—— 图中含文字“支付失败，请重试”，必须复述全部关键文本
最隐蔽的坑是：很多人把 title 当成 alt 的替补，但 title 对屏幕阅读器默认不读，搜索引擎也不解析，写了等于没写。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
