Links absichern mit Rel Noopener

Inhaltsverzeichnis
Inhaltsverzeichnis

Du hast sicherlich schon von verschiedenen HTML-Attributen gehört, die dazu dienen, die Sicherheit und Funktionalität Deiner Webseite zu verbessern. Eines dieser Attribute, das in letzter Zeit an Bedeutung gewonnen hat, ist „rel=noopener.“ Doch was bedeutet dieses Attribut eigentlich und wie trägt es dazu bei, Deine Webseite zu schützen und zu optimieren?

 

https://www.istockphoto.com/de/foto/programmierung-code-abstrakte-technik-hintergrund-der-software-entwickler-und-gm1224500457-360073975?phrase=html

Was bedeutet Rel Noopener?

Bei „Rel Noopener“ handelt es sich um ein HTML-Attribut, das in den Link-Elementen einer Webseite verwendet wird. Das Attribut „rel“ steht für „relationship“ (Beziehung), während „noopener“ eine Kombination der Worte „no“ (nein) und „opener“ (Öffner) ist. Zusammen bedeutet dies so viel wie „kein Öffner“.

 

Um zu verstehen, wie dieses Attribut funktioniert, werfen wir zunächst einen Blick auf den Aufbau eines HTML-Links. Fügst Du einen Link in den Inhalt Deiner Website ein und verwendest Du dabei das Attribut „target=_blank rel=noopener“, signalisierst Du dem Browser, den Link in einem neuen Browser Tab zu öffnen, während Deine Website in einem eigenen Tab geöffnet bleibt.

 

Das „rel“-Attribut im Anker-Tag definiert die Beziehung zwischen Deiner aktuellen Website und den Verlinkungen. „Rel-Noopener“ wird also verwendet, wenn Du möchtest, dass ein Link in einem neuen Fenster oder Tab geöffnet wird. Die gleiche Wirkung kannst Du auch mit dem Attribut „rel=noreferrer“ erzielen.

 

Diese Attribute wurden in erster Linie als effektive Sicherheitsmaßnahme entwickelt, um die Sicherheit Deiner Website zu erhöhen. Mithilfe von JavaScript könnten externe, bösartige Links versuchen, auf digitale Informationen Deiner Besucher zuzugreifen, indem sie in demselben Browserprozess wie Deine Seite laufen. Durch das Hinzufügen von „rel=noopener“ und „rel=noreferrer“ zu Deinen gesetzten Links verhinderst Du also, dass der neue Browser Tab die JavaScript Funktion „window.opener“ nutzen kann, um auf Informationen zuzugreifen.

Wie verändert Rel Noopener Deine Webseite?

Die Verwendung des „rel“-Attributs hat unterschiedliche Auswirkungen auf Deine Website – sei es „rel-noopener“ oder „rel-noreferrer“. Allen voran steigen die Sicherheitsaspekte Deiner Website, die durch die Verwendung des Attributs erhöht wird. Dennoch bestehen oft Bedenken, dass sich diese Attribute negativ auf das organische SERP-Ranking auswirken könnten. Dies ist jedoch nicht der Fall.

 

So solltest Du wissen, dass dieses Attribut keinerlei Einfluss auf das SEO-Ranking Deiner Website hat. Weder Suchmaschinen noch Analysetools berücksichtigen das „rel“-Attribut bei der Bewertung Deiner Website. Es gibt dem Browser lediglich die Anweisung, die Verwendung des JavaScript-Objekts „window.opener“ zu unterbinden und einen neuen Prozess zur Verarbeitung zu erstellen.

 

Stattdessen schützt es die Privatsphäre Deiner Besucher, wodurch die User Experience verbessert werden kann. Darüber hinaus stärkst Du das Vertrauen Deiner Nutzer, indem Du „rel=noopener“ verwendest. So zeigst Du Deinen Besuchern, dass Du ihre Sicherheit ernst nimmst und entsprechende Maßnahmen ergreifst, um sie vor potenziellen Gefahren zu schützen.

Die Nuancen von Rel Noopener verstehen

