Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

Link zu dieser Vergleichsansicht

Beide Seiten der vorigen Revision Vorhergehende Überarbeitung
Nächste Überarbeitung
Vorhergehende Überarbeitung
de:modul:m291:learningunits:lu05:theorie:c_accessibility [2026/03/08 22:16] gkochde:modul:m291:learningunits:lu05:theorie:c_accessibility [2026/03/08 22:22] (aktuell) gkoch
Zeile 34: Zeile 34:
  
 ===== WCAG – Der internationale Standard ===== ===== WCAG – Der internationale Standard =====
 +
 +{{youtube>7C-KHXPnDF0?}}
  
 Die **Web Content Accessibility Guidelines (WCAG)** werden vom World Wide Web Consortium (W3C) entwickelt und gelten als internationaler Standard für digitale Barrierefreiheit. Sie bieten Entwickler:innen klare, prüfbare Kriterien dafür, wie eine zugängliche Website aussehen muss. Die **Web Content Accessibility Guidelines (WCAG)** werden vom World Wide Web Consortium (W3C) entwickelt und gelten als internationaler Standard für digitale Barrierefreiheit. Sie bieten Entwickler:innen klare, prüfbare Kriterien dafür, wie eine zugängliche Website aussehen muss.
Zeile 56: Zeile 58:
 === 2. Bedienbarkeit (Operable) === === 2. Bedienbarkeit (Operable) ===
  
-{{:de:modul:m291:learningunits:lu05:theorie:focus-indicators-example-2048x768.png?nolink&300|}}+{{:de:modul:m291:learningunits:lu05:theorie:focus-indicators-example-2048x768.png?nolink&600|}}
  
 Die Website muss ohne Maus – also nur mit Tastatur oder Sprachsteuerung – vollständig nutzbar sein. Die Website muss ohne Maus – also nur mit Tastatur oder Sprachsteuerung – vollständig nutzbar sein.
Zeile 76: Zeile 78:
 === 4. Robustheit (Robust) === === 4. Robustheit (Robust) ===
  
-{{:de:modul:m291:learningunits:lu05:theorie:elizabeth-woolner-9xxnzcjz8ba-unsplash.jpg?nolink&300|}}+{{:de:modul:m291:learningunits:lu05:theorie:elizabeth-woolner-9xxnzcjz8ba-unsplash.jpg?nolink&400|}}
  
 Inhalte müssen auf verschiedenen Geräten und mit Hilfstechnologien (Screenreader, Braille-Ausgabegeräte) zuverlässig funktionieren. Inhalte müssen auf verschiedenen Geräten und mit Hilfstechnologien (Screenreader, Braille-Ausgabegeräte) zuverlässig funktionieren.
Zeile 102: Zeile 104:
   * Für Screenreader als «Schaltfläche» erkennbar   * Für Screenreader als «Schaltfläche» erkennbar
  
-Ein ''%%<div>%%'' mit ''onclick'' hat **keine** dieser Eigenschaften von Haus aus. 
-<WRAP center round box 80%> 
-<code html> 
-<!-- ❌ Nicht barrierefrei ohne viel Zusatzarbeit --> 
-<div onclick="openPanel()">Frage anzeigen</div> 
- 
-<!-- ✅ Semantisch korrekt – sofort barrierefrei --> 
-<button onclick="openPanel()">Frage anzeigen</button> 
-</code> 
-</WRAP> 
  
 <WRAP round box 80%> <WRAP round box 80%>
  • de/modul/m291/learningunits/lu05/theorie/c_accessibility.1773004576.txt.gz
  • Zuletzt geändert: 2026/03/08 22:16
  • von gkoch