Barrierefreie Webseiten

Geleitwort von Joschi Kuphal: Digitale Barrierefreiheit als gemeinschaftliche Aufgabe . . . 17
Für wen ist dieses Buch? Warum sollten Sie es lesen? . . . 19
TEIL I. Bedürfnisse der Menschen, rechtliche Grundlagen und erste Prüfungen der Barrierefreiheit Ihrer Website . . . 25
Kapitel 1. Digitale Barrierefreiheit . . . 27

1. 1 . . . Was ist digitale Barrierefreiheit? . . . 28
1. 2 . . . Permanente, temporäre und situative Einschränkungen/Behinderungen . . . 31
1. 3 . . . Arten von Behinderungen und die Konsequenzen für Ihre Website/Anwendung . . . 32
1. 4 . . . Barrierefreiheitsanforderungen -- die Europäische Norm EN 301 549 . . . 48
1. 5 . . . Webinhalte für alle -- die Web Content Accessibility Guidelines (WCAG) . . . 52
1. 6 . . . Die ersten Schritte zur Barrierefreiheit Ihrer Website . . . 59
1. 7 . . . Tools für erste Optimierungspotenziale . . . 75
1. 8 . . . Zusammenfassung des Kapitels . . . 84

Kapitel 2. Bedürfnisse der Nutzenden verstehen, und zwar aller . . . 87

2. 1 . . . Menschzentrierter Gestaltungsprozess -- die Nutzenden in den Mittelpunkt stellen . . . 88
2. 2 . . . Heterogene Nutzende -- Betroffene integrieren . . . 91
2. 3 . . . Screenreader und Co. -- Unterstützung durch assistive Technologien . . . 94
2. 4 . . . Design und Barrierefreiheit -- ein Widerspruch? . . . 99
2. 5 . . . Kulturelle Besonderheiten . . . 101
2. 6 . . . Barrierefreiheit ist für alle ein Gewinn . . . 102
2. 7 . . . Zusammenfassung des Kapitels . . . 108

TEIL II. Technische Grundlagen für barrierefreie Websites . . . 111
Kapitel 3. Das Fundament barrierefreier Websites -- HTML und der Accessibility Tree . . . 113

3. 1 . . . HTML -- die Grundlage von Websites . . . 114
3. 2 . . . Tags und Attribute in HTML . . . 120
3. 3 . . . Bedeutung des semantischen HTML für die Barrierefreiheit . . . 122
3. 4 . . . DOM und Accessibility Tree . . . 126
3. 5 . . . Zusammenfassung des Kapitels . . . 135

Kapitel 4. Die perfekte Website -- eine Kombination aus HTML, CSS, JavaScript und WAI ARIA . . . 137

4. 1 . . . CSS -- das Design von Websites . . . 138
4. 2 . . . Zusammenspiel zwischen HTML, CSS, JavaScript und WAI ARIA . . . 143
4. 3 . . . JavaScript . . . 147
4. 4 . . . WAI ARIA . . . 148
4. 5 . . . Kompatibilität mit aktuellen und zukünftigen assistiven Technologien gewährleisten . . . 165
4. 6 . . . KoliBri -- die Komponentenbibliothek für die Barrierefreiheit . . . 170
4. 7 . . . Tools zur Optimierung . . . 171
4. 8 . . . Zusammenfassung des Kapitels . . . 174

TEIL III. Barrierefreie Inhalte -- die Basis Ihrer Website . . . 177
Kapitel 5. Texte und Inhalte auf Website und App zielgruppengerecht aufbereiten . . . 179

5. 1 . . . Visuelle Informationen und kognitive Leichtigkeit . . . 179
5. 2 . . . Texte zielgruppenkonform gestalten -- Verständlichkeit und Lesbarkeit erhöhen . . . 183
5. 3 . . . Prinzipien der Leichten Sprache . . . 189
5. 4 . . . Prinzipien der Einfachen Sprache . . . 190
5. 5 . . . Optimierung der Aussprache von Texten in Screenreadern . . . 192
5. 6 . . . Zusammenfassung des Kapitels . . . 195

Kapitel 6. Texte und Inhalte auf Website und App barrierefrei gestalten . . . 197

