必须用标签并严格设置ISO 8601格式的datetime属性，如2023年5月12日；仅文本或错误格式（如斜杠、中文）会使语义失效。
HTML里怎么写作品创作时间才规范
用 <time></time> 标签，不是 <span></span> 也不是 <div>。它专为时间语义设计，搜索引擎、屏幕阅读器和未来工具能识别出“这是日期”，而不是一堆数字。
<p>常见错误是直接写 <code><span>2023年5月</span>——机器看不懂这是时间，也做不了排序、聚合或日历联动。
-
<time datetime="2023-05">2023年5月</time>：适合年月，datetime值必须是机器可解析格式（ISO 8601），显示文本可本地化 -
<time datetime="2023-05-12">2023年5月12日</time>：完整日期，datetime不能写成"2023/05/12"或"12-05-2023"，否则无效 - 不写
datetime属性时，浏览器会尝试从内容里猜，但极不可靠，比如<time>去年冬天</time>完全没意义
年份时间轴布局用什么结构最稳妥
别用 <table> 模拟时间轴，也别靠绝对定位硬堆。语义清晰 + CSS 灵活控制才是正解：用带 <code><time></time> 的 <article></article> 或 <section></section> 套列表项，再用 CSS Grid 或 Flex 实现横向/纵向时间线。
关键点在于：时间信息必须在每个条目内部，不能抽到外层统一管理——否则无法支持多时间点、响应式折叠或无障碍导航。
立即学习“前端免费学习笔记（深入）”；
- 每个事件用
<article></article>包裹，内部放<time datetime="2021-03">2021年3月</time>和描述 - 避免用
id="year-2021"这类纯展示性 ID，改用data-year="2021"便于 JS 筛选，且不污染语义 - 横向时间轴慎用
white-space: nowrap+ 滚动容器，小屏下容易触发意外横向溢出，优先考虑垂直堆叠+年份分组
datetime属性填错会导致什么实际问题
填错 datetime 不会报错，页面照常显示，但后果隐蔽且严重：SEO 丢失时间权重、RSS 聚合失败、浏览器「阅读模式」可能过滤掉整段、iOS Safari 的分享卡片不显示时间。
最典型错误是混用中文标点或口语表达：
- ❌
<time datetime="2023年5月">2023年5月</time>（含中文字符，非法） - ❌
<time datetime="May 2023">2023年5月</time>（非 ISO 格式，被忽略） - ✅
<time datetime="2023-05">2023年5月</time>（合法，代表2023年5月任意一天） - ✅
<time datetime="2023-05-12T14:30">2023年5月12日下午2:30</time>（带时分，注意用T分隔日期与时间）
要不要用 schema.org 微数据补充时间信息
要，但只在需要强机器可读场景下加，比如作品集首页、新闻稿、学术成果页。普通博客正文加了反而增加维护成本，且多数 CMS 不自动同步 <time></time> 和微数据。
重点不是“有没有”，而是“是否一致”。如果用了 schema.org/CreativeWork，其中的 dateCreated 必须和页面内最近一个 <time></time> 的 datetime 值完全一致，否则结构化数据校验失败。
- 用
<meta itemprop="dateCreated" content="2023-05-12">放在或对应<article></article>内，不要手写两次 - 别为了加而加：Google 已明确表示，单纯加微数据但页面无对应可见
<time></time>，会被视为误导性标记 - 验证工具推荐：Google Rich Results Test，输入 URL 后看「DatePublished」字段是否提取成功
