Seminar Joomla – Barrierefreie Websites und WCAG-konforme Umsetzung

Das Seminar verbindet technische und redaktionelle Barrierefreiheit zu einem belastbaren Arbeitsprozess. Die zugängliche Grundstruktur moderner Joomla-Templates wird mit klaren Regeln für Inhalte, Medien, Navigation, Formulare, Interaktion und kontinuierliche Prüfung ergänzt.

Inhaltsübersicht

• Lernziele und fachliche Einordnung
• Schrittweise Seminarinhalte
• Praxisübungen und Laborszenarien
• Zielgruppe und Voraussetzungen
• Didaktik und Arbeitsweise

Lernziele

• Die vier WCAG-Grundprinzipien auf Joomla-Seiten und redaktionelle Inhalte anwenden.
• Semantisch korrekte Überschriften, Links, Listen, Tabellen und Medienalternativen erstellen.
• Tastaturführung, Fokus, Kontrast, responsive Darstellung und Formularfeedback überprüfen.
• Template-Anpassungen und Overrides ohne Verlust der Zugänglichkeit umsetzen.
• Einen wiederholbaren Prüf- und Freigabeprozess für Redaktion und Entwicklung einführen.

Schrittweise Seminarinhalte

1. Barrierefreiheits-Zielbild und Prüfkriterien

Schwerpunkt: WCAG 2.2, Wahrnehmbarkeit, Bedienbarkeit, Verständlichkeit, Robustheit, Zielgruppen und Prioritäten.

1. Ausgangslage, Zielgruppen und fachliche Anforderungen für „Barrierefreiheits-Zielbild und Prüfkriterien“ erfassen.
2. Die Aspekte WCAG 2.2, Wahrnehmbarkeit, Bedienbarkeit, Verständlichkeit, Robustheit, Zielgruppen und Prioritäten in einem nachvollziehbaren Sollmodell ordnen.
3. Varianten vergleichen, Abhängigkeiten markieren und belastbare Entscheidungskriterien festlegen.
4. Das Sollmodell mit Beispieldaten, Gegenproben und definierten Abnahmekriterien verifizieren.
5. Als Arbeitsergebnis einen abgestimmten Prüfkatalog für die Website dokumentieren und für die weitere Umsetzung freigeben.

2. Semantische Inhalte im Editor

Schwerpunkt: Überschriftenhierarchie, Absätze, Listen, Zitate, Abkürzungen, Linktexte, Tabellen und Sprachwechsel.

1. Redaktionelle Ziele, Inhaltsarten und Verantwortlichkeiten für „Semantische Inhalte im Editor“ festlegen.
2. Die Joomla-Objekte und Einstellungen für Überschriftenhierarchie, Absätze, Listen, Zitate, Abkürzungen, Linktexte, Tabellen und Sprachwechsel strukturiert konfigurieren.
3. Beispielinhalte anlegen, bearbeiten, versionieren und durch den vorgesehenen Veröffentlichungsweg führen.
4. Darstellung, Berechtigungen, Metadaten und Verhalten im Frontend mit Positiv- und Negativfällen prüfen.
5. Als Arbeitsergebnis einen redaktionellen Styleguide für zugängliche Inhalte dokumentieren und in einen wiederholbaren Redaktionsstandard überführen.

3. Bilder, Audio, Video und Dokumente

Schwerpunkt: Alternativtexte, dekorative Bilder, Untertitel, Transkripte, Audiodeskription, Medien-Custom-Fields und Dokumenthinweise.

1. Redaktionelle Ziele, Inhaltsarten und Verantwortlichkeiten für „Bilder, Audio, Video und Dokumente“ festlegen.
2. Die Joomla-Objekte und Einstellungen für Alternativtexte, dekorative Bilder, Untertitel, Transkripte, Audiodeskription, Medien-Custom-Fields und Dokumenthinweise strukturiert konfigurieren.
3. Beispielinhalte anlegen, bearbeiten, versionieren und durch den vorgesehenen Veröffentlichungsweg führen.
4. Darstellung, Berechtigungen, Metadaten und Verhalten im Frontend mit Positiv- und Negativfällen prüfen.
5. Als Arbeitsergebnis ein Medienkonzept mit verbindlichen Alternativregeln dokumentieren und in einen wiederholbaren Redaktionsstandard überführen.

4. Navigation, Tastatur und Fokus

Schwerpunkt: Skip-Links, Landmarken, Menüführung, Fokusreihenfolge, sichtbarer Fokus, Dialoge und mobile Navigation.

