Dinge gibt es, die gibt es nicht; zumindest habe ich das wieder einmal gedacht, als Johan einen Artikel zum Thema Shadow DOM und Accessibility in einem unserer Slack-Channel gepostet hatte. Warum sollte der Shadow DOM ein Problem mit der Accessibility bei Benutzern zur Folge haben?
Ein kurzer Exkurs zum Thema "Was ist der Shadow-DOM noch schnell?":
Wikipedia sagt dazu:
"Shadow DOM ist ein Entwurf für einen Webstandard des World Wide Web Consortiums (W3C), welcher von Google im Rahmen der WHATWG vorgeschlagen wurde. Das Shadow DOM wird eingesetzt, um wiederverwendbare Komponenten zu erstellen, die in HTML5-basierten Webseiten eingebunden werden können."
Einige von Euch wissen es, ich komme aus der klassischen Softwareentwicklung und habe sehr viel programmiert. Unter anderem auch eigene GUI-Objekte für Windows- und Mac-Anwendungen in den Sprachen Delphi und Lazarus. Dort ist es so, dass wenn ich eine neue visuelle Komponente entwickle und diese in einem Fenster das Licht der Welt erblickt, bekommt diese Komponente irgendwann den sogenannten “Fokus”, also die Aufmerksamkeit des Benutzers. Eingaben kontrollieren in dem Moment meine Komponente und alles, was sich in dieser befindet: bestimmte Eingabefelder, Textobjekte wie Labels, Listen oder Zeichenbereiche.
Aber ich als Entwickler der Komponente muss intern dafür sorgen, dass die jeweiligen “Unterkomponenten” zusammen funktionieren und wann welche “Unterkomponente” den sogenannten Fokus besitzen soll. Und in diesem Glauben habe ich auch immer die Verwendung von Shadow-DOM-Komponenten gesehen. Der Browser übergibt den Fokus an die jeweilige Shadow-DOM-Komponente und danach muss die jeweilige Komponente sicherstellen, dass die richtigen Elemente den Fokus bekommen, da der Browser diese Elemente nicht sehen kann.
Nolan Lawson beschreibt in seinem Beitrag nun genau dieses Problem und dass dies wohl nicht wirklich so funktioniert bzw. aktuell auch noch keine optimalen Lösungen dafür existieren. Die Beispiele von Nolan fühlen sich in meinem Entwicklerherzen doch sehr schmerzhaft an, da er Label und Input in zwei getrennten Komponenten anlegt und dann eine Cross-Referenzierung aus einem Shadow DOM in einen anderen Shadow DOM beschreibt. Davon abgesehen zeigt es jedoch das eigentliche Problem: Den Vorteil, Komponenten mit komplexen Eingaben erstellen zu können, bezahlen wir mit dem Verlust der Accessibility. Diese sollte im Hinblick auf den European Accessibility Act doch eigentlich immer mehr in unseren Fokus bzw. in den Fokus jedes Onlinemarketing-Verantwortlichen rücken.
Fazit:
Für den Einsatz von modernen Techniken wie Javascript-Frameworks oder eben dem Shadow DOM müssen wir ganz klar zwischen Websites, Onlineshops und Webanwendungen unterscheiden. Alles, was für Deinen SEO-Erfolg wichtig ist, sollte diese Techniken einfach nicht verwenden. Oder Du zahlst es später über nachträgliche Anpassungen und Hacks. Hacks, die nicht sauber programmiert sein können, da es die Techniken eigentlich nicht vorsehen und die Website auf andere Weise belasten. Für Webanwendungen, die nicht ranken sollen und wo die Funktion ganz klar im Fokus steht, sind solche modernen Techniken zwar kein SEO-Problem, aber Accessibility hat ein Wörtchen mitzureden.