alt是强制可访问性属性，用于src失效时替代图像并传递语义；必须非空且具上下文，装饰图应alt=""；title对img无效，不应替代alt；alt语义完整性优先于长度。
alt 是强制可访问性属性，不是“提示文字”
alt 不是鼠标悬停时弹出的 tooltip，也不是图片的“补充说明”。它的唯一作用是：当 src 失效（路径错、网络断、图片被禁用、屏幕阅读器环境）时，替代图像本身占据视觉位置，并向辅助技术传递语义。W3C WCAG 明确要求 img 必须有 alt，缺失即无障碍违规。
常见错误包括：
- 写成
alt="logo"—— 缺少上下文，应写alt="公司官方Logo，蓝色圆形设计" - 装饰图用了
alt="decorative"或alt=" "（带空格）—— 正确写法是alt="" - 在邮件模板或 CMS 导出 HTML 时自动删掉
alt—— 导致大量图片无替代文本
搜索引擎解析图片内容几乎全靠 alt 文本，但堆砌关键词（如 alt="red shoes buy cheap shoes online shoes"）会被判定为 spam，反而降权。
title 在 img 上基本没用，别把它当 alt 的备选
title 是通用提示属性，可用在几乎所有 HTML 元素上，但它对 img 的实际价值极低：
- 现代浏览器中，
title表现为鼠标悬停 tooltip，但 Safari 可能完全不显示，Firefox 截断超 60 字符，移动端基本不可触发 - 主流屏幕阅读器默认不朗读
title（除非用户手动开启“读取 title”选项），对视障用户无效 - 旧版 IE（≤7）曾错误地把
title当作alt渲染，这个历史 bug 已清零，别再沿用
如果真需要提供额外信息（如拍摄时间、版权方、版本说明），优先用 <figure><figcaption> 组合，而不是依赖不可靠的 title。
同时写 alt 和 title 时，必须避免重复或冲突
很多人复制同一段文字到两个属性：alt="支付宝付款码" + title="支付宝付款码"。这会导致：
- 屏幕阅读器重复朗读两次，干扰用户
- 部分浏览器 tooltip 中暴露冗余信息
- 浪费 HTML 字节数，无实际收益
正确做法是：
- 确保
alt自身已完整描述图像功能或内容（例如alt="2026年新版支付宝付款码界面，支持扫码后自动填充金额"） -
title仅补充真正额外、非必要但有时有用的信息（如title="上线日期：2026-06-15；适配 Android 14 & iOS 18"） - 如果
alt已足够清晰，title完全可以省略 —— 不写比乱写更安全
包裹在 <a> 里的 img，title 会被忽略
当 img 被 <a href="..."> 包裹时，链接本身的 title 属性会被浏览器忽略，最终生效的是 img 的 title。而 alt 始终由 img 自己负责，不受父元素影响。
这意味着：
- 不要指望给
<a>加title来提示图片链接目标 —— 应该靠alt描述图像+链接意图（例如alt="前往用户中心设置页面"） - 如果链接需额外说明，应使用
<figure>或旁白文字，而非依赖title
最常被忽略的一点是：alt 的语义完整性永远优先于长度控制。宁可写一句准确的话，也不要为了“简短”牺牲可理解性 —— 屏幕阅读器用户听不懂缩写和模糊词，搜索引擎也抓不到真实意图。
