Was ist rel="noopener" in WordPress? (Erklärt)

Wir haben einmal einem Nutzer geholfen, dessen Besucher nach dem Klicken auf normale externe Links auf unsichere Websites umgeleitet wurden. Der Schuldige war ein winzig kleiner fehlender Code-Schnipsel, der ein Sicherheitsrisiko darstellte.

Es ist völlig normal, neugierig oder sogar ein wenig verwirrt zu sein, wenn Sie technischen Jargon wie rel="noopener" in Ihrem Editor sehen. Sie fragen sich vielleicht, was er tut und ob Ihre Website ihn braucht.

Glücklicherweise müssen Sie kein Entwickler sein, um Ihre Website sicher zu halten. Unser Team bei WPBeginner hat Tausende von Websites gesichert, und wir wissen genau, wie wir diese Hintergrundeinstellungen handhaben.

Schauen wir uns an, was dieses kleine Textattribut tatsächlich tut und wie es Ihre Leser schützt. Keine Sorge, das Hinzufügen von rel="noopener" ist für Ihre Website-Besucher völlig unsichtbar. Es ändert nicht die Farbe Ihrer Links oder wie schnell sich der neue Tab öffnet. Es funktioniert nur im Hintergrund.

Was ist rel=”noopener” in WordPress?

Wenn Sie Links zu Ihrer WordPress-Website hinzufügen, können Sie HTML-Attribute verwenden, um zu steuern, was passiert, wenn Sie auf den Link klicken.

Wenn Sie beispielsweise einen Link erstellen, gibt es einen Schalter, mit dem Sie ihn in einem neuen Tab öffnen können.

Beachten Sie, dass dem Link ein HTML-Attribut hinzugefügt wurde: rel="noopener". Dieses Attribut wird hinzugefügt, um eine Sicherheitslücke zu beheben.

<a href="http://example.com" target="_blank" rel="noopener">external link</a>

Wenn Sie target="_blank" verwenden, um einen Link in einem neuen Tab zu öffnen, passiert standardmäßig etwas potenziell Unerwartetes im Hintergrund. Der neue Tab erhält tatsächlich eine Art Verbindung zurück zum ursprünglichen Tab, auf dem Sie sich gerade befanden.

Diese Verbindung wird über etwas in Webbrowsern namens window.opener hergestellt. Die Seite im neuen Tab kann auf bestimmte Eigenschaften des ursprünglichen Tabs zugreifen und diese sogar steuern, z. B. die Adresse der Seite ändern (window.opener.location).

Dies schafft eine Sicherheitslücke, die als „Reverse Tabnabbing“ bekannt ist.

Stellen Sie sich vor, Sie klicken auf einen Link auf einer vertrauenswürdigen Website und diese öffnet eine bösartige Seite in einem neuen Tab. Aufgrund dieser window.opener Verbindung könnte diese bösartige Seite die ursprüngliche vertrauenswürdige Seite, die Sie gerade angesehen haben, potenziell in eine gefälschte Anmeldeseite (ein Phishing-Betrug) ändern und Sie täuschen, wenn Sie zum ursprünglichen Tab zurückkehren.

Das noopener Link-Attribut soll dieses spezifische Sicherheitsrisiko verhindern.

Wenn Sie rel=\"noopener\" zu einem Link hinzufügen, der sich in einem neuen Tab öffnet, weisen Sie den Browser an, keine window.opener-Verbindung zwischen den beiden Tabs herzustellen. Dies schützt Ihre Benutzer vor Betrug und Phishing-Versuchen.

Wie wirkt sich rel=\"noopener\" auf Ihr WordPress-SEO aus?

Tut es nicht.

Obwohl das Attribut rel="noopener" die Sicherheit Ihrer WordPress-Site verbessert, vermeiden einige Benutzer die Verwendung, da sie glauben, dass es sich auf das WordPress-SEO auswirkt.

Aber das ist nur ein Mythos.

Es hat keine Auswirkungen auf die SEO-Rankings Ihrer Website oder Ihre allgemeine WordPress-Leistung.

Was ist der Unterschied zwischen „noopener“ und „nofollow“?

Es ist leicht, rel="noopener" mit rel="nofollow" zu verwechseln. Sie sind jedoch völlig getrennte Attribute.

Das noopener-Attribut schützt Ihre Website vor Cross-Site-Hacking und verbessert die WordPress-Sicherheit.

Auf der anderen Seite verhindert das nofollow-Attribut, dass Ihre Website SEO-Link-Juice an die verlinkte Website weitergibt.

Suchmaschinen suchen nach dem nofollow-Attribut und berücksichtigen es, wenn sie einem Link auf Ihrer Website folgen. Sie berücksichtigen jedoch das noopener-Tag überhaupt nicht.

Das nofollow-Attribut weist Suchmaschinen an, keine SEO-Autorität an die Website weiterzugeben, zu der Sie verlinken. Während der WordPress-Blockeditor über einen integrierten Schalter verfügt, um einem Link nofollow hinzuzufügen, ist für eine erweiterte Steuerung oft ein Plugin erforderlich.

Sie möchten beispielsweise möglicherweise automatisch das nofollow-Tag auf alle externen Links auf Ihrer Website anwenden, und hier wird ein SEO-Plugin unerlässlich.

Um mehr zu erfahren, lesen Sie unseren Artikel darüber, wie Sie Titel und NoFollow zu Links in WordPress hinzufügen.

Beeinflusst rel="noreferrer" Affiliate-Links in WordPress?

In älteren Versionen von WordPress wurde auch ein rel="noreferrer"-Tag automatisch zu Links hinzugefügt. Während die meisten Affiliate-Programme URL-Parameter verwenden (was bedeutet, dass sie nicht betroffen waren), versteckte der noreferrer-Tag gelegentlich Tracking-Daten aus Affiliate-Dashboards und Analyse-Tools.