6. 1 . . . Einsatz von Farbe . . . 197
6. 2 . . . Wie ist das notwendige Kontrastverhältnis? . . . 201
6. 3 . . . Schriftart und Schriftgröße . . . 206
6. 4 . . . Abstände und Schreibweisen . . . 214
6. 5 . . . Zoom und Anpassung von Textabständen . . . 216
6. 6 . . . Bilder eines Textes (Schriftgrafik) . . . 220
6. 7 . . . Auszeichnung der Überschriften im Text (H1--H6) . . . 222
6. 8 . . . Fettungen und kursive Wörter . . . 224
6. 9 . . . Auszeichnung von Tabellen . . . 225
6. 10 . . . Auszeichnung von Listen . . . 234
6. 11 . . . Zitate barrierefrei auszeichnen . . . 237
6. 12 . . . Kontaktinformationen (Adresse, Telefonnummer) . . . 238
6. 13 . . . Textausrichtung im internationalen Umfeld definieren . . . 239
6. 14 . . . Zusammenfassung des Kapitels . . . 240

Kapitel 7. Visuelles und auditives Design barrierefrei umsetzen . . . 243

7. 1 . . . Barrierefreie Grafiken und Bilder -- Alt-Texte, Title und Bildlinks korrekt einsetzen . . . 244
7. 2 . . . Flackern und Blinken . . . 253
7. 3 . . . Barrierefreie Integration von iFrames . . . 255
7. 4 . . . CAPTCHAs im Hinblick auf Barrierefreiheit . . . 256
7. 5 . . . Integrierte Barrierefreiheitsfunktionen (Kontrasterhöhungen, Schriftgröße) sowie konforme alternative Version . . . 258
7. 6 . . . Audio auf Websites barrierefrei implementieren . . . 259
7. 7 . . . Video auf Websites barrierefrei implementieren . . . 263
7. 8 . . . Zusätzliche Video- und Audiofähigkeiten nach der EN 301 549 Kapitel 7 . . . 269
7. 9 . . . Zusammenfassung des Kapitels . . . 271

Kapitel 8. Bedienbarkeit? Menschen zum Ziel führen . . . 273

8. 1 . . . Was ist bei der Navigation auf Websites zu beachten? . . . 274
8. 2 . . . Wie ist die optimale Nutzung von Tastatureingaben? . . . 283
8. 3 . . . Notwendige Zielgrößen von Interaktionselementen (Buttons) . . . 292
8. 4 . . . Zeitlich limitierte Interaktionen (»nur noch X Minuten«) . . . 295
8. 5 . . . Ein Navigationskonzept barrierefrei umsetzen . . . 297
8. 6 . . . Zusammenfassung des Kapitels . . . 317

Kapitel 9. Formulare -- barrierefrei erstellt . . . 321

9. 1 . . . Grundstruktur eines barrierefreien Formulars . . . 324
9. 2 . . . Eingabeelemente und mobile Tastaturlayouts in Formularen . . . 326
9. 3 . . . Beschriftungen von Formularelementen . . . 330
9. 4 . . . Unsichtbare Beschriftungen -- z. B. interne Suche . . . 331
9. 5 . . . Reihenfolge und Gruppierung von Formularfeldern . . . 332
9. 6 . . . Auszeichnung von Pflichtfeldern -- »required« vs. »aria-required« . . . 334
9. 7 . . . Umgang mit der Autokorrektur in Formularfeldern . . . 335
9. 8 . . . Autocomplete . . . 336
9. 9 . . . Button und Buttongestaltung (Kontrast) . . . 337
9. 10 . . . Fehlerbehandlung in Formularen . . . 339
9. 11 . . . Spezifische Eigenschaften der Eingabefelder . . . 346
9. 12 . . . Hilfestellungen . . . 352
9. 13 . . . Zusammenfassung des Kapitels . . . 352

TEIL IV. Barrierefreie Social-Media- und PDF-Dokumente . . . 355
Kapitel 10. Inhalte auf Social-Media-Plattformen . . . 357

10. 1 . . . Text, Sprache, Emojis und Hashtags . . . 357
10. 2 . . . Bilder in Social Media . . . 360
10. 3 . . . Audio und Video . . . 362
10. 4 . . . Checkliste für Social Media . . . 362
10. 5 . . . Zusammenfassung des Kapitels . . . 363

