Links absichern mit Rel Noopener
Nikita YatsunMitgründer & Geschäftsführer
Kurz gesagt
Das HTML-Attribut rel=noopener schützt externe Links mit target=_blank vor Cross-Site-Hacking: Ohne es kann eine verlinkte Seite über window.opener auf die ursprüngliche Seite zugreifen und Besucher umleiten. Mit rel=noopener läuft die neue Seite in einem isolierten Prozess; die Verbindung zur Quellseite wird vollständig unterbunden. Auf das SEO-Ranking hat das Attribut keinen Einfluss.
In diesem Artikel
„Rel Noopener“ ist ein HTML-Attribut für Link-Elemente. Das „rel“-Attribut steht für „relationship“ (Beziehung), während „noopener“ bedeutet „kein Öffner“. Bei Verwendung von target=_blank rel=noopener öffnet sich der Link in einem neuen Browser-Tab, während die ursprüngliche Website separat bleibt.
Das Attribut wurde primär als „effektive Sicherheitsmaßnahme“ entwickelt. Es verhindert, dass externe Links die JavaScript-Funktion „window.opener“ nutzen können, um auf Besucherdaten zuzugreifen.
Wie verändert Rel Noopener Deine Webseite?
Das Attribut hat keinen Einfluss auf das SEO-Ranking. Weder Suchmaschinen noch Analysetools berücksichtigen es bei der Bewertung. Stattdessen:
- Schützt die Privatsphäre von Besuchern
- Verhindert Cross-Site-Hacking
- Stärkt das Vertrauen der Nutzer
Die Nuancen von Rel Noopener verstehen
Das Attribut ist vor allem bei externen Links sinnvoll, nicht bei internen Verlinkungen innerhalb der eigenen Website.
Häufig werden „noopener“ und „nofollow“ verwechselt. Dabei sind es zwei unterschiedliche Konzepte:
- Noopener: Schützt vor Cross-Site-Hacking
- Nofollow: Verhindert die Weitergabe von „Link Juice“ an verlinkte Seiten
Das Attribut „rel=noreferrer“ bietet ähnliche Sicherheitsfunktionen.
Schütze Dich vor Sicherheitslücken im JavaScript mit rel-Attribut Noopener
Externe Links mit target=_blank ohne „rel=noopener“ schaffen eine Sicherheitslücke. Böswillige Angreifer können die „windows.opener“-Eigenschaft missbrauchen, um „Nutzer auf falsche Websites umzuleiten oder sogar auf den Quellcode“ zuzugreifen.
Die Lösung: rel=noopener hinzufügen. WordPress-Nutzer können Plugins wie „Add Target Fixer“ zur nachträglichen Implementierung verwenden.
Verstecke die Herkunft Deiner Links mit rel-Attribut noreferrer
rel=noreferrer verbirgt die Link-Herkunft. Der Betreiber der verlinkten Website sieht dann nur „(direct)/(none)“ statt Deiner URL in den Analysedaten.
Warnung: Im Affiliate-Marketing ist „noreferrer“ kontraproduktiv, da Provisionen von der erkannten Herkunft abhängen.
Kombiniere HTML-Attribute noopener, noreferrer, nofollow und mehr
Diese Attribute lassen sich kombinieren. Eine „Kombination aus noreferrer und nofollow“ ist sinnvoll, um gleichzeitig Referrer-Informationen zu blockieren und das Crawlen zu verhindern.
Fazit
„Rel=noopener“ ist eine wirksame Methode zur Sicherheitserhöhung bei externen Links. Es schützt sowohl die Website als auch Besucher vor Cross-Site-Hacking und gewährleistet Privatsphäre.
Die Vorteile von rel=noopener im Überblick
- Verbesserte Sicherheit: Wenn du
target="_blank"ohnerel="noopener"verwendest, kann die geöffnete Seite Zugriff auf das ursprüngliche Fenster (deine Website) haben. Dies könnte von bösartigen Websites ausgenutzt werden, um deine Seite zu manipulieren oder Benutzerinformationen zu stehlen. Das Hinzufügen vonrel="noopener"verhindert diesen unerwünschten Zugriff. - Schutz vor Tabnapping: Tabnapping ist eine Technik, bei der die Seite im Hintergrund, die von einem neuen Tab aus geöffnet wurde, heimlich geändert werden kann.
rel="noopener"verhindert dies, indem es den geöffneten Tab isoliert und die Kommunikation zwischen den Tabs blockiert. - Erhalt der Benutzererfahrung: Wenn du
rel="noopener"verwendest, können Benutzer sicher sein, dass das Öffnen eines Links in einem neuen Tab ihre aktuelle Sitzung nicht beeinträchtigt. Ohnerel="noopener"könnten unerwünschte Interaktionen zwischen Tabs auftreten. - Geringere Ablenkung: Ohne
rel="noopener"könnten Links, die in neuen Tabs geöffnet werden, die Benutzer von der ursprünglichen Seite ablenken. Mitrel="noopener"können Benutzer sich auf die aktuelle Seite konzentrieren, da die neu geöffneten Tabs isoliert sind. - Bessere SEO-Performance: Suchmaschinen bevorzugen Websites, die eine sichere und benutzerfreundliche Umgebung bieten. Durch die Verwendung von
rel="noopener"zeigst du deine Sorge um die Sicherheit und Benutzerfreundlichkeit, was sich positiv auf das SEO-Ranking auswirken kann.
Häufige Fragen
Was macht rel=noopener und wann brauche ich es?
rel=noopener verhindert, dass eine extern verlinkte Seite über die JavaScript-Eigenschaft window.opener Zugriff auf die verweisende Seite erhält. Du brauchst es immer dann, wenn du externe Links mit target=_blank setzt, also Links, die in einem neuen Tab öffnen. Ohne dieses Attribut entsteht eine Sicherheitslücke.
Was ist der Unterschied zwischen noopener und nofollow?
noopener ist eine Sicherheitsmaßnahme: Es isoliert den neuen Tab vom Ursprungsfenster und verhindert Cross-Site-Hacking. nofollow ist ein SEO-Signal: Es teilt Suchmaschinen mit, dass kein Link Juice an die verlinkte Seite weitergegeben werden soll. Beide Attribute erfüllen völlig unterschiedliche Zwecke und lassen sich kombinieren.
Was ist der Unterschied zwischen rel=noopener und rel=noreferrer?
rel=noopener isoliert den neuen Tab und blockiert den Zugriff über window.opener. rel=noreferrer tut dasselbe, verhindert aber zusätzlich, dass der Betreiber der verlinkten Seite deine URL als Referrer sieht. In seinen Analysedaten erscheint stattdessen nur „(direct)/(none)“. Im Affiliate-Marketing ist noreferrer daher problematisch, da Provisionen von der erkannten Herkunft abhängen.
Hat rel=noopener Auswirkungen auf das SEO-Ranking?
Nein. Das Attribut hat keinen Einfluss auf das SEO-Ranking. Weder Suchmaschinen noch Analysetools berücksichtigen es bei der Bewertung deiner Seite. Es ist ausschließlich eine Sicherheits- und Datenschutzmaßnahme.
Wie setze ich rel=noopener nachträglich auf meiner Website um?
Du ergänzt das Attribut direkt im HTML-Code deiner Links: target=_blank rel=noopener. WordPress-Nutzer können Plugins wie „Add Target Fixer“ verwenden, um bestehende Links nachträglich automatisch anzupassen.
Deine Website technisch sauber aufgestellt?
In der kostenlosen Google-Potenzial-Analyse schauen wir uns gemeinsam an, wo bei deiner Website technische Sicherheitslücken oder SEO-Schwachstellen bestehen. Unverbindlich und ohne Verkaufsdruck.
