Was bedeutet rel=noopener noreferrer?
Die Attribute rel=noopener und rel=noreferrer werden häufig bei externen Links verwendet, insbesondere in Verbindung mit target=“_blank“. Sie dienen dem Schutz der Website und ihrer Nutzer vor bestimmten Sicherheitsrisiken.
Hintergrund und Aufbau eines HTML-Links
Ein Link, der in einem neuen Tab geöffnet werden soll, wird in HTML so definiert:
<a href="https://example.com" target="_blank">Externer Link</a>Wird dabei jedoch kein noopener oder noreferrer verwendet, kann die Zielseite unter Umständen Zugriff auf das Ursprungsfenster erhalten. Dies geschieht über die JavaScript-Funktion window.opener. Um dies zu verhindern, werden die Attribute rel=noopener und rel=noreferrer empfohlen.
Warum noopener und noreferrer verwenden?
Ohne rel=noopener kann die geöffnete Seite über window.opener das Fenster manipulieren, aus dem sie geöffnet wurde. Das rel=noopener-Attribut verhindert genau das. Es sorgt dafür, dass der neue Tab in einem eigenen Prozess läuft und keinen Zugriff auf das Ursprungsfenster bekommt.
rel=noreferrer geht noch einen Schritt weiter: Es verhindert zusätzlich die Übermittlung von Referrer-Informationen. Das bedeutet, dass die Zielseite nicht erfährt, von welcher Seite der Nutzer kam.
Sicherheit und SEO
Die Verwendung von noopener und noreferrer beeinflusst weder die Sichtbarkeit in den Suchergebnissen noch das Ranking einer Website. Sie haben keinen Einfluss auf die Suchmaschinenoptimierung, sondern sind ausschließlich Sicherheitsfunktionen auf Browserebene.
Unterschied zu rel=nofollow
Oft wird noopener mit nofollow verwechselt. Während rel=nofollow den Linkwert aus SEO-Sicht unterbindet, schützt rel=noopener vor Cross-Site-Scripting und anderen potenziellen Angriffen durch externe Seiten.
Auch rel=noreferrer steht in keinem Zusammenhang zu nofollow. Beide haben eigene Funktionen im Bereich Sicherheit und Datenschutz.
Vorteile von rel=noopener und rel=noreferrer
- Schutz vor unerwünschtem Zugriff durch window.opener
- Erhöhte Datensicherheit durch das Unterdrücken des Referrers
- Verbesserung der Nutzererfahrung durch sicheren Tab-Wechsel
- Keine negativen Auswirkungen auf das Ranking in Suchmaschinen
Mögliche Nachteile
- Manche Tracking-Tools erhalten keine Referrer-Daten bei Verwendung von noreferrer
- In seltenen Fällen kann das Nutzerverhalten leicht beeinflusst werden
Anwendungsbeispiele
- Externer Link mit beiden Attributen:
<a href="https://example.com" target="_blank" rel="noopener noreferrer">Externer Link</a> - Link ohne neuen Tab, aber mit Sicherheit:
<a href="/datenschutz" rel="noopener noreferrer">Datenschutz</a>
Fazit
Die Attribute noopener und noreferrer bieten wichtigen Schutz beim Öffnen externer Links. Sie verhindern den Zugriff auf das Ursprungsfenster und schützen die Privatsphäre der Nutzer durch das Blockieren des Referrers.
In der modernen Webentwicklung gelten rel=noopener und rel=noreferrer als Standard bei allen externen Links mit target=“_blank“. Sie verbessern die Sicherheit ohne negative Effekte auf SEO oder Funktionalität und sollten deshalb konsequent eingesetzt werden.