Seite 1 von 1

Stylesheet Switcher

Verfasst: Fr 9. Sep 2022, 11:24
von Horst1234
Hallo zusammen,
ich brauche wegen Barrierefreiheit einen Stylesheet-Switcher auf der Website.
Also ein Skript, das nach Klick auf einen Button ein Stylesheet austauscht (oder ein zweites dazuschaltet) und (ganz wichtig!) auch beim Wechsel auf die nächste Seite "erinnert".
Jquery-Snippets aus'm Netz bekomme ich mit CONTENIDO nicht zum Laufen, zumal ich AMR nutze.
Hat da schon jemand so ein Skript gebastelt?
Gruß aus Bremen,
Horst

Re: Stylesheet Switcher

Verfasst: Mo 12. Sep 2022, 11:49
von McHubi
Hallo Horst,
mit andere Farben und andere Schriftgrößen ist es bei der BF nicht getan. Sicher, Du bekommst mit so einem Styleswitcher die Kontrastproblematik in den Griff - was ist aber mit Screenreadern? Passt das Markup? Aria-Label korrekt verwendet und und und. So sinnvoll und berechtigt die BF auch ist, sie ist hinsichtlich Entwicklung echt nicht zu unterschätzen.
Ich würde hier statt auf einen Styleswitcher zu gehen von vornherein die Optik (!) barrierefrei gestalten. Für alles weitere reicht grundsätzlich der Hochkontrastmodus - sofern er denn BF-konform auf der Site greifen kann.
Letztlich muss BF von vornherein mitgedacht werden und ein Nachrüsten ist in der Regel extrem aufwändig. Auch stellt sich die Frage, welchen Kriterien die Site genügen muss. WCAG 2.1 in Stufe AA?
VG
Markus

Re: Stylesheet Switcher

Verfasst: Mo 12. Sep 2022, 15:51
von Horst1234
Hallo Markus,
danke für deine ausführliche Antwort, die im Prinzip auch richtig ist. Ich brauchte aber nur für die Schriftenvergrößerung eine Lösung, alles andere lief BF mäßig schon perfekt. Und da haben mir dann, wenn es noch jemanden interessiert, diese Skripte sehr weietrgeholfen: https://wiki.selfhtml.org/wiki/JavaScri ... h_wechseln, funktioniert auch mit AMR :D
Gruß,
Horst

Re: Stylesheet Switcher

Verfasst: Mo 10. Okt 2022, 11:56
von chris8408
Hallo Horst,

ich weiß nicht ob es hilft, aber man kann das über den HTML5 local bzw session storage lösen.

https://www.codeproject.com/Tips/863019 ... on-Storage

Im Beispiel wird per JS eine Theme-Variable gesetzt. Ist diese "Theme-Variable" beim laden der Seite vorhanden, wird ein entsprechendes CSS geladen.

Ähnliches auch hier als JS-Plugin https://www.jqueryscript.net/other/Styl ... orage.html

Christian