Was ist "target blank"?
Das HTML-Attribut "target blank" ist ein leistungsstarkes Tool, mit dem du die Sicherheit und Benutzerfreundlichkeit beim Umgang mit externen Links auf deiner Website erheblich verbessern kannst.
Wie funktioniert "target blank"?
Wenn du den Wert "target blank" für einen Link festlegst, bewirkt dies, dass beim Anklicken des Links eine neue Registerkarte oder ein neues Fenster im Browser des Benutzers geöffnet wird. Die verlinkte externe Seite wird in dieser neuen Registerkarte oder diesem neuen Fenster geladen, anstatt die aktuelle Seite zu überschreiben.
Vorteile von "target blank"
Die Verwendung von "target blank" bietet dir mehrere entscheidende Vorteile:
- Erhöhte Sicherheit: Externe Links können dich und deine Benutzer böswilligen Websites oder Phishing-Angriffen aussetzen. Indem du "target blank" verwendest, kannst du diese Bedrohungen minimieren, da die externen Seiten in einer isolierten Umgebung geöffnet werden.
- Verhinderung unerwünschter Ereignisse: Popups und unerwartetes Verhalten können deine Benutzer frustrieren. Durch das Öffnen externer Links in einem neuen Fenster oder einer neuen Registerkarte verhinderst du solche Probleme.
- Kontrolle über das Surfverhalten: Wenn Benutzer auf externe Links klicken, verlässt dich in der Regel die Kontrolle über ihr Surferlebnis. Mit "target blank" kannst du sie jedoch auf deiner Website halten und ihre Interaktion mit externen Inhalten überwachen.
Warum "target blank" verwenden?
Wenn du externe Links auf deiner Website einfügst, möchtest du sicherstellen, dass sie sicher sind und deine Benutzer nicht gefährden. "target blank" ist ein praktisches HTML-Attribut, das dabei helfen kann, die Sicherheit externer Links zu verbessern.
Verbesserte Benutzererfahrung
Durch die Verwendung von "target blank" wird der externe Link in einem neuen Tab oder Fenster geöffnet. Dies hat mehrere Vorteile:
- Keine Unterbrechung des Surferlebnisses: Deine Benutzer können den externen Link aufrufen, ohne deine Website verlassen zu müssen.
- Kontrolle über das Surfverhalten: Deine Benutzer haben die volle Kontrolle über das neue Fenster oder den neuen Tab und können ihn jederzeit schließen oder zur vorherigen Seite zurückkehren.
Verhinderung unerwünschten Verhaltens
Manche externe Websites können unerwartetes Verhalten auslösen, z. B. Popups oder Weiterleitungen. Durch die Verwendung von "target blank" kannst du verhindern, dass diese unerwünschten Aktionen deine Website beeinträchtigen.
Schutz vor bösartigen Websites und Phishing-Angriffen
Bösartige Websites und Phishing-Angriffe können deine Besucher gefährden. Durch Öffnen externer Links in einem neuen Tab oder Fenster kannst du dicherstellen, dass diese Websites keinen Zugriff auf die Sitzungscookies oder andere sensible Informationen deiner Besucher haben.
Verhinderung von Popups und unerwartetem Verhalten
Beim Anklicken externer Links ohne "target blank" riskierst du, dass sich unerwünschte Popups oder neue Tabs öffnen, die dich ablenken oder sogar schädliche Inhalte enthalten können. Durch die Verwendung von "target blank" unterdrückst du dieses unerwartete Verhalten.
Popups blockieren
Popups können das Surferlebnis stören und die Produktivität beeinträchtigen. Durch die Verwendung von "target blank" werden Popups, die von externen Websites generiert werden, blockiert. So kannst du dich auf die aktuelle Website konzentrieren, ohne von unerwünschten Ablenkungen unterbrochen zu werden.
Neue Tabs kontrollieren
Wenn du auf einen externen Link ohne "target blank" klickst, öffnet sich möglicherweise ein neuer Tab. Dies kann unbeabsichtigte Folgen haben, wenn du mehrere Tabs gleichzeitig geöffnet hast. Durch die Verwendung von "target blank" kannst du festlegen, dass externe Links immer in einem neuen Tab geöffnet werden, sodass du die Kontrolle über dein Surfverhalten behältst.
Unerwünschtes Verhalten verhindern
Die Verwendung von "target blank" hilft außerdem, unerwünschtes Verhalten von externen Websites zu unterbinden. Beispielsweise kann eine Website verlangen, dass du dich anmeldest oder eine Umfrage ausfüllst, bevor du auf den eigentlichen Inhalt zugreifen kannst. Durch die Verwendung von "target blank" kannst du dieses unerwünschte Verhalten umgehen und direkt zum gewünschten Inhalt gelangen.
Erhalten der Kontrolle über das Surfverhalten der Benutzer
Mithilfe von "target blank" erhältst du als Website-Betreiber die Kontrolle über das Surfverhalten deiner Benutzer, wenn sie auf externe Links klicken. Dies bietet dir folgende Vorteile:
Trennung von Sitzungen
Wenn du "target blank" verwendest, werden externe Links in einem neuen Browser-Tab oder -Fenster geöffnet. Dadurch wird eine Trennung zwischen deiner Website und der externen Site hergestellt, auf die der Benutzer zugreift. Dies trägt dazu bei, die Sicherheit deiner eigenen Website zu gewährleisten und mögliche Cross-Site-Scripting (XSS)-Angriffe zu verhindern.
Verfolgung von Besucherinteraktionen
Mit "target blank" kannst du nachverfolgen, wie Benutzer mit externen Links interagieren, ohne deine eigenen Website-Analysen zu beeinträchtigen. Du kannst Tools wie Google Analytics verwenden, um zu erfahren, auf welche externen Links geklickt wird, wie lange Benutzer auf diesen Websites bleiben und welche Aktionen sie dort ausführen. Diese Informationen können wertvolle Erkenntnisse über das Verhalten deiner Benutzer liefern und dir helfen, deine Website und Marketingstrategien zu optimieren.
Steuerung der Back-Button-Navigation
Wenn Benutzer auf externe Links klicken, die in einem neuen Fenster oder Tab geöffnet werden, können sie über die Schaltfläche "Zurück" zu deiner Website zurückkehren. Dies kann für Benutzer, die zu deiner Website zurückgelangen möchten, ohne durch den Linkpfad navigieren zu müssen, von Vorteil sein.
Benutzerfreundlichkeit verbessern
Das Öffnen externer Links in einem neuen Tab oder Fenster kann die Benutzerfreundlichkeit verbessern, indem es Benutzern ermöglicht, externe Inhalte zu erkunden, ohne deine Website zu verlassen. Dies kann zu längeren Sitzungsdauern und verbesserter Benutzerzufriedenheit führen.
Verbesserung der Benutzererfahrung beim Verlassen der Website
Wenn du auf einen externen Link klickst, der in einem neuen Tab geöffnet wird, verlässt du effektiv die aktuelle Website. Dies kann zu einer Unterbrechung der Benutzererfahrung führen, insbesondere wenn du zu der Website zurückkehren möchtest, die du gerade verlassen hast.
Vermeiden von Desorientierung
Indem du "target blank" verwendest, stellst du sicher, dass externe Links in einem neuen Tab geöffnet werden, ohne dass die aktuelle Seite geschlossen wird. Dies ermöglicht es dir, mehrere Websites gleichzeitig zu öffnen und zwischen ihnen zu wechseln, ohne dich zu verlieren.
Einfaches Zurückkehren zur vorherigen Seite
Wenn du "target blank" verwendest, wird auf der aktuellen Seite ein Zurück-Button angezeigt, mit dem du problemlos zur vorherigen Seite zurückkehren kannst. Dies erspart dir lästiges Scrollen oder die Suche nach dem Tab mit der vorherigen Seite.
Verbesserte Leseerfahrung
Durch das Öffnen von externen Links in neuen Tabs kannst du dich auf den aktuellen Inhalt konzentrieren, ohne von unerwünschten Popups oder Werbung abgelenkt zu werden. Dies verbessert die Lesbarkeit und das Gesamterlebnis beim Durchstöbern von Websites.
Implementierung von "target blank" in HTML
Um "target blank" zu implementieren, musst du das <a>-Tag in deinem HTML-Code modifizieren. Führe die folgenden Schritte aus:
Hinzufügen des target-Attributs
Füge das target-Attribut zum <a>-Tag hinzu. Der Wert des Attributs sollte "blank" sein, z. B.:
<a href="https://example.com" target="blank">Linktext</a>
Hinzufügen des rel-Attributs
Zusätzlich zum target-Attribut empfehle ich das Hinzufügen des rel-Attributs mit dem Wert "noopener". Dies schützt vor Cross-Site-Scripting (XSS)-Angriffen, indem verhindert wird, dass sich die neue Registerkarte im selben Fenster wie deine Website öffnet:
<a href="https://example.com" target="blank" rel="noopener">Linktext</a>
Beispielcode
Hier ist ein vollständiges Beispiel für einen HTML-Code mit einem Link, der "target blank" mit dem rel-Attribut verwendet:
<p>Besuche unsere <a href="https://www.google.com" target="blank" rel="noopener">offizielle Website</a> für weitere Informationen.</p>
Überlegungen
- Überprüfe immer, ob das von dir verwendete Content Management System (CMS) die Implementierung von "target blank" unterstützt.
- Denke daran, die Größe und Position des neuen Fensters zu steuern, indem du das
width– undheight-Attribut im<a>-Tag angibst. - Ersetze den Platzhaltertext "Linktext" durch den gewünschten Linktext.
Best Practices für die Verwendung von "target blank"
Um die Sicherheit und Benutzerfreundlichkeit externer Links zu maximieren, beachte die folgenden bewährten Methoden:
Verwende screenreaderfreundliche Linktexte
Verwende beschreibende Linktexte, die screenreader-benutzern den Inhalt des Ziels ankündigen. Vermeide allgemeine Begriffe wie "hier klicken" oder "mehr erfahren".
Öffne neue Tabs nur für relevante Links
Öffne externe Links nur in neuen Tabs, wenn sie zu einer ganz neuen Domain oder einem erheblichen Inhaltswechsel führen. Vermeide es, für kleine Popups oder unwichtige Inhalte neue Tabs zu öffnen.
Achte auf die Platzierung der externen Links
Platziere externe Links deutlich sichtbar, um zu verhindern, dass Benutzer darauf klicken, ohne zu wissen, wohin sie führen.
Verwende rel="noopener" und rel="noreferrer"
Füge rel="noopener" und rel="noreferrer" zu deinen -Tags hinzu. Dies verhindert, dass die Zielseite auf das Fenster der ursprünglichen Seite zugreifen oder Referrer-Informationen weitergeben kann.
Implementiere einen Sicherheitscheck für externe Links
Implementiere einen Sicherheitscheck, um bösartige oder verdächtige URLs zu identifizieren und zu blockieren. Dies kann durch die Integration von Web Reputation Services oder die Verwendung von Browser-Erweiterungen wie Web of Trust erreicht werden.
Testen in verschiedenen Browsern
Teste deine Website in verschiedenen Browsern, um sicherzustellen, dass "target blank" wie erwartet funktioniert. Unterschiedliche Browser haben möglicherweise unterschiedliche Sicherheitsfunktionen und Verhaltensweisen.
Häufige Fehler bei der Verwendung von "target blank"
Bei der Verwendung von "target blank" können einige Fehler auftreten, die zu Sicherheitsrisiken oder einer schlechten Benutzererfahrung führen können. Hier sind einige häufige Fehler, auf die du achten solltest:
Übermäßige Verwendung von "target blank"
Vermeide es, "target blank" für alle externen Links auf deiner Website zu verwenden. Das kann zu Verwirrung führen, da Benutzer erwarten, dass sie in einem neuen Tab geöffnet werden, auch wenn es nicht notwendig ist. Nutze "target blank" nur für Links, die wirklich in einem neuen Tab geöffnet werden müssen, z. B. für externe Ressourcen oder Social-Media-Profile.
Fehlende Rel-Attribute
Vergiss nicht, das rel="noopener"-Attribut für alle Links mit "target blank" hinzuzufügen. Dieses Attribut verhindert, dass die Zielseite Skripte oder Fensteropener auf der ursprünglichen Seite ausführen kann, was Sicherheitsrisiken mindert.
Zielseite nicht überprüft
Überprüfe die Zielseite sorgfältig, bevor du sie mit "target blank" öffnest. Stelle sicher, dass sie vertrauenswürdig ist und keine Malware oder Phishing-Angriffe enthält. Eine Möglichkeit, dies zu tun, ist die Verwendung eines Dienstes wie Google Safe Browsing.
Verwendung von "target blank" für interne Links
Verwende "target blank" nicht für interne Links auf deiner eigenen Website. Das kann zu Problemen mit der Navigation und der Benutzererfahrung führen, da Benutzer möglicherweise nicht erwarten, dass sich die aktuelle Seite ändert.
Schlechte Implementierung
Stelle sicher, dass du "target blank" ordnungsgemäß in deinen HTML-Code implementierst. Achte darauf, dass das target-Attribut korrekt geschrieben ist und der richtige Wert zugewiesen ist.