Kapitel 11. Barrierefreie PDFs erstellen und einsetzen . . . 365

11. 1 . . . Warum auch PDF-Dokumente barrierefrei sein sollten . . . 365
11. 2 . . . PDF-Tags -- die Basis barrierefreier PDF-Dokumente . . . 368
11. 3 . . . Schritt für Schritt: Barrierefreies PDF mit Microsoft Word . . . 375
11. 4 . . . Prüfung der Barrierefreiheit eines PDFs . . . 387
11. 5 . . . Reihenfolgen für das Vorlesen definieren und prüfen . . . 398
11. 6 . . . Zusammenfassung des Kapitels . . . 400

TEIL V. Barrierefreie Software und Apps -- Umsetzung in WordPress . . . 403
Kapitel 12. Apps barrierefrei umsetzen -- barrierefreie Aspekte bei Smartphones . . . 405

12. 1 . . . Barrierefreiheitsfunktionen aktivieren . . . 407
12. 2 . . . Allgemeine Besonderheiten bei Apps . . . 412
12. 3 . . . Prüfung der Wahrnehmbarkeit . . . 414
12. 4 . . . Besonderheiten der Bedienbarkeit . . . 417
12. 5 . . . Besonderheiten der Verständlichkeit . . . 417
12. 6 . . . Besonderheiten der Robustheit/Interoperabilität . . . 418
12. 7 . . . Zusammenfassung des Kapitels . . . 418

Kapitel 13. WordPress und Co. barrierefrei gestalten . . . 419

13. 1 . . . Wahl des Themes . . . 419
13. 2 . . . Aspekte der Barrierefreiheit in WordPress . . . 423
13. 3 . . . Plug-ins für Barrierefreiheit . . . 427
13. 4 . . . Zusammenfassung des Kapitels . . . 429

TEIL VI. Prozesse, Rollen und rechtliche Ergänzungen . . . 431
Kapitel 14. Barrierefreie Prozesse im Unternehmen nachhaltig umsetzen . . . 433

14. 1 . . . Warum die Rolle des Managements für Barrierefreiheit so wichtig ist . . . 433
14. 2 . . . Barrierefreiheit kontinuierlich prüfen und im Unternehmen implementieren . . . 434
14. 3 . . . Know-how im Unternehmen aufbauen und teilen . . . 441
14. 4 . . . W3C Accessibility Maturity Model . . . 442
14. 5 . . . Entwicklung mit Fokus auf Barrierefreiheit . . . 443
14. 6 . . . Implementierung eines universellen Designs . . . 446
14. 7 . . . Zusammenfassung des Kapitels . . . 447

Kapitel 15. Gesetze, Normen und Richtlinien für barrierefreie Websites . . . 449

15. 1 . . . Was das Barrierefreiheitsstärkungsgesetz für Sie bedeutet (seit dem 28. Juni 2025) . . . 450
15. 2 . . . Weitere Prüfschritte für Websites auf Basis der EN 301 549 . . . 456
15. 3 . . . Zusammenfassung der WCAG 2. 2 mit Referenz im Buch . . . 461
15. 4 . . . Kurzer Ausblick auf die WCAG 3. 0 . . . 489
15. 5 . . . Vorgaben für die öffentliche Hand -- die BITV 2. 0 . . . 489
15. 6 . . . Authoring Tool Accessibility Guidelines (ATAG) 2. 0 . . . 498
15. 7 . . . User Agent Accessibility Guidelines (UAAG) . . . 501
15. 8 . . . Gesetzliche Situation in Österreich und der Schweiz . . . 501
15. 9 . . . Zusammenfassung des Kapitels . . . 504

Kapitel 16. Checklisten . . . 507

16. 1 . . . Checkliste zu generellen und technischen Aspekten einer Website . . . 507
16. 2 . . . Checkliste für Seiteninhalte . . . 509
16. 3 . . . Checkliste für Farben und Kontraste . . . 512
16. 4 . . . Checkliste für Bilder . . . 513
16. 5 . . . Checkliste für Video und Audio . . . 514
16. 6 . . . Checkliste für Formulare . . . 515
16. 7 . . . Checkliste für PDF-Dokumente . . . 517
16. 8 . . . Checkliste für Social-Media-Beiträge . . . 518

Index . . . 519