
快速理解 rel 属性与作用
rel 属性是添加在 a 标签上的关系描述,用来标注当前页面与目标链接之间的关系。它常被用于控制搜索引擎处理方式、加强前端安全,以及提升辅助技术的理解度。
你可以把它看作“链接意图”的明示。对人和机器都更清楚。
在编辑器或站点生成器中,像 Elementor 的“自定义属性”与 Publii 的 External Links 插件,都允许直接设置 rel 的值,便于在大量链接中实现一致的策略与自动化。
参考文档可查阅 MDN 对 rel 的定义与可用值说明:MDN: HTML rel 属性。
简要回顾一下其核心作用:
- SEO:向搜索引擎表达“是否传递权重、是否为付费”等意图。
- 安全:在新标签页打开时阻断潜在的 window.opener 劫持。
- 可访问性:更清晰地向读屏软件传达链接性质和行为。
如何为不同场景选择合适的 rel 值
nofollow 控制搜索引擎跟踪
当你不希望搜索引擎跟踪或传递权重到目标页面时,添加 rel=”nofollow”。常见于用户生成内容、低信任外部资源、赞助或广告链接。
Google 对 nofollow、sponsored 的说明可参阅官方文档:Google Search Central: Qualify outbound links。
注意:nofollow 并不保证“完全不抓取”,它表达的是一种建议。搜索引擎会综合判断。
sponsored 标注付费或联盟链接
对广告、软文、联盟推广等付费性质的链接,应加上 rel=”sponsored”。这比仅使用 nofollow 更清晰地标示商业关系。
常见做法是 sponsored 与 nofollow 同时使用,以双重表达:rel=”sponsored nofollow”。对合规与透明更有帮助。
external 标记外部站点
rel=”external” 用来指明链接指向站外页面。部分主题或脚本可据此添加样式或轨迹标识。它对搜索引擎影响较弱,但对分类与统计有用。
可配合 nofollow、noopener、noreferrer 一起使用,形成可读性和安全性的合力。
noopener 防止新窗口劫持
当链接以 target=”blank” 在新标签页打开时,若缺少 rel=”noopener”,新页面能通过 window.opener 访问原页面,带来潜在的“反向标签劫持”风险。
建议所有新标签页打开的链接都加上 rel=”noopener”。这是前端安全的基本动作。
想了解攻击原理,可参考 OWASP 的说明:OWASP: Reverse Tabnabbing。
noreferrer 保护来源信息
rel=”noreferrer” 会阻止浏览器向目标站点发送 HTTP Referer。它在保护敏感来源路径上有帮助,同时也会影响分析工具对来源的识别。
如果你的分析统计依赖来源数据,可谨慎开启。必要时仅为敏感链接使用。
alternate 指向文档的替代版本
当页面存在替代版本(如 PDF、RSS、或语言版本)时可以使用 rel=”alternate”。例如,文章页面链接至 PDF 下载或至 RSS 源。
涉及多语言站点时,通常应在 head 使用 ,而不是仅在 a 标签上标注。可查阅 Google 多语言站点建议:Google: 多语言与多地区站点。
author 指向作者页面
rel=”author” 用于指向作者主页或作者档案页。这属于语义化标注,在某些主题或微格式解析中仍有价值。
与作者信息组件配合使用更佳。
如何在 Elementor 中添加 rel 设置
自定义属性的填写方法
Elementor(专业版)提供“自定义属性”字段,可为任意小组件的链接加入属性。填写格式通常为每行一条键值对:key|value。
示例:
- rel|nofollow sponsored noopener noreferrer external
- target|blank
将以上两行添加到含链接的小组件中,即可一次性设置多个 rel 值,并指定新标签页打开。若仅需单值,保持单词即可;多值以空格分隔。
注意避免无效空格或换行错误。
常见设置示例与验证
常见搭配:
- 站外非付费但需新开:rel=”noopener noreferrer external” + target=”blank”
- 联盟推广:rel=”sponsored nofollow noopener noreferrer external” + target=”blank”
- 站内链接:不加 external,不需 noopener(除非新开),一般不加 nofollow
验证方式:
- 在浏览器中打开页面,检查元素,确认 a 标签的 rel 与 target 值是否正确。
- 使用 Lighthouse 或 Chrome DevTools 的无障碍与安全检查,查看是否存在新标签页安全提示。
Elementor 官方说明与示例可参考其文档:Elementor: Custom Attributes。
如何在 Publii 中配置 rel 设置
External Links 插件的选项
Publii 的 External Links 插件可在站点构建时自动为外部链接添加属性。常见选项包括:
- 勾选“在新标签页打开”(自动加 target=”blank”)。
- 为外链接加 rel,如 noopener、noreferrer、external,或在付费链接模板中额外加 nofollow、sponsored。
- 设置域名白名单(排除站内或特定合作域)。
按需组合后,生成静态页面时即批量生效。
自动添加与输出检查
构建完成后,打开输出的 HTML 文件,使用浏览器检查元素,确认 rel 是否被正确注入。同时测试点击行为与来源统计。
Publii 的官方站点提供插件介绍与使用示例:Publii Documentation。
如何按链接类型制定统一流程
内部链接的处理
建议默认不加 nofollow 与 external,以便站内结构清晰传递权重。除非页面是可索引策略中的例外。
步骤:
- 识别链接是否指向同一主域或受信子域。
- 默认不设 target=”blank”,由用户自行返回。
- 确需新开时,添加 noopener(与 noreferrer 视需要)。
保持简洁。
外部链接的处理
为所有站外链接制定一个基础模板,便于全站统一。
- 默认:rel=”noopener noreferrer external” + target=”blank”
- 若为低信任或未知来源:再加 nofollow
- 若需保留来源统计:去掉 noreferrer,但务必保留 noopener
按分类微调。
付费与联盟链接的处理
所有付费、联盟、赞助类链接,推荐统一使用:
- rel=”sponsored nofollow noopener noreferrer external” + target=”blank”
同时在文案处给予清晰标注,例如“推广”、“赞助”。
在新标签页打开的链接的处理
凡用 target=”blank”,一律加 noopener。优先级最高。
如果你不希望目标站点获知来源,再加上 noreferrer。若需来源分析,则保留或仅在特定链接上移除。
SEO 安全与可访问性最佳实践
SEO 意图管理与站点权重控制
对站外链接的意图要清晰一致。付费走 sponsored;低信任走 nofollow;普通推荐保留默认设置。
避免对全部站外链接一刀切 nofollow。保持合理的对外推荐,有助于搜索引擎理解你的主题关系网络。
打开新标签的安全策略
始终为 target=”blank” 添加 rel=”noopener”。在需要时再配合 noreferrer。
把它做成模板或自动化规则,避免人工遗漏。安全项越自动化,越可靠。
为辅助技术提供更清晰的提示
若链接会在新标签页打开,可在可见文本或 aria-label 中给出提示,例如“(新标签)”。
示例:
- 可见文本:下载白皮书(新标签)
- aria-label:下载白皮书,链接在新标签页打开
这能帮助读屏用户预期行为变化,减少迷失。
常见错误与排查清单
冲突或冗余的 rel 值
不要重复填写相同值,例如 rel=”nofollow nofollow”。保持整洁。
避免语义冲突。例如把本应传递权重的站内关键导航误加 nofollow,可能影响页面间关系。对模板与批量规则需谨慎。
遗漏 noopener 或 noreferrer
target=”blank” 却漏掉 noopener,是最常见的安全疏漏。请在编辑器、主题或插件层面补上默认规则。
若你必须保留来源信息,可只加 noopener,不加 noreferrer。
使用检查与监测工具
建议定期审查:
- Chrome DevTools 与 Lighthouse:检查可访问性与安全提示。
- Screaming Frog 或站内爬虫:抓取 a 标签并导出 rel、target 字段进行批量核对。工具地址:Screaming Frog SEO Spider。
- 正则搜索:在代码仓库或构建输出中查找 target=”blank” 是否都配有 noopener。
维持一个简明的巡检流程。
最后给出一个可复制的参考清单:
- 站内链接:默认不加 nofollow,不新开;新开则加 noopener。
- 站外普通链接:rel=”noopener noreferrer external” + target=”blank”。
- 付费/联盟:rel=”sponsored nofollow noopener noreferrer external” + target=”blank”。
- 需要来源统计:去掉 noreferrer,但保留 noopener。
- 特殊资源(PDF/RSS/语言版本):合适时用 alternate,并在 head 层面设置 hreflang。
延伸阅读与规范来源:
- MDN:HTML rel 属性
- Google:外链标注策略
- OWASP:Reverse Tabnabbing
- Elementor:Custom Attributes
- Publii:Documentation
至此,你已具备制定与执行 rel 策略的关键要点。小处着手,长期受益。