rel="nofollow" 是告知搜索引擎不背书、不传递权重的提示，不影响用户点击跳转；仅对静态 标签有效，须小写带引号无空格；与 noopener noreferrer 共存时需同时使用以保障安全。
rel="nofollow" 不是控制用户能不能点的开关，而是明确告诉搜索引擎：这个链接我不背书、不传权重、不认可内容。 它对页面渲染和跳转完全没影响，加或不加，用户点击照常跳转。误以为它能“屏蔽外链”或“防止爬虫访问目标页”，是多数人一开始踩的最大坑。
rel="nofollow" 必须写在 <a></a> 标签里，且只对静态 HTML 有效
它只作用于直接写在 HTML 源码中的 <a></a> 标签，对以下情况完全无效：
-
<link>标签（比如<link rel="stylesheet">）不能加rel="nofollow" - JavaScript 动态插入的链接，例如
document.createElement('a')后设置rel，搜索引擎通常不识别 - 通过
meta name="robots" content="nofollow"是整页级控制，不是单个链接粒度
常见错误写法：rel=nofollow（缺引号）、rel="no follow"（带空格）、rel="NOFOLLOW"（大小写虽不敏感但易出错）。正确写法只有：rel="nofollow"，小写、带引号、无空格。
target="_blank" 必须配 rel="noopener noreferrer"，nofollow 是额外选项
单独加 target="_blank" 有安全风险：新页面可通过 window.opener 修改原页面地址，诱导钓鱼。所以必须加 rel="noopener"（断开 opener 引用）和 rel="noreferrer"（隐藏 Referer 头）。
rel="nofollow" 和它们不是一回事，也不冲突，可以共存：
<a href="https://example.com" target="_blank" rel="noopener noreferrer nofollow">外部资源</a>
注意顺序无关，但多个值之间必须用空格分隔；如果只写 rel="nofollow" 而漏掉 noopener，ESLint 或 Lighthouse 会直接报安全警告。
什么时候该加 rel="nofollow"？关键看“是否愿意为链接内容背书”
判断逻辑非常直白：
- 用户评论里留的个人博客链接 → 加，因为你没审核、不担保质量
- 广告位、赞助合作链接 → 推荐同时加
rel="sponsored"（比nofollow更精准，Google 明确推荐） - 你自己网站的
/about、/contact等内部导航 → 绝对不加 - 引用权威资料（如 MDN、RFC 文档）→ 可不加，属于可信推荐
别为了“SEO 看起来干净”而批量给所有外链加 nofollow。过度使用反而让搜索引擎难以理解你的真实推荐意图，长期可能弱化你作为信息节点的可信度。
真正容易被忽略的是：nofollow 不解决链接安全性问题，也不替代内容审核。它只是搜索引擎协议层的一个提示信号——既不能防 XSS，也不能阻止恶意跳转，更不会让垃圾链接自动消失。把它当成“信任开关”，而不是“防护盾”。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
