In wieweit ist es sinnvoll Javascript auf einer Webside zu verwenden?
Darüber sollte man sich Gedanken machen, damit keine Unglücke in Sachen Barrierefreiheit bzw. Usability geschehen.
In diesem Artikel möchte ich auf einige Stolperfallen beim verwenden von Javascripten hinweisen, sowie Alternativen aufzeigen.
Was ist Javascript?
JavaScript ist eine objektbasierte Skriptsprache, die recht leicht zu erlernen ist. Die Syntax ist ähnlich wie bei Java und C-Abkömmlingen und wird Clientseitig ausgeführt.
Und was macht man damit?
Am häufigsten werden damit wohl MouseOver Effekte, Popup-Fenster, Bilderwechsel und Formularüberprüfungen realisiert. Daneben gibt es natürlich noch unzählige Spielereien, wie Mausverfolger, IP Anezigen, Uhren… usw.
Wobei sollte man es nicht verwenden?
Bei jedem Einsatz von Javascript sollte man überlegen: Was passiert, wenn der Nutzer Javascript deaktiviert hat?
In den meisten Fällen guckt der User dann ziemlich blöde, denn die Seite funktioniert nicht mehr richtig oder gar nicht (Beispiel: mit Javascript erstellte Navigationen). Die Folge davon ist, dass dieser User die Seite nie wieder besuchen wird.
Um die Usability zu garantieren, sollte man also jedesmal testen, ob die Seite auch bei deaktiviertem Javascript funktionsfähig ist und richtig dargestellt wird.
- Popup Fenster
- In den meisten Fällen sind sie einfach nur nervig. Da stört es den User auch nicht, wenn das Popup nicht geöffnet werden kann.
In Fällen, bei denen es wichtige Inhalte darstellen soll, ensteht allerdings ein Problem. Der User bekommt sie einfach nicht zu sehen. Ein Popup ist außerdem nicht mehr als ein “kleines Fenster”. Man sollte sich also überlegen, ob es an dieser Stelle wirklich nötig ist, und was gegen eine neue Seite oder einen Tab spricht.
Um kurze Informationen anzuzeigen (Infoboxen), gibt es außerdem eine nette Variante in CSS, die bei Selfhtml – Infobox mit CSS erklärt wird.
- Navigationen
- Auf Javascript basierende Navigationen sind ein absolutes No-Go. Ist es deaktiviert, funktioniert die ganze Geschichte nicht mehr, so dass es dem User unmöglich ist, durch die Webside zu navigieren.
Zu diesem Thema hatte ich vor einiger Zeit einen mehr oder weniger regen E-Mailverkehr mit einer Dame, die nichts von Barrierefreiheit und Usabilty hält. Sie hat eine solche Navigation auf ihrer Seite und nach einem nett gemeintem Hinweis auf die Problematik, die diese mit sich bringt, bekam ich folgende Antwort:
“Nun, das ist dann Pech. Ich habe -ehrlich gesagt- aber auch gar nicht den Anspruch, jeden der irrwitzig vielen Surfer im Netz zu erreichen. Muß man nicht immer damit rechnen, daß irgendwer mit einer merkwürdigen Konstellation unterwegs ist, die irgendwelche Seiten nicht lesen kann?”Nun… viel muss man dazu wohl nicht mehr sagen. Es ist kontrovers eine (geschäftliche) Internetpräsenz ins Web zu stellen, auf der mit einer riesigen Besucherzahl seit dem Tag XY geworben wird, andererseits aber wissentlich Besuchern den Zutritt zu sperren.
- MouseOver-Effekte
- MouseOver-Effekte sehen hübsch aus und sind oft auch sinnvoll, um z.B. die Möglichkeit einen Link anzuklicken, aufzuzeigen. Dieses mit Javascript zu lösen ist allerdings keine kluge Idee, denn es geht sehr viel einfacher und Nutzerfreundlicher mit CSS. Erläuterung von Pseudoklassen auf Selfhtml und Selfhtml – Mouseover-Buttons und -Effekte mit CSS sind hierbei hilfreich.
- Spielereien
- Es gibt eine Vielzahl von Dingen, die zwar nett aussehen, aber absolut keinen Nutzen haben. Mausverfolger zB. Eigentlich sollte man sowas gar nicht erwähnen müssen, aber ab und zu stößt man doch noch auf einen Verirrten, der diese Effekte auf seinen Seiten verwendet.
Vor einiger Zeit kam ich auf eine Seite die so sehr mit den verschiedensten Spielereien überladen war, dass mein Browser abstürzte. Wie ärgerlich sowas ist, kann man sich wohl vorstellen. Eigentlich wollte ich diesem Herrn eine E-Mail zukommen lassen um ihn darauf hinzuweisen – aber nachdem ich das JS in meinem Browser ausgeschaltet hatte, damit nicht wieder alles hängenbleibt, war es nicht mehr möglich durch die Seite zu navigieren um zum “Kontakt” zu kommen. Tja, tolle Wurst.
Alternativen?
Oft kann man die gewünschten Effekte eleganter mit CSS lösen. Eine weitere Möglichkeit ist es, einen No-Script Bereich zu definieren, in dem steht was ohne Javascript geschehen soll.
Das Problem dabei ist, dass HTML und CSS auch irgendwann an ihre Grenzen stoßen, was bedeutet, dass es für manche Effekte einfach keine Alternative gibt. Und wenn doch, wieso nicht gleich auf Javascript verzichten und anders lösen?
Wenn es gar nicht anders geht: ein Hinweis darauf, dass Javascript benötigt wird, kann helfen. Das lässt dem User die Wahl, ob er die Inhalte wirklich sehen möchte und dafür sein Javascript aktiviert, oder verzichtet und die Seite verlässt.
Aber auch hier ist weniger mehr. Dinge wie “Diese Seite ist optimiert für eine Auflösung von 1200×1024px, den Internetexplorer und außerdem muss ein Flashplayer installiert sein, sowie Javascript angeschaltet. Die besondere Scrhiftart kann >hier< heruntergeladen werden." lassen den Besucher ganz schnell wieder flüchten. Mich erinnert sowas immer ein bisschen an “sie müssen erst den Nippel durch die Lasche ziehen und dann mit der Kurbel…”
Barrierefreiheit
Barrierefreiheit bedeutet nicht, auf Javascript verzichten. Auch wenn es manchmal so dargestellt wird. Man sollte nur darauf achten, dass ein geeignetes Fallback vorhanden ist, falls JS deaktiviert ist um weiterhin alle wichtigen Funktionen vefügbar zu halten.