footer 是语义明确的元信息容器，版权信息须用 包裹并嵌套于 内，友情链接须用 + 结构并合理分组，全站页脚应为 直接子元素，视觉布局需靠 css 实现。
footer 标签内部不是“底部内容集合区”，而是语义明确的元信息容器。版权信息和友情链接可以共存，但必须按规范分层组织，否则会影响可访问性、SEO 和 DOM 结构稳定性。
版权信息用 包裹，且只放附属类内容
版权文字属于次要但需保留的法律性信息，W3C 明确定义 的语义是“附属细则”，专用于这类内容。它必须嵌套在
- 正确写法：
- 多主体版权可并列多个 ：
- 避免用 包版权—— 只适用于物理/电子联系方式（如邮箱、电话、地址）
- 别把备案号、ICP号直接塞进 里；中国网站的备案号建议单独用
或 ，但需确保链接真实有效（如指向工信部官网）
友情链接必须用
页脚里的“站点地图”或“快速链接”本质是导航，不是装饰性文字。堆成一排或用竖线分隔会破坏键盘导航流，也削弱 SEO 权重。
- 每组链接必须包裹在
- 分组标题用
或
，不可省略；
更利于屏幕阅读器识别层级
- 链接总数建议控制在 12–15 个以内，优先保留高频路径：隐私政策、服务条款、用户协议、联系方式
- 禁止把友情链接写成 —— 没有结构、无法键盘跳转、读屏软件无法解析
位置与嵌套必须严格符合节结构
- 全站页脚应作为 的直接子元素：
… - 绝不能塞进
里： 是错误的——这是 的页脚，不是页面级页脚 - 文章级页脚可放在
内部，但必须紧贴正文结尾，且不被 或隔开 视觉居中与贴底需靠 CSS 实现，而非标签本身
- 居中文字：确保
- 贴底显示：推荐 Flex 布局 —— 给 设 display: flex; flex-direction: column; min-height: 100vh；
设 flex: 1； - 避免 position: absolute; bottom: 0 —— 打印、长页、读屏场景下表现不可靠
- 移动端链接换行：包裹链接的容器需设 display: flex; flex-wrap: wrap；单列时用 @media 设 flex-direction: column
