新闻聚合页面的列表结构中，article标签是语义基石，每条新闻必须用独立article包裹，含h2+标题、唯一id、iso 8601格式time、figure配图及main容器规范。
新闻聚合页面的列表结构，article 标签不是可选项，而是语义基石。它直接告诉搜索引擎、屏幕阅读器和各类内容聚合工具：“这是一条独立、完整、可分发的新闻”。用 <div class="item"> 替代，等于主动放弃机器可读性。
<h3>每条新闻必须包裹在独立的 <article> 中</article>
</h3>
<p>不能把所有新闻塞进一个 <code><section></section> 或全用 <div> 套娃。每条新闻需单独成块，且满足以下硬性条件：
<ul>
<li>内部至少包含一个 <code><h2></h2> 或更高级标题（仅用 <p></p> + 摘要不合法）
id，例如 id="news-20260623-001"，用于锚点跳转与前端交互<figure><img><figcaption></figcaption></figure> 组合，alt 属性须描述画面实质，如“东航C919客机滑行起飞”，而非“新闻配图”发布时间不是视觉呈现问题，而是机器解析前提。只写 <time>2026年6月23日</time> 无效。
- ✅ 正确写法：
<time datetime="2026-06-23T10:15:00+08:00">2026年6月23日 10:15</time> - 时区必须显式声明，
+08:00不可省略；UTC 时间用Z后缀 - 若需同时标注发布与更新时间，用两个
<time></time>，并为更新时间添加itemprop="dateModified"（配合 Schema.org）
整个列表区必须由 包裹，导航与版权各归其位
<main></main> 是内容主体的明确边界，只容纳新闻 <article></article> 列表，不掺杂导航栏或页脚信息。
-
<header></header>仅放站点级标识：logo、主站名、全局搜索框 - 主导航栏应单独使用
<nav></nav>，放在<header></header>下方或与<main></main>并列 - 分页控件（如“上一页 / 下一页”）也必须用
<nav aria-label="新闻列表分页"></nav>，不可用<p></p>或裸<div> <h3>图文流布局推荐 CSS Grid，配合原生懒加载</h3> <p>浮动（<code>float）已不适用于现代新闻流，易导致高度塌陷、换行错位等问题。- CSS Grid 天然支持等高列、响应式折行、源顺序与视觉顺序分离
- 图片必须写
width和height，否则触发 CLS（累积布局偏移），拉低 Core Web Vitals 分数 - 懒加载用原生
loading="lazy"即可，无需 JS 插件；src必须存在，作为降级兜底地址
