Neues HTML-Attribut macht verborgene Inhalte auffindbar: 'hidden=until-found'

Google Chrome wird ab Version 102 das Finden verborgener Inhalte mithilfe eines neuen HTML-Attributs ermöglichen. Auch das direkte Verlinken auf verborgene Textstellen ist damit möglich.

 Anzeige

Das Verstecken von Inhalten auf Webseiten zum Beispiel mithilfe von Akkordeons ist eine gängige Praxis, um die Übersichtlichkeit der Seiten zu verbessern - insbesondere in der mobilen Darstellung.

Das hat allerdings verschiedene Nachteile: Erstens sind die Inhalte im verborgenen Zustand nicht per Browser-Suche auffindbar, und zweitens kann nicht direkt auf Textfragmente dieser Inhalte verlinkt werden.

Mit Chrome ab Version 102 unterstützt der Browser ein neues HTML-Attribut, das diese Probleme lösen kann: hidden=until-found.

Durch das Hinzufügen dieses Attributs zum Container, in dem sich die versteckten Inhalte befinden, kann der Browser auch in versteckten Inhalten suchen und diese sichtbar machen, wenn ein Treffer erzielt wurde. Zusätzlich ist Google für die Suche in der Lage, Links in der Suche anzuzeigen, die auf die verborgenen Inhalte zeigen ("Scroll-to-Text").

In Verbindung mit hidden=until-found kann das Event beforematch verwendet werden. Dieses ist dann hilfreich, wenn ein Abgleich zwischen dem Zustand der verborgenen Inhalte und anderen Zuständen der Seite hergestellt werden muss. Das Hinzufügen eines Even Listeners mit beforematch, der ausgelöst wird, wenn ein mit hidden=until-found versehenes Element geöffnet wird, sorgt für diesen Ausgleich.

Um sicherzustellen, dass vervorgene Inhalte auch in Browsern gefunden werden können, die hidden=until-found nicht unterstützen, kann man dort verborgene Inhalte immer anzeigen. Ob ein Browser das Feature unterstützt, kann man prüfen, indem man eine Abfrage auf Verfügbarkeit des beforematch Event Handlers durchführt:

if (!(‘onbeforematch' in document.body)) {
  // expand all hidden content
}

Mit dieser Erweiterung wird der Umgang mit versteckten Inhalten auf Webseiten etwas einfacher. Zudem erhalten sie in Bezug auf die Suche eine Aufwertung.