分享笔记:

noopener,noreferrer 和 nofollow 标签

网站链接三个属性标签你知道分别代表什么嘛?

noopener,noreferrer 和 nofollow 标签如何影响搜索引擎排行和安全

noopener,noreferrer 和 nofollow 是HTML中三种可以添加到链接的标签属性,它们用于控制链接的行为和安全性

什么是 rel=“noreferrer” ?

noreferrer 是一个链接属性,它阻止浏览器向目标网站发送 HTTP Referer 标头。这有助于保护用户的隐私,因为它不会透露用户正在访问的来源网页。

这意味着在 Google Analytics 中,带有 “rel=’noreferrer'” 属性链接的流量将显示为 “直接流量”。

<a href="https://jhchen.top/" rel="noopener">外贸建站笔记</a>

我们来举个例子:

  • 网站A有条没有 rel=“noreferrer” 的链接指向网站B。
    B站长在 Google Analytics 查看“获取”报告时,可以在“引荐来源”部分看到来自网站 A 的流量。由于没有使用 “rel=’noreferrer'” 将显示为引荐流量
  • 网站A有条 rel=“noreferrer” 的链接指向网站B。
    网站 A 到网站 B 的流量都会在 Google Analytics 中显示为直接流量,而不是引荐流量。

什么时候使用 “noreferrer”?

当你不希望其他网站知道你正在链接它们时。听起来可能会有点荒唐,不过确实是这种情况下使用的。

不要在内部链接中使用 rel=”noreferrer” 属性,这可能会让你内部的分析报告不准确。

“noreferrer” 对搜索引擎优化的影响

添加 noreferrer 标签到链接上不会直接影响 SEO,但是它对你的推广和外链链接建设可能会有间接影响。

所有站长每天都会查看他们的网站数据,其中之一就是“引荐流量”,当他们看到某个网站有链接他们时,他做的第一件事肯定是看你的网站,如果你的网站内容不错,他会关注你,甚至也给你一条友情链接(做外链本来就难,何必断了一条路呢)。这肯定对搜索引擎优化是有利的,而且谷歌也推荐过这种方式来获取其他网站的链接。

当你的链接带有rel=“noreferrer”标签时,上面的情况肯定是不会发生的,因为他根本就不知道你连了他,他又为什么要平白无故连上你呢。

什么是 rel=“nofollow” ?

nofollow 是一个用于搜索引擎优化(SEO)的属性,它告诉搜索引擎不要追踪链接。这意味着链接不会传递链接权重(link juice/PageRank)到链接的目标页面。一个网站的链接权重是有限的,所以我们要合理分配,没必要或没有深度的内容页面不需要叫搜索引擎follow它们。

nofollow链接
nofollow链接

“nofollow” 和 “noreferrer” 的区别

当你将 rel=”nofollow” 添加到外部链接时,是在告诉搜索引擎不要传递页面的 PageRank 给其他页面,要求搜索引擎在 SEO 方面忽略该链接。

Nofollow 和 noreferrer 的区别在于 noreferrer 不会向浏览器传递任何引用信息,但会跟踪该链接。而 nofollow 则会将引用信息传递给浏览器,但不会跟踪该链接

它们是对立面。在你不感兴趣的链接上使用 nofollow,在你不希望其他网站知道你链接到它们时使用 noreferrer。

什么是 rel=“noopener” ?

<a href="https://jhchen.top/" rel="noopener">JH. CHEN 外贸建站笔记</a>

rel=”noopener” 防止新打开的页面获取对原始页面的任何访问权限。当使用 target=”_blank” 打开新窗口时,新打开的窗口可以通过 window.opener 访问原始页面,这叫Tab Snapping,这可能会被他人用来攻击我们的网站。noopener 可以防止这种情况发生。

出于安全原因,WordPress 会自动添加到所有在新标签页中打开的外部链接上。如果你不用 WordPress,那么也建议你把 rel=”noopener” 添加到所有在新标签页中打开的外部链接里。

“noopener” 对搜索引擎优化的影响

noopener 对搜索引擎优化丝毫没有影响,所以你可以放心使用来提高网站的安全性。

WordPress新标签页打开页面自带属性

这个点很重要,你在WordPress自带的古腾堡编辑器只要指定一条链接在一个新标签页中打开,是默认自带 rel=”noreferrer noopener” 的。

如果是用的网站构建器,像ElementorBricks builder,新窗口打开默认只有“noopener”

古腾堡新窗口打开页面自带属性
古腾堡新窗口打开页面
elementor新窗口打开页面自带属性
Elementor新窗口打开页面
bricks-builder新窗口打开页面自带属性
Bricks Builder 新窗口打开页面

其他rel链接属性标签

其实除了上面三种还有一些其他的链接属性:

  • rel=”sponsored”:广告链接或付费链接(通常称为“付费链接”),如果你在做Amazon联盟,那么全部的联盟链接都得是带 rel=”sponsored” 的。不正确使用的话,可能会被搜索引擎制裁。
  • rel=”ugc”:标记用户生成的内容(例如评论和论坛帖子)的链接。
  • rel=”alternate”:用于备用链接,通常用于不同设备之间或者不同语言之间。
  • rel=”canonical”:当前链接是重复内容,主要内容在另外一条链接。

具体可以去谷歌官方文章看看

总结

 noreferrer 和 noopener 不会对你网站的搜索引擎优化产生负面影响,可以放心使用。你不信的话可以看看这篇 noopener 和 noreferrer的作用文章。如果你用的是WordPress古腾堡,这些标签会自动添加到在新标签页中打开的外部链接中。

Noopener 是为了提高网站安全性必须要用到的,以防止其他网站通过浏览器会话访问你的页面。

Noreferrer 用于防止引用信息传递到目标网站,这也会在 Google Analytics 中隐藏引荐流量。

为笔记评分

平均评分 5 / 5. 摘星者: 4

有疑问?留个言吧!

?>

更多结果...

Generic selectors
Exact matches only
Search in title
Search in content
Post Type Selectors