1. Inhaltsstruktur, Zielgeräte und gestalterische Anforderungen für „Navigation, Tastatur und Fokus“ analysieren.
2. Template-, Layout- und Asset-Strukturen für Skip-Links, Landmarken, Menüführung, Fokusreihenfolge, sichtbarer Fokus, Dialoge und mobile Navigation kontrolliert aufbauen.
3. Responsive Darstellung, Semantik, Interaktion und barrierearme Bedienung schrittweise umsetzen.
4. Browser-, Geräte-, Tastatur-, Kontrast- und Performance-Tests mit definierten Prüffällen durchführen.
5. Als Arbeitsergebnis eine tastaturbedienbare Navigations- und Fokusstruktur in einem wartbaren Frontend- und Gestaltungsstandard dokumentieren.

5. Templates, Farben und responsive Darstellung

Schwerpunkt: Cassiopeia, Child Templates, Kontrast, Typografie, Zoom, Reflow, CSS-Klassen und Statusmeldungen.

1. Inhaltsstruktur, Zielgeräte und gestalterische Anforderungen für „Templates, Farben und responsive Darstellung“ analysieren.
2. Template-, Layout- und Asset-Strukturen für Cassiopeia, Child Templates, Kontrast, Typografie, Zoom, Reflow, CSS-Klassen und Statusmeldungen kontrolliert aufbauen.
3. Responsive Darstellung, Semantik, Interaktion und barrierearme Bedienung schrittweise umsetzen.
4. Browser-, Geräte-, Tastatur-, Kontrast- und Performance-Tests mit definierten Prüffällen durchführen.
5. Als Arbeitsergebnis eine barrierearme Frontend-Baseline in einem wartbaren Frontend- und Gestaltungsstandard dokumentieren.

6. Formulare, Fehlermeldungen und Missbrauchsschutz

Schwerpunkt: Labels, Hilfetexte, Pflichtfelder, Fehlersummary, Autocomplete, Proof-of-Work-CAPTCHA und Bestätigungsmeldungen.

1. Inhaltsstruktur, Zielgeräte und gestalterische Anforderungen für „Formulare, Fehlermeldungen und Missbrauchsschutz“ analysieren.
2. Template-, Layout- und Asset-Strukturen für Labels, Hilfetexte, Pflichtfelder, Fehlersummary, Autocomplete, Proof-of-Work-CAPTCHA und Bestätigungsmeldungen kontrolliert aufbauen.
3. Responsive Darstellung, Semantik, Interaktion und barrierearme Bedienung schrittweise umsetzen.
4. Browser-, Geräte-, Tastatur-, Kontrast- und Performance-Tests mit definierten Prüffällen durchführen.
5. Als Arbeitsergebnis ein zugängliches Formular- und Validierungsmuster in einem wartbaren Frontend- und Gestaltungsstandard dokumentieren.

7. Test, Abnahme und redaktionelle Governance

Schwerpunkt: Tastaturtest, Screenreader-Schnelltest, automatisierte Prüfungen, manuelle Stichproben, Regression und Freigabe.

1. Sollzustände, Serviceabhängigkeiten und Messpunkte für „Test, Abnahme und redaktionelle Governance“ festlegen.
2. Überwachung, Protokollierung und Betriebsparameter für Tastaturtest, Screenreader-Schnelltest, automatisierte Prüfungen, manuelle Stichproben, Regression und Freigabe konfigurieren.
3. Regelaufgaben, Wartungsabläufe und kontrollierte Änderungen am Laborsystem durchführen.
4. Störungen simulieren, Diagnoseinformationen korrelieren und Wiederanlauf beziehungsweise Eskalation testen.
5. Als Arbeitsergebnis einen dokumentierten Prüf-, Abnahme- und Nachkontrollprozess als prüfbares Runbook dokumentieren.

Praxisübungen und Laborszenarien

• Überarbeitung eines fehlerhaften Joomla-Beitrags mit Überschriften, Links, Tabelle und Medienalternativen.
• Tastatur- und Fokusprüfung einer Navigation einschließlich mobiler Darstellung.
• Analyse und Korrektur eines Formulars mit unklaren Labels und Fehlermeldungen.
• Erstellung einer kombinierten Checkliste für Redaktion, Template-Entwicklung und Abnahme.

Zielgruppe und Voraussetzungen

Zielgruppe: Webredaktion, Frontend-Entwicklung, Template-Verantwortliche, Qualitätssicherung, öffentliche Stellen und technische Projektleitung

Voraussetzungen: Sichere Bedienung des Joomla-Backends; Grundkenntnisse in HTML und CSS sind für technische Übungen hilfreich

Didaktik und Arbeitsweise

Fachimpulse, Live-Demonstrationen und aufeinander aufbauende Laboraufgaben wechseln sich ab. Jeder Themenblock endet mit Positiv- und Negativtests sowie einer dokumentierten Sollkonfiguration, damit die Abläufe im eigenen Betrieb reproduzierbar bleiben.