最稳妥做法是使用 已关闭讨论2024年6月15日，语义清晰、屏幕阅读器友好且利于SEO。
如何用 HTML 显示“已关闭讨论”状态提示
直接加一个语义清晰、可读性强且不影响 SEO 的提示即可，不需要 JS 或复杂结构。<aside></aside> 或 <section></section> 配合 aria-live="polite" 是最稳妥的做法，尤其对屏幕阅读器友好。
- 避免用
<div> 纯靠 CSS 写“已关闭讨论”，它既无语义，也不被辅助技术识别<li>不要把提示塞进 <code><title></title>或 meta 里——用户看不到，爬虫也难提取上下文 - 如果页面是动态加载的（如 SPA），需在 DOM 插入后手动触发
aria-live区域更新，否则部分读屏器可能不播报 -
<div role="status" aria-label="该话题已关闭讨论，不再接受新回复"></div>—— 静默播报，适合后台状态变更 - 若需强调显示，改用
<span role="alert">已关闭讨论</span>，多数读屏器会中断当前朗读并高优播报 - 切勿给
role="alert"加 CSSdisplay: none或visibility: hidden，否则语义失效 - 推荐结构：
<aside aria-label="该话题已于2024年6月15日关闭讨论"><p>已关闭讨论（2024-06-15）</p><div class="aritcle_card flexRow"> <div class="artcardd flexRow"> <a class="aritcle_card_img" href="/xiazai/skill10595" title="htmlppt.skill"><img src="https://img.php.cn/upload/skill/001/246/273/6adaf20d79f23518.jpg" alt="htmlppt.skill" ></a> <div class="aritcle_card_info flexColumn"> <a href="/xiazai/skill10595" title="htmlppt.skill">htmlppt.skill</a> <p>把任意文章或文档内容转换成精美的全屏翻页 HTML 演示文件（幻灯片风格）。当用户发来一篇文章、文档链接、Markdown 内容、或粘贴的文本，并且希望生成演示用的 HTML 时触发。支持任意内容来源：iWiki 链接、KM 链接、本地文件路径、直接粘贴的文本。生成的 HTML 文件保存到本地工作区，并通过企微直接发送给用户。触发词示例：帮我把这篇文章做成PPT、转成演示文档、生成HTML幻灯片、做个演示、转成可以演示的格式、article to deck、make a slide。</p> </div> <a href="/xiazai/skill10595" title="htmlppt.skill" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a> </div> </div> <p><span>立即学习</span>“<a href="https://pan.quark.cn/s/cb6835dc7db1" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">前端免费学习笔记（深入）</a>”；</p></aside> - 时间格式统一用
<time datetime="2024-06-15">2024年6月15日</time>，便于机器解析 - 别把日期单独丢在页脚或 data-* 属性里——不可见、不可聚焦、不可被读屏器关联到状态本身
- SSR 场景：在模板中根据
is_archived字段条件渲染<aside></aside>块，最稳 - CSR 场景：确保 JS 初始化后立即检查并插入提示，并监听可能触发重开/再关闭的 API 响应，及时更新
aria-label和 DOM 文本 - 缓存陷阱：CDN 或浏览器缓存可能返回旧版 HTML（未含归档提示），需在响应头加
Cache-Control: no-cache, max-age=0或带版本哈希的 URL
用 aria-label 和 role="status" 让关闭状态可访问
单纯视觉提示不够。比如用户用键盘 Tab 进入归档区，或靠语音命令跳转时，得明确知道“这话题已冻结”。role="status" 搭配 aria-label 是 WAI-ARIA 推荐方案。
归档状态要不要加时间戳？加在哪？
加。用户需要知道“什么时候关的”，尤其是涉及法律存档、争议追溯或内容时效性判断时。时间信息必须和状态提示在同一个语义容器内，否则逻辑断裂。
服务端渲染 vs 前端 JS 注入的归档提示差异
服务端直出的提示更可靠。JS 动态插入容易失败（网络中断、执行顺序错乱、CSP 限制），导致部分用户永远看不到“已关闭”标识。
归档状态不是装饰，是内容生命周期的关键节点。最容易被忽略的是：状态变更后没同步更新 aria-label 值，或者把提示放在 DOM 树深处导致焦点管理失效——用户 tab 过去时，根本不知道自己进了个“冻结区”。
