article是唯一符合“可独立分发”语义的标签，每条新闻必须用独立article包裹并配标题、time[datetime]、唯一ID；section仅用于主题分组，div无语义，误用会导致RSS抓取失败、屏幕阅读器跳过及SEO降权。
article 是最直接、最符合语义的选择，但不能只用它堆砌内容——必须配合 main、section 和结构化嵌套，否则搜索引擎和屏幕阅读器会误判内容关系。
为什么不是 section 或 div？
section 表示「有共同主题的一组内容」，但它不强调独立可分发性；而热点新闻每条都应能被 RSS 抓取、单独分享、或在第三方平台（如微信看一看）中独立呈现——这正是 article 的设计本意。div 则完全无语义，等于放弃 SEO 和无障碍支持。
常见错误现象：
— 用 section 包裹 10 条新闻标题+摘要，结果被爬虫当成一个大章节；
— 所有新闻卡片都套 div class="news-item"，alt 缺失、time 标签不用、正文段落写成 div + br。
- 每条新闻必须用独立的
article元素包裹 -
article内部必须含至少一个标题级元素（h2–h6），通常用h2 - 发布时间必须用
time标签，带datetime属性（如<time datetime="2026-08-25T14:30">2小时前</time>） - 避免把广告、推荐位、分页导航塞进同一个
article里
article 嵌套与层级怎么安排？
聚合页本质是「多篇独立内容的集合」，所以外层用 main，内部用 section 做逻辑分组（如「突发」「国内」「国际」），每个分组下再放若干 article。不能让 article 直接平铺在 body 下，也不能让 section 套 section 再套 article——层次过深会削弱语义权重。
每小时自动在推特搜索中国、加密货币、国际热点、美国热点、特朗普等话题的热度信息，提取前十热点，依据 X 平台真实算法权重（开源代码数据）为每个热点生成高曝光推文或线程。用户提及“推特热点”“Twitter热点”“推特搜索”“热点推文”“生成推文”“社交媒体监控”“Twitter监控”等关键词时触发。
立即学习“前端免费学习笔记（深入）”；
-
main必须唯一，且不包含全局header/footer - 每个
section应有明确h2标题（如<h2>突发新闻</h2>） -
article可以嵌套article（如新闻下的用户评论），但聚合页主列表中不建议嵌套 - 不要用
nav包裹新闻标签云或分类筛选——那是aside或普通表单的职责
图片、摘要、来源信息怎么加语义？
热点新闻的缩略图不是装饰，而是内容不可分割的一部分。必须用 figure + img + figcaption 组合，而不是 div + img。摘要文字要用 p，别用 span 模拟；媒体来源（如「新华社」）建议放在 footer 子元素里，用 small 或 cite 包裹。
-
img必须有alt，描述图中关键人物/事件（如alt="北京暴雨致地铁站积水，乘客涉水通行"） - 若图含时间地点等信息，
figcaption可补充（如<figcaption>8月25日早，朝阳区三里屯地铁站入口</figcaption>） - 摘要段落必须是
p，且不能截断在句子中间（避免“据悉，该事故已造成…”这种无主句） - 来源链接如果存在，应放在
article > footer > a中，而非正文末尾硬塞一个a
最容易被忽略的是：聚合页的每条 article 都应有唯一 ID（如 id="news-12345"），便于前端锚点跳转、服务端预渲染识别，以及后续接入结构化数据（如 NewsArticle Schema）。没 ID 的 article 在机器眼里只是「一段看起来像新闻的文字」，不是「一条可引用、可归档的新闻实体」。
