GetBetter
GetBetter copied to clipboard
Draft: Feature/Accessibility
Disclaimer Ich versuche mich gerade privat etwas mehr mit dem Thema "Barrierefreiheit" im Web auseinanderzusetzten. Nicht alle Commits oder Änderungen werden dem Best Practice entsprechen. Feedback in jeder Hinsicht wäre sehr hilfreich. Ich versuche den PR so gut es geht aktuell zu halten und kann ihn immer nur wenn ich Zeit habe weiter bearbeiten.
TODOs
- [ ] ARIA Labels
- [x] Routing Mitteilungen
- [ ] Headings anpassen
- [ ] Semantische Tags
- [x] "Überspringen" links
- [ ] Focusmanagement
- [ ] Kontraste anpassen
ARIA Labels
- [ ] ARIA Label hinzufügen
- [ ] Proteintabelle (Ernährung) barrierefrei machen.
Routing Mitteilungen
- [x] Mitteilungen für den Screenreader, wenn sich die aktuelle Route ändert. (Erfolgt mittels @vue-a11y/announcer. ) (11e37f8)
Headings anpassen
- [ ] Headings auf allen Seiten anpassen. W3
semantische Tags
Wenn möglich mehr semantische Tags oder Roles verwenden.
- [ ] Header
- [x] Main (a3c017b?)
- [ ] Navbar
- [x] Footer (663ae7c118cdc5cfc693be5f4459a7a4a3938d62) (558442a0ca555d3191bfef475c5389550aa1d7f8)
- [x] ArticleContent (558442a0ca555d3191bfef475c5389550aa1d7f8)
- [ ] Figures für Bilder mit Caption und
alt- [x] Ernährung (f42a07e10b152f137bab406f347478bc9d1172e8)
- [ ] weitere Seiten
"Überspringen" Links
- [x] Link für: "Springe zum Hauptinhalt" (a24d8eb113aceba4ceb6fa47046556023df98b4d)
- [x] Link für: "Springe zum Footer" (a24d8eb113aceba4ceb6fa47046556023df98b4d)
Focusmanagement
- [x] Der focus/tab sollte beim routing wieder zurück gesetzt werden. (54141c4)
Kontraste anpassen
Einige Farben haben teilweise nicht ausreichend Kontrast zum Hintergrund. Besonders bei Verlinkungen.
- [ ] Kontraste bei Verlinkungen prüfen
- [ ] Label für Proteintabelle (Ernährung) im Darkmode anpassen
offene Themen/Disskusion
<main></main>oder<section></section>Tags verwenden? (siehe a3c017b)aria-hiddenfür sidebar?