Zum Hauptinhalt springen

Wie man einen Link erstellt, der in einem neuen Tab geöffnet wird: Detaillierte Anleitung

Links webseiten spielen eine Schlüsselrolle beim Aufbau einer Beziehung zwischen verschiedenen Abschnitten und Internetressourcen. Sie ermöglichen es Benutzern, von einer Seite zur anderen zu navigieren, um mehr Informationen zu erhalten. Manchmal ist es erforderlich, einen Link in einem neuen Tab zu öffnen, damit der Benutzer zur ursprünglichen Seite zurückkehren kann. In diesem Artikel werden wir uns ansehen, wie Sie einen Link einfach in einem neuen Tab öffnen können.

Der einfachste Weg um einen Link zu erstellen, der in einem neuen Tab geöffnet wird, fügen Sie ein Attribut hinzu target="_blank" im Tag a. Sie müssen die URL des Links im Attribut angeben href und der gewünschte Linktext zwischen den Tags a. Zum Beispiel wird ein solcher Link in einem neuen Tab geöffnet: Beispiellink.

Wenn Sie einen HTML-Editor verwenden oder ein Content-Management-System wie WordPress, ein Bearbeitungsfeld mit Tags a und href sollte für Sie verfügbar sein. Geben Sie einfach die URL des Links in das Attribut ein href umgeben Sie es mit einem Tag a und fügen Sie ein Attribut hinzu target="_blank". Einige Editoren haben auch eine Option, um den Linktext anzugeben.

Grundprinzipien für die Erstellung eines Links

Das Erstellen eines Links, der in einem neuen Tab geöffnet wird, ist sehr einfach. Fügen Sie dazu dem Tag das Attribut target="_blank" hinzu. Dieses Attribut gibt dem Browser an, dass der Link in einem neuen Tab geöffnet werden soll.

Im folgenden Beispielcode wird veranschaulicht, wie ein Link mit dem Attribut target="_blank" erstellt wird :

Beachten Sie, dass das Attribut target="_blank" zu jedem Link hinzugefügt werden kann und unabhängig von der Ziel-URL in einem neuen Tab geöffnet wird. Dies ist besonders praktisch, wenn Sie möchten, dass Benutzer auf Ihrer Website bleiben, indem Sie externe Links öffnen.

Wichtig ist, dass beim Erstellen von Links, die in einem neuen Tab geöffnet werden, das Attribut rel="noopener noreferrer" wichtig ist, um zu verhindern, dass ein Angriff über einen offenen Link möglich ist.

Eine gültige Referenzoption mit Attributen target="_blank" rel="noopener noreferrer" sieht folgendermaßen aus:

Festlegen des Target-Attributs zum Öffnen eines Links in einem neuen Tab

In HTML gibt es ein target-Attribut, mit dem Sie angeben können, wie ein Link geöffnet wird, wenn Sie darauf klicken. Wenn Sie den Wert target="_blank" festlegen, wird der Link in einem neuen Browser-Tab geöffnet. Dies ist sehr nützlich, wenn Sie dem Benutzer die Möglichkeit geben müssen, einen externen Link anzuzeigen, ohne Ihre Website zu verlassen. So können Sie dieses Attribut verwenden:

  1. Erstellen Sie ein Tag , das Ihren Link darstellt. Zum Beispiel: Ein externer Link .
  2. Legen Sie den Wert des href-Attributs auf die URL fest, auf die verwiesen werden soll.
  3. Legen Sie den Wert des target-Attributs auf "_blank" fest. Dies weist den Browser an, den Link in einem neuen Tab zu öffnen.
  4. Fügen Sie Text hinzu, der als Link angezeigt wird. Zum Beispiel: "Externer Link".

Beispiel für die Verwendung des Target-Attributs mit dem Wert "_blank"

Hinzufügen eines Rel-Elements zur Verbesserung der Linkverfügbarkeit

Wenn Sie möchten, dass der Link in einem neuen Tab geöffnet wird, müssen Sie dem Tag das Attribut target="_blank" hinzufügen. Wenn Sie dieses Attribut verwenden, hat der Benutzer jedoch möglicherweise ein Problem mit der Verfügbarkeit des Links, da er möglicherweise nicht weiß, dass er in einem neuen Tab geöffnet wird. Es wird empfohlen, ein rel-Element mit dem noopener-Attribut hinzuzufügen, um die Linkverfügbarkeit zu verbessern:

  • rel="noopener" - Verhindert eine Sicherheitsanfälligkeit im Zusammenhang mit dem Zugriff auf das window-Objekt.opener

Zusätzliche Einschränkungen und Empfehlungen beim Erstellen eines Links

1. Vermeiden Sie die Verwendung von JavaScript: Obwohl die Verwendung von JavaScript zum Öffnen eines Links in einem neuen Tab zunächst wie eine der einfachsten Lösungen erscheinen mag, ist es erwähnenswert, dass viele Benutzer JavaScript in ihren Browsern deaktivieren und Ihr Link möglicherweise nicht funktioniert.

2. Fügen Sie das target-Attribut hinzu: Um einen Link in einem neuen Tab zu öffnen, müssen Sie dem Anker-Tag ein target-Attribut mit dem Wert "_blank" hinzufügen. Zum Beispiel:

3. Missbrauchen Sie das Öffnen neuer Tabs nicht: Es ist wichtig, sich daran zu erinnern, dass das Öffnen von Links in neuen Tabs für Benutzer ärgerlich sein kann, besonders wenn sie dies nicht erwarten. Versuchen Sie, die Verwendung des Öffnens neuer Tabs nur dann einzuschränken, wenn dies erforderlich ist und den Erwartungen der Benutzer entspricht.