应根据内容意图选择语义化标签：辅助性提示用<aside>，独立主题模块用<section>，紧急警告用role="alert"的<div>，内联提示可用加aria-live，系统错误宜用<dialog>加role="alertdialog"。
警告和提示信息没有专用语义化标签，应根据内容意图选择 <aside>、<section> 或带 role="alert" 的 <div>，而非硬套 <figure> 或 <blockquote>。
什么时候该用 <aside>
当提示是辅助性、非核心但与当前上下文相关的信息时，比如表单旁的「密码需含大小写字母」说明、文章侧边的「注意：此方案仅适用于 v5.2+」警告。<aside> 语义上表示“与主内容有关联但可独立存在”的补充信息，屏幕阅读器会识别为旁白内容，且不影响主内容流。
- 必须不打断主阅读顺序；若放在
<main>内部，不能包裹关键操作步骤 - 避免嵌套在
<header>或<footer>中——它们已有明确结构职责 - 配合
<h3>标题（如<h3>注意事项</h3>）能强化语义层级，否则易被读屏器忽略
为什么 <section> 有时更合适
当警告/提示构成一个有明确主题、可被独立引用或跳转的逻辑单元时，例如「兼容性说明」小节、「安全提醒」模块，<section> 比 <aside> 更准确。它强调“这是文档中一个自包含的主题块”，且自带隐式 sectioning root，影响后续 <h1>–<h6> 的层级解析。
- 必须配标题（
<h2>或更高级别），否则语义失效，等价于<div> - 不要用于纯视觉分组：轮播图下方的「点击查看详情」弹层不是
<section>，只是交互反馈 - 搜索引擎不因
<section>提升权重，但结构清晰有助于内容抽取（如新闻摘要抓取）
role="alert" 是最直接的可访问性方案
对需要实时播报、中断用户操作的紧急警告（如「网络连接已断开，请检查设置」），<div role="alert"> 是 WAI-ARIA 推荐做法。它绕过语义标签限制，强制屏幕阅读器以高优先级、中断方式朗读，且无需标题。
立即学习“前端免费学习笔记（深入）”；
- 仅用于真正需要即时感知的场景；滥用会导致用户疲劳甚至屏蔽提示
- 必须动态插入 DOM（不能初始隐藏后
display: block显示），否则部分读屏器不触发 - 避免同时用
role="alert"和<aside>——角色冲突，辅助技术行为不可预测
最容易被忽略的是：**警告是否真的需要结构语义？** 大量表单内联提示（如输入框下方红色文字）用 <small> + aria-live="polite" 更轻量；而模态框中的系统级错误，用 <dialog> + role="alertdialog" 才完整。语义标签不是装饰，是告诉机器“这段话为什么重要”。
