html语义标签是rss抓取、seo索引和无障碍访问的基础，非加分项；首页用main包多个article（每篇摘要独立），不用article包裹整页；header仅含品牌信息，nav须独立并加aria-label；内页h1必须为文章标题，嵌套于article>header中；time需iso格式datetime；aside和footer须严格按语义使用。
手写 HTML 博客时，article、nav、main 这些标签不是“加分项”，而是决定你文章能不能被 RSS 阅读器抓取、搜索引擎正确索引、屏幕阅读器顺畅朗读的关键基础设施。不按语义写，后期改结构的成本远高于起步时多敲几行标签。
博客首页该用 section 还是 article？
首页本身不用 article——它不是一篇独立可分发的内容，而是容器。每篇摘要（带标题、时间、摘要文字、链接）才该包在单独的 article 里。
-
article必须能脱离上下文独立存在：RSS 订阅、微信公众号自动抓取、Google News 推送都依赖这个判断 -
section是逻辑分组，比如“最新文章”“热门归档”两个区块，各自用section包裹更准确 - 首页的
main里可以有多个article，但不能把整页内容塞进一个article - 错误写法：
<article><h2>首页</h2> <section>…</section></article>—— 这会让 RSS 解析器误判为“首页是一篇文章”
header 和 nav 分开写的必要性
把 Logo 和导航菜单混在一个 header 里，等于主动放弃 SEO 和无障碍支持。搜索引擎靠标签区分品牌标识与跳转入口，屏幕阅读器用户靠 nav 的语义快速定位导航区。
-
header只放网站级元信息：<h1></h1>、Logo 图片、副标题等，不含任何链接 -
nav必须独立，且建议加aria-label="main navigation"，避免多个nav时混淆 - 导航项超过 5 个？用
<details><summary>更多</summary><ul>…</ul></details>，比 JS 控制更轻量、更可靠 - 搜索框、登录按钮别塞进
nav——它们属于form或aside范畴
内页（如 post-01.html）的 h1 放哪？
首页的 h1 是博客名，内页的 h1 必须是文章标题本身。重复或缺失 h1 会干扰 SEO 权重分配，也违反 WCAG 可访问性标准。
- 内页结构必须是：
<main><article><header><h1>文章标题</h1> <time datetime="2026-08-01">2026年8月1日</time></header><p>正文…</p></article></main> - 不要在
header外再写一个h1，也不要在article外套section再塞h1 -
time标签的datetime属性必须是 ISO 格式（如2026-08-01），否则 Google 不识别发布时间 - 如果文章含多个小节，用
section+h2划分，别用div+ class 模拟标题层级
最容易被忽略的点：语义化不是“写对标签就完事”，而是每个标签都要承担它被设计出来的职责。比如 aside 不是“放广告的地方”，而是“与当前 article 相关但非核心的信息”；footer 在 article 内部出现时，表示该文章的作者、许可协议等元信息——这些细节，恰恰是 RSS 解析器和爬虫真正看的。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