Bei der Verwendung des Attributs solltest Du zunächst beachten, dass „rel=noopener“ nicht für alle Links auf Deiner Webseite geeignet ist. In vielen Fällen ist es sinnvoll, diesen Tag bei externen Links zu verwenden, um die Sicherheit zu erhöhen. Bei internen Links, die innerhalb Deiner eigenen Webseite bleiben, ist die Verwendung von „rel=noopener“ in der Regel jedoch nicht erforderlich.

 

Zudem werden die Attribute „noopener“ und „nofollow“ häufig miteinander verwechselt, wobei es sich hierbei tatsächlich um zwei völlig separate Konzepte handelt. So spielen „noopener“-Attribute eine wichtige Rolle beim Schutz vor Cross-Site-Hacking und tragen somit zur Sicherheit Deiner Website bei. Verwendest Du hingegen das „nofollow“-Attribut, wird der sogenannte „Link Juice“ Deiner Website nicht an die verlinkte Seite weitergegeben. Die Verbindung, die durch die „nofollow“-Beziehung hergestellt wird, wird von den Suchmaschinen-Crawlern jedoch nicht gewertet oder berücksichtigt.

 

Darüber hinaus gibt es auch das Attribut „rel=noreferrer“, das ähnliche Sicherheitsfunktionen bietet. Die Wahl zwischen „rel=noopener“ und „rel=noreferrer“ hängt dabei von Deinen spezifischen Anforderungen ab.

 

Profitiere von den Vorteilen von Rel Noopener

In einer Zeit, in der die Sicherheit im Internet von entscheidender Bedeutung ist, sollte „rel=noopener noreferrer“ als Anker-Tag auf keinen Fall fehlen. Es ist eine einfache, aber wirkungsvolle Maßnahme, um Deine Webseite und deren Benutzer vor potenziellen Gefahren zu schützen. So verringert es insbesondere die Gefahr eines Cross-Origin-Ressourcenfreigabe-Angriffs (COR). Derartige COR-Angriffe können ausgenutzt werden, indem der Browser Informationen über den ursprünglichen Link beibehält, was es einem Angreifer ermöglicht, das Opfer zu verfolgen.

 

Indem Du die Feinheiten von „rel=noopener noreferrer“ verstehst und diese auf Deiner Webseite implementierst, stärkst Du das Vertrauen Deiner Nutzer und erhöhst die Sicherheit. Daher solltest Du nicht zögern, dieses Attribut für Affiliate Links oder andere Verlinkungen auf Deiner Website zu nutzen und die Sicherheit Deiner Website auf das nächste Level zu heben.

Schütze Dich vor Sicherheitslücken im JavaScript mit rel-Attribut Noopener

Obwohl JavaScript eine gängige und leistungsstarke Programmiersprache ist, die auf zahlreichen Websites verwendet wird, kann diese ein Sicherheitsrisiko darstellen – insbesondere, wenn es in Verbindung mit Links verwendet wird. Indem Du das „rel“-Attribut „noopener“ verwendest, kannst Du diese Sicherheitslücke im JavaScript gezielt schließen. So bietet Dir der JavaScript-Befehl „rel=noopener“ eine einfache Möglichkeit, sich vor potenziellen Sicherheitslücken im JavaScript zu schützen. Um zu verstehen, wie das funktioniert, haben wir hier ein kurzes Beispiel für Dich:

 

Du möchtest Deinen Nutzern durch die Verlinkung einer anderen Website einen Mehrwert bieten, ohne sie dabei von Deiner eigenen Seite zu verlieren. Daher wird der Link mit „target=_blank“ versehen, was den Browser anweist, die verlinkte Website in einem neuen Browser Tab zu öffnen.

 

Im neuen Tab besteht jedoch eine Sicherheitslücke, die von Hackern ausgenutzt werden kann. Diese Lücke basiert auf der JavaScript-Eigenschaft „windows.opener“, die von böswilligen Angreifern missbraucht werden kann, um Nutzer auf falsche Websites umzuleiten oder sogar auf den Quellcode Deiner Website zuzugreifen. Hier kommt schließlich das „rel“-Attribut „noopener“ ins Spiel. Dies schützt nicht nur Deine eigene Website, sondern auch die Besucher vor möglichen Hacker-Angriffen.

 

