title属性在无障碍中作用有限，因屏幕阅读器默认不播报，仅当图标或缩写链接需轻量补充时可用；应优先使用语义化标签、aria-label等可靠方案。
title 属性在无障碍访问中作用有限，不能替代语义化标签或真实文本，盲目依赖它会降低可访问性。
为什么 screen reader 很少读 title
多数主流屏幕阅读器（如 NVDA、VoiceOver、JAWS）默认不播报 title 属性——除非用户手动开启“提示信息朗读”模式（如 NVDA + Insert + V），且该设置通常被关闭。W3C 明确指出：title 是“附加说明”，不是关键语义信息。当 title 与可见文本重复（如 @#@#@#@#@#@#@#@#@#@0），AT 用户实际听到的是冗余内容；若它承载关键操作指引（如“点击后将删除全部数据”），反而因不可靠播报而造成风险。
title 在 a 标签中唯一可靠的作用场景
仅当链接文本本身语义模糊、又无法修改可见文案时，title 可作轻量补充：
- 图标链接：如
@#@#@#@#@#@#@#@#@#@1，此时title是唯一可被部分 AT 识别的替代文本 - 缩写/简写链接：如站内“FAQ”链接，
title="常见问题解答"能提供首次接触用户的上下文 - 注意：必须确保
title内容简洁（≤120 字符）、无标点堆砌、不包含操作指令（如“请勿点击”）
比 title 更可靠的无障碍替代方案
真正提升可访问性的做法，是用标准语义和 ARIA 替代对 title 的依赖：
- 用真实可见文本代替图标链接：把
@#@#@#@#@#@#@#@#@#@2改为@#@#@#@#@#@#@#@#@#@3 - 对纯图标按钮加
aria-label：如<button aria-label="清空搜索框"><svg>...</svg></button>，该属性被所有 AT 默认读取 - 复杂控件用
aria-labelledby或aria-describedby关联外部说明：比如一个带格式提示的密码输入框，把提示文字 ID 写进aria-describedby="pwd-hint" - 避免在
<input>上滥用title：placeholder +title组合既不可靠也不符合 WCAG，应改用<label></label>或aria-label
移动端和触摸设备上的 title 基本失效
iOS 和 Android 系统原生浏览器不支持触摸悬停，因此 title 提示框不会出现；部分安卓 WebView 甚至完全忽略该属性。更严重的是，某些屏幕阅读器（如 TalkBack）在触摸模式下会跳过 title 解析。这意味着：你写的 title 在超过 60% 的真实用户场景中根本不会被感知。
真正容易被忽略的，是开发者常把 title 当作“无障碍补丁”来用——但它从来就不是补丁，而是历史遗留的弱语义残留。优先写清楚的标签、真实的文本、正确的 role 和 aria- 属性，比塞满 title 有效十倍。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
