隐私政策页面应使用语义化HTML结构：整页主体用<main>包裹，标题用<h1>，章节用<section>和<h2>，正文用<p>，列表用<ul>或<ol>；版权信息单独置于<body>子级<footer>中；关键字段必须用<h2>而非样式标签；需添加viewport meta、可访问链接、aria-label、相对字体单位，并正确使用<time>标记更新日期。

直接用 <footer> 包裹版权信息，但隐私政策正文不能塞进 <footer> —— 它是法律文本，不是页脚。

隐私政策页面该用什么语义标签组织

隐私政策是独立文档，不是导航栏或页脚的一部分。整页主体应包裹在 <main> 里，标题用 <h1>，章节用 <section> + <h2>，每段说明用 <p>，列表项用 <ul> 或 <ol>。别用一堆 <div> 堆砌，否则屏幕阅读器读不出结构，搜索引擎也难识别重点。

• <article> 可选但非必须：如果隐私政策是站内唯一、可独立分发的文档（比如支持 RSS 或单独链接），可用 <article> 替代 <main>
• 避免嵌套 <footer> 在 <section> 里：除非某小节末尾有“本节更新于 2026-07-01”这类局部说明，否则整个页面的版权信息只放在 <body> 直接子级的 <footer>
• 关键字段如“我们收集的信息类型”“共享对象”“用户权利”必须用 <h2> 而非 <strong> 或 <span> 样式化——语义优先，样式后置

移动端适配和可访问性容易漏的点

隐私政策文字密、段落长，用户常需缩放、跳转、朗读。纯靠 CSS 响应式不够，得配合 HTML 层面控制。

Wechat HTML Publisher

直接上传HTML富文本到微信公众号草稿箱。支持完整的HTML格式,无需Markdown转换。

下载

• <meta name="viewport" content="width=device-width, initial-scale=1"> 必须存在，否则 iOS Safari 默认缩放失效
• 所有链接（如“联系我们”“撤回同意”）必须带 href，禁用 <div onclick> —— 否则 VoiceOver 无法聚焦，键盘 Tab 会跳过
• 长列表（如权限清单）建议加 aria-label，例如 <ul aria-label="我们获取的设备权限列表">，帮助读屏软件定位
• 避免固定 font-size: 12px：用相对单位 rem 或 em，确保系统字体放大时内容不溢出

referrerpolicy 对隐私政策页面没用，别乱加

很多人看到“隐私”就条件反射加 referrerpolicy="no-referrer"，但它只影响外链资源请求（如 <img>、<script>），对静态 HTML 页面自身加载完全无效。反而可能误伤内部跳转：

立即学习“前端免费学习笔记（深入）”；

• 页面内锚点跳转（如 <a href="#data-sharing">）不受 referrerpolicy 控制
• 如果给 <a href="/privacy-policy.html"> 加了 referrerpolicy="no-referrer"，点击后目标页 Referer 为空，但你根本不需要隐藏来源——这是自家页面
• 真正要保护的是埋点上报、第三方统计 JS 的 Referer，它们该由响应头 Referrer-Policy 统一控制，不是单个 <a> 标签能解决的

最易被忽略的是更新时间标记：法律要求明确标注生效日期，但很多人只写“2026年更新”，没用 <time datetime="2026-07-01">2026年7月1日</time>。这不仅不利于 SEO 归档，还让自动化合规检查工具无法提取时间戳。