rel="noopener"必须添加，否则target="_blank"会使新页面通过window.opener劫持原页面，引发Tabnabbing攻击；它强制新页面window.opener为null，彻底切断控制链。

target="_blank" 必须配 rel="noopener"

不加 rel="noopener"，新打开的页面能通过 window.opener 直接跳转或篡改原页面，这是真实存在的反向标签劫持（reverse tabnabbing）漏洞。2023 年 TikTok 就因此被利用过。

实操建议：

• rel="noopener" 是最低安全门槛，所有带 target="_blank" 的外链都必须加上
• 不要只写 rel="noreferrer" 代替 —— 它在部分旧版 Safari 中不切断 window.opener
• 可以单独用 rel="noopener"，无需搭配 noreferrer，除非你额外需要隐藏 Referer

rel="noreferrer" 不只是隐私开关，还影响 Referer 策略

rel="noreferrer" 会让浏览器完全不发送 Referer 请求头，但副作用是：它在多数现代浏览器中会附带切断 window.opener（等效于 noopener），不过这个行为不是规范强制的，不能依赖。

更可控的做法是用 referrerpolicy 属性替代部分场景：

• 想彻底不发 Referer → referrerpolicy="no-referrer"
• 只想跨域时不发、同域照常发 → referrerpolicy="strict-origin-when-cross-origin"
• rel="noreferrer" 等价于 referrerpolicy="no-referrer"，但粒度更粗、不可逆

SEO 相关的 rel 值要成对或按语义使用，不是越多越好

rel="nofollow"、rel="ugc"、rel="sponsored" 这三个值是 Google 2019 年后明确支持的 SEO 权重控制方式，它们互斥且不可叠加语义（比如不能同时写 ugc sponsored）。

Lesishu SEO Guide

SEO全流程：诊断、页面优化、技术SEO、内容策略、外链建设；触发关键词包括SEO、搜索排名、网站优化、关键词、标题描述、结构化数据、Core Web Vitals、sitemap、robots.txt、SEO审计等。

下载

常见误用点：

• rel="nofollow" ≠ “禁止收录”，它只表示“不传递权重”，目标页仍可能被爬虫发现并索引
• 用户生成内容（评论、论坛帖）应优先用 rel="ugc"，比 nofollow 更准确表达意图
• 广告或软文链接必须用 rel="sponsored"，否则可能违反 Google 的赞助内容披露政策
• rel="external" 纯属语义提示，搜索引擎不识别也不处理，别指望它影响 SEO

link 标签里的 rel 和 a 标签里的 rel 不是一回事

很多人混淆两者：a 标签的 rel 描述「当前页与目标页的关系」，而 标签的 rel 描述「当前页与所引用资源的关系」，作用对象和浏览器行为完全不同。

典型例子：

• → 控制新开页能否操作本页
• → 告诉浏览器“这是样式表，必须加载并参与渲染”
• → 触发后台预取，和 a 标签无关
• rel="noopener" 在 中无效，浏览器直接忽略

最容易被忽略的是：a 标签的 rel 值只有在有 href 时才生效；没 href 的空链接（比如只用作 JS 触发器）加了也白加。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！