应使用 标签直接包裹页脚内容，因其符合 HTML5 语义且被屏幕阅读器和搜索引擎稳定识别； 仅适用于附属细则，不可用于主版权声明；主版权须置于 直接子级的 中，年份需动态更新，多语言版本需匹配 lang 属性。
直接用 <footer></footer> 包裹，别绕弯。这是唯一既符合 HTML5 语义、又被屏幕阅读器和搜索引擎稳定识别的方式。其他方案——比如 <div class="footer">、<code><small></small>、<p></p> 单独放底部——要么丢语义，要么被误读为次要内容，要么在结构化数据提取时失效。
为什么不能用 <small></small> 写版权？
<small></small> 是为“附属细则”设计的，比如免责声明里的“本条款解释权归 XXX 所有”，不是给主版权声明用的。常见错误是把整段 © 2024 MySite 塞进 <small></small>，结果：
- 屏幕阅读器可能跳过或弱化朗读，用户听不到归属主体
- SEO 工具无法区分这是主版权还是某条链接旁的备注
- 无障碍检测（如 axe 或 WAVE）会标为“语义误用”
正确做法：主版权放 <footer></footer> 直接子元素；若页脚内需弱化某条补充说明（如“含开源组件许可信息详见 LICENSE 文件”），再用 <small></small> 套那一条。
<footer></footer> 的位置和嵌套规则
它必须是语义上的“页脚”，不是视觉上靠下的任意容器：
立即学习“前端免费学习笔记（深入）”；
- 全站版权应放在
的直接子级，且尽量靠后（但不必是 DOM 最末） - 一个页面可以有多个
<footer></footer>，比如文章区块自带作者信息，但那个不替代主站版权 - 别用
<footer></footer>包广告横幅、订阅表单——这些属于功能模块，不是元数据 - React/Vue 项目中，确保最终渲染出的是原生
<footer></footer>标签，而非仅靠 CSS 模拟
年份动态更新与多语言细节
硬写 2024 是最常被忽略的过期点。当前时间是 2026 年，如果模板里还留着 2024，法律效力和专业感都打折扣：
- 服务端渲染（PHP/Node.js）：用
© <?php echo date('Y'); ?> MySite - 静态站点生成器（Vite/Next.js）：构建时注入，避免运行时 JS 依赖
- 纯前端补救（慎用）：
<script>document.querySelector('footer time').textContent = new Date().getFullYear()</script>，但得配<time datetime="2026">2026</time>作降级 - 多语言页：每个语言版本的
<footer></footer>都要独立写，且lang属性需匹配正文语言，比如中文页用<footer lang="zh"></footer>，英文公司名部分加<span lang="en">MySite Inc.</span>
真正麻烦的从来不是怎么写那行字，而是版权主体变更、合作方署名规则、开源组件合规声明这些背后要对齐的东西。
