rel=”noopener noreferrer” 標籤是什麼意思? (它會影響 SEO 嗎?)

已發表: 2022-04-14

保護您網站的安全性是成為網站所有者最重要的方面之一。 您可能了解在 URL 前綴中包含 HTTPS 的重要性,或者為什麼需要 SSL 證書。 但是你知道noopener noreferrer HTML 標籤屬性是什麼意思嗎,什麼時候應該使用它們?

在本文中,我們將討論rel=”noopener noreferrer”的含義,何時應該使用它,以及它如何從 SEO 的角度影響您的網站。 讓我們直接進入它。

什麼是 rel="noopener noreferrer"?

rel=”noopener noreferrer” HTML 屬性出現在外部超鏈接中。 具體來說,同時使用noopenernoreferrer屬性可以防止:

  • 鏈接的目標加載在單擊鏈接的同一選項卡中
  • 反向鏈接不會在目標站點的分析中顯示為推薦流量

這就是標籤屬性在行動中的樣子:

<a href="https://www.google.com/" target="_blank" rel="noopener noreferrer">

WordPress 會自動將這些屬性添加到您設置為在新窗口中打開的外部鏈接中。 讓我們分解它們,看看每個屬性的作用。

沒有開場白

如果您想阻止外部鏈接控制用戶的原始瀏覽器窗口,您需要添加一個noopener屬性。 根據 MDN,

“[ noopener ] 指示瀏覽器導航到目標資源,而不授予新的瀏覽上下文訪問打開它的文檔的權限。 [...] 這在打開不受信任的鏈接時特別有用,以確保它們不會篡改原始文檔...”

簡而言之, noopener在很大程度上是一種安全措施,用於防止惡意鏈接訪問用戶的瀏覽器(一種稱為 tabnabbing 的網絡釣魚攻擊)。 過去,在您的鏈接中單獨留下target=”_blank”會打開這個安全漏洞。 現在,每當您使用target=”_blank”將外部鏈接設置為在新的瀏覽器窗口中打開時,大多數搜索引擎和 SEO 專家都認為在它旁邊使用noopener是最佳做法。

(根據 Mozilla 開發者網絡 (MDN), target=”_blank” 屬性“現在隱式提供與noopener相同的 <rel> 行為”。 我們認為仍然值得雙重安全並包括noopener ,因為並非所有用戶都在最新和最安全的瀏覽器中單擊鏈接。)

無推薦人

本質上, noreferrer會阻止外部網站知道您已在您的網站上包含指向其材料的鏈接。 出於隱私或安全原因,這可能對您很重要。 總而言之,這個特定屬性是您在將其應用於鏈接之前需要考慮的一個。 使用它真的取決於你的喜好。

noreferrer屬性在目的地分析中掩蓋了您的推薦鏈接。 它可以保護您網站的信息不被傳輸到您的用戶正在導航的網站。 因此,這會導致鏈接在 Google Analytics 中顯示為直接流量,而不是來自您的特定域的推薦流量。

如果有人使用包含noreferrer的鏈接導航到您的網站,那麼您將能夠在您的分析儀表板上的推薦流量鏈接中看到他們的網站。 但是如果鏈接包含noreferrer ,它將出現在 Direct 流量中。 您可以在 Google Analytics 中的Acquisition > All Traffic > Channels and Acquisition > All Traffic > Referrals下找到這些列表。

它仍然會為 SEO 傳遞“鏈接汁”,但不會傳遞有關發起者的數據。 如果您對傳遞 SEO 提升不感興趣, nofollow將成為您要添加的附加標籤。

與 rel="nofollow" 一起使用

nofollow屬性添加到包含rel=”noopener noreferrer”的鏈接可讓您鏈接到其他網站,而不會出現批准其內容或觀點的情況。 谷歌表示,這個屬性應該用於“你想要鏈接到一個頁面但不想暗示任何類型的認可的情況,包括將排名信用傳遞給另一個頁面。”

基本上, nofollow告訴谷歌你不希望它僅僅因為你鏈接到它就認為你支持一個特定的網站。 有許多類似的鏈接屬性可以幫助 Google 理解鏈接背後的意圖,包括用於標記贊助和用戶生成內容的屬性(其中許多可以通過 Schema 標記添加)。

簡而言之,將所有三個屬性( noopenernoreferrernofollow )添加到鏈接中會告訴 Google 您是:

  • 願意保護您的網站用戶免受潛在的惡意外部鏈接( noopener
  • 不願意在網站的分析數據中顯示為推薦流量( noreferrer
  • 不願認可您鏈接到的內容或創作者 ( nofollow )

nofollow屬性似乎相當具體,因此您可能只想根據具體情況使用它,而不是作為一般規則。 許多博客將他們的評論部分設置為nofollow以避免來自機器人和不參與對話的人的垃圾評論。

何時使用“noopener noreferrer”

您希望您的網站對訪問者盡可能安全。 因為您想構建和利用強大的反向鏈接策略,所以您不會一直使用rel=”noopener noreferrer” 。 例如,在鏈接到您網站的內部頁面時,您應該避免使用它。

使用rel=”noopener noreferrer”告訴 Google 您關心鏈接安全。 而且您不希望某些網站將您的網站識別為推薦人。

“noopener noreferrer”對 SEO 的總體影響

當您在外部鏈接中使用rel=”noopener noreferrer”屬性時,這不會對您的 SEO 反向鏈接策略產生直接負面影響。 這兩個屬性都不會導致您的技術 SEO 排名受到影響。 事實上,在target=”_blank”旁邊使用noopener將提供更好的頁面搜索引擎優化,因為用戶將留在您的網站上,即使他們導航到另一個網站。

但是, noreferrer會阻止 Google 識別您何時鏈接到其他人的網站。 而且,其他網站所有者將無法看到您何時鏈接到他們。

這意味著您正在消除互惠鏈接的可能性。 畢竟,如果您沒有讓網站所有者在他們檢查分析時查看您的推薦流量的選項,他們就無法知道它來自您。

不能保證從其他地方反向鏈接到您的網站。 儘管如此,盡可能多地連接您喜歡的網站和內容並沒有什麼壞處。 不過,一般來說,在您的外部鏈接中使用rel=”noopener noreferrer”不會造成任何傷害。 當您使用內部鏈接時,請確保不要在您自己的網站頁面上使用它們。 這樣做可能會導致您自己的網站分析以及 Googlebot 抓取和索引您的網站結構出現問題。

結論

現在您知道如何在您的網站上使用rel=”noopener noreferrer” ,是時候進行相應的計劃了。 如果需要,請考慮創建包含在您網站上的外部鏈接的電子表格。 此外,跟踪他們所在的頁面以及您應用到他們的屬性。 這樣做有助於快速參考,以防您將來需要進行更改。

你在你的超鏈接中使用 rel=”noopener noreferrer” 嗎? 為什麼或者為什麼不? 給我們留言,讓我們知道您的想法。

通過 Sammby / shutterstock.com 的特色圖片