Aus diesem Grund hat WordPress den noreferrer-Tag in Version 5.3.1 entfernt. Sie müssen sich keine Sorgen mehr machen, dass er Ihre Affiliate-Links beeinträchtigt.

Zweitens verwenden die meisten Affiliate-Vermarkter ein Link-Cloaking-Plugin für ihre Affiliate-Links.

Beim Link-Cloaking ist der Affiliate-Link, auf den Ihre Benutzer klicken, tatsächlich die eigene URL Ihrer Website, die dann Benutzer zur Ziel-URL weiterleitet.

Wie deaktiviert man rel=”noopener” in WordPress?

Es ist nicht notwendig, rel="noopener" aus Links auf Ihrer Website zu entfernen. Es ist gut für die Sicherheit Ihrer Website und hat keine Auswirkungen auf die Leistung oder das SEO Ihrer Website.

Wenn Sie es unbedingt entfernen müssen, müssen Sie den Gutenberg-Blockeditor in WordPress deaktivieren und den klassischen Editor verwenden.

Das liegt daran, dass, wenn Sie rel="noopener" manuell aus dem Link entfernen, der Blockeditor ihn automatisch wieder hinzufügt, um Ihre Website sicher zu halten.

Sobald der Blockeditor deaktiviert ist, müssen Sie einen Code-Snippet zur functions.php-Datei Ihres Themes oder zum WPCode-Plugin (empfohlen) hinzufügen. Sie können lernen, wie Sie das WPCode Free Plugin in unserem Leitfaden verwenden, wie Sie benutzerdefinierten Code einfach in WordPress hinzufügen.

Kopieren Sie einfach den folgenden Code in einen neuen PHP-Snippet:

add_filter('tiny_mce_before_init','wpb_disable_noopener');
function wpb_disable_noopener( $mceInit ) {
    $mceInit['allow_unsafe_link_target']=true;
    return $mceInit;
}

Stellen Sie sicher, dass Sie den Schalter „Aktiv“ umlegen und dann auf die Schaltfläche „Snippet speichern“ klicken.

Dies verhindert, dass WordPress rel="noopener" zu neuen Links hinzufügt. Sie müssen auch alle alten Links manuell bearbeiten, um das Attribut zu entfernen.

Für noch mehr Kontrolle über die Attribute Ihrer Links, ohne den HTML-Code zu berühren, empfehlen wir die Verwendung des Plugins All in One SEO (AIOSEO).

Während WordPress die Sicherheit automatisch handhabt, können Sie mit AIOSEO ganz einfach SEO-Attribute wie nofollow oder sponsored direkt im Link-Popup des Blockeditors hinzufügen und so Ihre externen Links für SEO-Best-Practices verwalten.

Häufig gestellte Fragen zu rel=”noopener”

Hier sind Antworten auf einige der häufigsten Fragen, die wir zum „noopener“-Attribut in WordPress erhalten.

1. Was ist der Hauptzweck der Verwendung von rel=”noopener”?

Der Hauptzweck von rel="noopener" ist die Sicherheit. Es verhindert, dass eine neue Registerkarte die ursprüngliche Registerkarte, die sie geöffnet hat, steuern kann, was Ihre Besucher vor bösartigen Phishing-Betrügereien schützt.

2. Ist rel=”noopener” gut für SEO?

Das rel="noopener"-Attribut hat keinen direkten Einfluss, weder positiv noch negativ, auf die SEO Ihrer Website. Seine Funktion ist rein sicherheitsbezogen, und Suchmaschinen verwenden es nicht als Rankingfaktor.

3. Sollte ich rel=”noopener” von meinen Links entfernen?

Nein, es gibt keinen guten Grund, rel="noopener" zu entfernen. Es bietet einen wichtigen Sicherheitsvorteil ohne negative Auswirkungen auf SEO oder die Leistung der Website, daher ist es am besten, es beizubehalten.

4. Fügt WordPress automatisch rel=”noopener” hinzu?

Ja, WordPress fügt automatisch rel="noopener" zu Links hinzu, die so eingestellt sind, dass sie sich in einem neuen Tab öffnen. Diese wichtige Sicherheitsfunktion wurde erstmals in WordPress 4.7.4 eingeführt und ist ein Standardbestandteil des modernen Block-Editors.

Zusätzliche Ressourcen zur Verwendung von Links in WordPress

Wir hoffen, dieser Artikel hat Ihnen geholfen, mehr über rel="noopener" in WordPress zu erfahren. Möglicherweise möchten Sie auch einige andere Anleitungen zur Verwendung von Links in WordPress sehen:

• Leitfaden für Anfänger: So fügen Sie einen Link in WordPress hinzu
• Externe Links in WordPress in einem neuen Fenster oder Tab öffnen
• So fügen Sie Nofollow-Links in WordPress hinzu (einfacher Leitfaden für Anfänger)
• Titel und NoFollow zum Popup „Link einfügen“ in WordPress hinzufügen
• So machen Sie alle externen Links in WordPress zu Nofollow
• So verfolgen Sie Link-Klicks und Button-Klicks in WordPress (einfache Methode)
• Outbound-Links in WordPress verfolgen
• So ändern Sie die Linkfarbe in WordPress (Anfängerleitfaden)
• Interne Verlinkung für SEO: Der ultimative Leitfaden mit Best Practices
• Links in WordPress vorladen für schnellere Ladezeiten
• So finden und beheben Sie defekte Links in WordPress (Schritt für Schritt)
• Die besten internen Verknüpfungs-Plugins für WordPress (automatisch + manuell)

Wenn Ihnen dieser Artikel gefallen hat, abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Video-Tutorials. Sie finden uns auch auf Twitter und Facebook.