Öffnen neuer Tabs erklären

Silktide findet Links, die sich in einem neuen Tab oder Fenster öffnen, und meldet diejenigen, die das nicht ankündigen. Besucher sollten gewarnt werden, bevor ein Link sie von der aktuellen Seite wegführt.

Warum das wichtig ist

Ohne Vorwarnung einen neuen Tab zu öffnen, durchbricht die Erwartungen der Besucher: Die Zurück-Schaltfläche funktioniert nicht mehr wie erwartet, und sie bemerken womöglich gar nicht, dass ein neuer Tab existiert. -Nutzer hören möglicherweise keinen Hinweis auf den Kontextwechsel, und Menschen mit kognitiven Beeinträchtigungen oder geringer Web-Erfahrung können orientierungslos zurückbleiben und nicht wissen, wie sie zurückkehren. Ein paar warnende Worte im Linktext verhindern all das.

Die beste Lösung ist oft, gar keine neuen Tabs zu öffnen – lassen Sie die Besucher selbst entscheiden. Wo es dennoch nötig ist, prüft dieser Check, ob der Link dies ankündigt, im Einklang mit Erfolgskriterium 3.2.5 („Änderung auf Anfrage“), einer -Anforderung.

So beheben Sie das Problem

Entfernen Sie nach Möglichkeit target="_blank", damit sich der Link normal öffnet.
Wenn ein neuer Tab gerechtfertigt ist, fügen Sie dem Linktext eine Erklärung hinzu:

<a href="products.html" target="_blank">
  Produkte (öffnet in neuem Tab)
</a>

Bei einem Bildlink platzieren Sie die Erklärung im :

<a href="products.html" target="_blank">
  <img src="products.jpg" alt="Produkte (öffnet in neuem Tab)">
</a>

Um viele Links auf einmal abzudecken, kann den Text automatisch anhängen:

/* Fügt die Warnung bei jedem Link hinzu, der einen neuen Tab öffnet */
a[target="_blank"]::after {
  content: " (öffnet in neuem Tab)";
}

Alternativ verwenden Sie ein -Label, das die ausgegebene Ansage ändert, ohne das Erscheinungsbild des Links zu verändern. Beachten Sie, dass aria-label den Linktext vollständig ersetzt und ihn daher wiederholen muss:

<a href="products.html" target="_blank" aria-label="Produkte (öffnet in neuem Tab)">
  Produkte
</a>

Ein Symbol allein reicht nicht aus – die Warnung muss als Text vorhanden sein, den ein Screenreader ausgeben kann (der Alt-Text eines Symbols zählt).

So testet Silktide dies

Alle Links auf der Seite mit target="_blank" finden – dem Attribut, das einen neuen Tab oder ein neues Fenster öffnet – wobei Elemente, die Sie vom Prüfen ausgeschlossen haben, übersprungen werden.
Den lesbaren Text jedes Links erfassen: seinen Textinhalt, Alternativ- und Title-Texte von enthaltenen Elementen, eventuelle ARIA-Labels sowie mit CSS ::before und ::after hinzugefügten Text.
Den Link bestehen lassen, wenn dieser Text eine anerkannte Erklärung enthält: "neuer Tab", "neues Fenster", "neuer Browser-Tab", "neues Browserfenster" oder "externer Link" (walisische Entsprechungen werden ebenfalls erkannt).
Alle übrigen Links, die einen neuen Tab öffnen, melden.

Fehlerbehebung

Mein Link erklärt es mit anderen Worten

Es werden nur die oben genannten Formulierungen erkannt. Wenn Ihre Formulierung eine echte Entsprechung ist, z. B. "öffnet sich in einem Popup", standardisieren Sie entweder auf eine anerkannte Formulierung oder Sie den Befund.

"Fenster" oder "Tab"?

Fast alle modernen Browser öffnen Links mit target="_blank" in einem Tab, daher ist "öffnet in neuem Tab" in der Regel die klarere Formulierung – beide Varianten werden jedoch akzeptiert.