新闻聚合页面的列表结构中，article标签是语义基石，每条新闻必须用独立article包裹，含h2+标题、唯一id、ISO 8601格式time、figure配图及main容器规范。

新闻聚合页面的列表结构，article 标签不是可选项，而是语义基石。它直接告诉搜索引擎、屏幕阅读器和各类内容聚合工具：“这是一条独立、完整、可分发的新闻”。用

替代，等于主动放弃机器可读性。

每条新闻必须包裹在独立的

中

不能把所有新闻塞进一个

或全用

套娃。每条新闻需单独成块，且满足以下硬性条件：

• 内部至少包含一个
  或更高级标题（仅用
  + 摘要不合法）
• 必须有唯一 id，例如 id="news-20260623-001"，用于锚点跳转与前端交互
• 若含图片，优先使用
  组合，alt 属性须描述画面实质，如“东航C919客机滑行起飞”，而非“新闻配图”

标签必须带 ISO 8601 格式的 datetime 属性

发布时间不是视觉呈现问题，而是机器解析前提。只写 2026年6月23日 无效。

• ✅ 正确写法：2026年6月23日 10:15
• 时区必须显式声明，+08:00 不可省略；UTC 时间用 Z 后缀
• 若需同时标注发布与更新时间，用两个 ，并为更新时间添加 itemprop="dateModified"（配合 Schema.org）

整个列表区必须由

包裹，导航与版权各归其位

是内容主体的明确边界，只容纳新闻

列表，不掺杂导航栏或页脚信息。

腾讯文档智能助手

腾讯文档智能助手是一款AI办公效率工具，腾讯推出的AI文档生成和辅助工具。

下载

• 仅放站点级标识：logo、主站名、全局搜索框
• 主导航栏应单独使用
  ，放在
  下方或与
  并列
• 分页控件（如“上一页 / 下一页”）也必须用
  ，不可用
  或裸

  图文流布局推荐 CSS Grid，配合原生懒加载

  浮动（float）已不适用于现代新闻流，易导致高度塌陷、换行错位等问题。

  • CSS Grid 天然支持等高列、响应式折行、源顺序与视觉顺序分离
  • 图片必须写 width 和 height，否则触发 CLS（累积布局偏移），拉低 Core Web Vitals 分数
  • 懒加载用原生 loading="lazy" 即可，无需 JS 插件；src 必须存在，作为降级兜底地址