新闻详情页不必强制使用，但强烈建议：它标识独立可复用内容，提升seo与无障碍访问；的datetime属性须为iso 8601格式（如2026-04-13t12:26:00+08:00），否则搜索引擎判无效。
新闻详情页必须用 <article></article> 吗？
不用强制，但强烈建议。浏览器和爬虫会把 <article></article> 当作独立、可复用的内容单元，对 SEO 和无障碍访问（如屏幕阅读器）有直接帮助。如果只用 <div> 包裹，语义丢失，后续加结构化数据（如 JSON-LD）或做 AMP 适配时会多绕两步。
<p>常见错误是把整页塞进一个 <code><article></article> —— 实际上它只应包裹单篇新闻的正文区域，标题、作者、发布时间、图片、段落、引用等都放里面；页头、导航、相关推荐这些属于页面级容器，该用 <header></header>、<nav></nav>、<aside></aside> 分开。
<time></time> 标签怎么填才不被搜索引擎判为无效时间？
<time></time> 的 datetime 属性必须是机器可解析的格式，比如 2026-04-13T12:26:00+08:00，不能写成“2026年4月13日”或“今天”。否则 Google Search Console 可能报 datePublished missing 或 invalid。
- 发布时间用
<time datetime="2026-04-13T12:26:00+08:00">2026年4月13日</time> - 更新时间加
itemprop="dateModified"（若用 Schema.org） - 避免空格、中文标点、省略年份——
04-13或4月13日都无效
图片懒加载和响应式怎么一起写才不出错？
直接在 <img> 上同时用 loading="lazy" 和 srcset 是安全的，但要注意三件事：
-
src必须存在，它是降级兜底地址，不能只靠srcset -
width和height属性要写，否则触发 CLS（累积布局偏移），尤其在新闻页首图位置 - 不要给
<img>外层再套<picture></picture>除非真需要 art direction（比如横屏竖屏换图），多数新闻图用srcset + sizes足够
示例：<img src="news-800.jpg" srcset="news-400.jpg 400w, news-800.jpg 800w, news-1200.jpg 1200w" sizes="(max-width: 768px) 100vw, 800px" style="max-width:90%" style="max-width:90%" loading="lazy" alt="荣耀机器人参加亦庄马拉松">
段落首行缩进用 text-indent 还是 padding？
必须用 text-indent。用 padding-left 会导致整段左移，破坏对齐，且和 margin 冲突容易引发意外空白。新闻正文对排版精度敏感，这点不能妥协。
注意两个细节：
-
text-indent值推荐用2em，不是固定像素——字体放大时缩进也等比放大 - 第一段通常不缩进（中文排版惯例），可用
p:first-of-type { text-indent: 0; }控制 - 遇到
<blockquote></blockquote>或<pre class="brush:php;toolbar:false;"></pre>等特殊块级元素，要单独重置text-indent: 0，否则会继承缩进造成错位
真正难处理的是图文混排时的浮动图+文字环绕——这时候 text-indent 依然生效，但视觉上可能被图片遮挡，得靠 clear 或 Flex/Grid 重新组织流式关系，而不是调缩进值硬凑。