Wenn Du bereits externe Links ohne „rel=noopener“ auf Deiner Website verlinkt hast, ist es ratsam, nachträglich alle externen Verlinkungen mit diesem Attribut auszustatten. Obwohl dies sehr zeitaufwändig sein kann, ist es entscheidend für die Sicherheit Deiner Website. Einige Content Management Systeme wie WordPress bieten Dir hierfür spezielle Plug-ins an, die die nachträgliche Implementierung von HTML-Attributen erleichtern, wie zum Beispiel das Plugin „Add Target Fixer“.

Verstecke die Herkunft Deiner Links mit rel-Attribut noreferrer

Neben dem Attribut „rel=noopener“ hast Du zusätzlich noch die Möglichkeit, das Attribut „rel=noreferrer“ zu verwenden. Dadurch kann die Herkunft Deiner Links versteckt werden. Das bedeutet, der Betreiber der verlinkten Website kann nicht sehen, dass Nutzer über einen Link auf Deiner Website zur entsprechenden Seite gelangt sind. Anstelle Deiner URL wird in den Analysedaten in diesem Fall nur etwas wie „(direct)/(none)“ angezeigt. Um „rel=noreferrer“ richtig zu verwenden, musst Du das Attribut folgendermaßen in den HTML-Link implementieren:

 

<a href=“https://trustfactory.de/“ target=“_blank“ rel=“noreferrer“>

 

Es ist jedoch nur sinnvoll, „rel=noreferrer“ zu verwenden, wenn Du nicht möchtest, dass andere Websites die Herkunft der Links erkennen können. In der Regel gibt es nur wenige Fälle, in denen das Attribut „noreferrer“ nützlich ist. Besonders im Affiliate-Marketing wäre die Verwendung des Attributs sogar kontraproduktiv, da Du nur eine Provision für vermittelte Kunden erhältst. Kann der Webseiten-Betreiber aber nicht sehen, dass die Kunden über Deinen Link zur Website gelangt sind, wird der Sinn von Affiliate Links verwirkt. Dennoch kann das Attribut „rel=noreferrer“ in wenigen Ausnahmen als zusätzliche Sicherheitsmaßnahme dienen.

Kombiniere HTML-Attribute noopener, noreferrer, nofollow und mehr

Es besteht durchaus die Möglichkeit, verschiedene HTML-Attribute miteinander zu kombinieren. So ist eine Kombination aus „noreferrer“ und „nofollow“ oft sinnvoll. Diese beiden Attribute können beispielsweise kombiniert werden, wenn ein externer Link in einem neuen Browser Tab geöffnet und gleichzeitig vermieden werden soll, dass Crawler die verlinkte Website durchsuchen. Das „nofollow“-Attribut verhindert nämlich das Crawlen der verlinkten Seite, während „noreferrer“ die Weitergabe von Referrer-Informationen unterbindet.

FAQ

Das Attribut „rel=noopener“ schützt Deine neue Seite, auf die von der ursprünglichen Seite aus zugegriffen wird, indem es sicherstellt, dass sie in einem eigenen und isolierten Prozess läuft. Im Gegensatz dazu bewirkt „rel=noreferrer“ dasselbe, verhindert jedoch zusätzlich, dass Referrer-Informationen an die neu geöffnete Seite übertragen werden.

Fazit

Das „rel=noopener“-Attribut ist eine wirkungsvolle Methode, um die Sicherheit Deiner Website zu erhöhen. Dabei ist die Verwendung des Attributs nur sinnvoll, wenn Du externe Links einsetzt, die zu anderen Websites führen. Es schützt sowohl Dich als auch Deine Besucher vor Cross-Site-Hacking-Angriffen und gewährleistet zusätzlich die Privatsphäre Deiner Nutzer.

Ähnliche Artikel

Mit Trustfactory erfolgreich auf Google werden.

Erprobte Maßnahmen, datengetriebene Strategien und ROI-starke Prozesse. Trustfactory ist Deine skalierbare Komplettlösung für nachhaltigen Erfolg auf Google. Mehr Besucher, bessere Reputation und ein positiver News Flow – jetzt SEO-Analyse-Gespräch anfordern:

Finde heraus, welches Potenzial in Deinem SEO steckt.

Trustfacotry Zugang Vector Grafik

Kostenloses Gespräch mit einem SEO-Experten erhalten!