Seminar Wagtail: Barrierefreiheit, SEO und nachhaltige Frontends

Das Seminar verbindet barrierearme Inhaltsstrukturen, technische Suchmaschinenoptimierung, robuste Template-Entwicklung und ressourcenschonende Frontend-Entscheidungen.

Inhaltsübersicht

1. Qualitätsmodell und Prüfkriterien
2. Semantische Inhalts- und Seitenstrukturen
3. Tastatur, Fokus und interaktive Komponenten
4. Bilder, Dokumente und audiovisuelle Inhalte
5. Technische Suchmaschinenoptimierung
6. Performance und nachhaltige Frontend-Architektur
7. Qualitätssicherung und Redaktionsleitlinien

Seminarprofil

Die Inhalte verbinden fachliche Einordnung, geführte Demonstrationen und eigenständige Übungen. Jeder Themenblock baut auf den vorherigen Arbeitsschritten auf; Konfigurationen und Implementierungen werden unmittelbar anhand definierter Qualitätskriterien überprüft. Zwei Tage ermöglichen die getrennte und anschließend integrierte Bearbeitung von Semantik, Tastaturbedienung, Metadaten, Performance, Medien und automatisierter Qualitätssicherung.

Zielgruppe und Voraussetzungen

Zielgruppe: Frontend-Entwickler, Wagtail-Entwickler, Content-Verantwortliche, Qualitätsmanager und technische SEO-Verantwortliche.

Voraussetzungen: Grundkenntnisse in HTML, CSS, Templates und redaktioneller Arbeit; für Übungen ist ein lauffähiges Wagtail-Projekt hilfreich.

Seminarinhalte

Kapitel 1: Qualitätsmodell und Prüfkriterien

Das Kapitel ordnet Qualitätsmodell und Prüfkriterien in den Gesamtzusammenhang ein und überführt die vier Teilthemen in einen nachvollziehbaren Arbeitsablauf.

Inhaltsverzeichnis des Kapitels: 1. Nutzergruppen, Nutzungskontexte und Barrieren; 2. Messbare Kriterien für Zugänglichkeit, Auffindbarkeit und Effizienz; 3. Verantwortlichkeiten zwischen Redaktion, Entwicklung und Betrieb; 4. Prüfplan mit manuellen und automatisierten Kontrollen

1. Schritt 1: Nutzergruppen, Nutzungskontexte und Barrieren fachlich, redaktionell und technisch analysieren und einen prüfbaren Zielzustand festlegen.
2. Schritt 2: Messbare Kriterien für Zugänglichkeit, Auffindbarkeit und Effizienz in Wagtail schrittweise modellieren, konfigurieren oder implementieren.
3. Schritt 3: Verantwortlichkeiten zwischen Redaktion, Entwicklung und Betrieb in einem realistischen Ende-zu-Ende-Fall anwenden und Varianten sowie Fehlerfälle vergleichen.
4. Schritt 4: Prüfplan mit manuellen und automatisierten Kontrollen mit Tests, Qualitätskriterien und klaren Verantwortlichkeiten dauerhaft absichern.

Kapitel 2: Semantische Inhalts- und Seitenstrukturen

Das Kapitel ordnet Semantische Inhalts- und Seitenstrukturen in den Gesamtzusammenhang ein und überführt die vier Teilthemen in einen nachvollziehbaren Arbeitsablauf.

Inhaltsverzeichnis des Kapitels: 1. Überschriftenhierarchie, Landmarken und Dokumentstruktur; 2. Listen, Tabellen, Zitate und verständliche Linktexte; 3. Strukturierte Wagtail-Blocks mit redaktionellen Leitplanken; 4. Validierung unvollständiger oder widersprüchlicher Inhalte

1. Schritt 1: Überschriftenhierarchie, Landmarken und Dokumentstruktur fachlich, redaktionell und technisch analysieren und einen prüfbaren Zielzustand festlegen.
2. Schritt 2: Listen, Tabellen, Zitate und verständliche Linktexte in Wagtail schrittweise modellieren, konfigurieren oder implementieren.
3. Schritt 3: Strukturierte Wagtail-Blocks mit redaktionellen Leitplanken in einem realistischen Ende-zu-Ende-Fall anwenden und Varianten sowie Fehlerfälle vergleichen.
4. Schritt 4: Validierung unvollständiger oder widersprüchlicher Inhalte mit Tests, Qualitätskriterien und klaren Verantwortlichkeiten dauerhaft absichern.

Kapitel 3: Tastatur, Fokus und interaktive Komponenten

Das Kapitel ordnet Tastatur, Fokus und interaktive Komponenten in den Gesamtzusammenhang ein und überführt die vier Teilthemen in einen nachvollziehbaren Arbeitsablauf.

Inhaltsverzeichnis des Kapitels: 1. Logische Fokusreihenfolge und sichtbare Fokuszustände; 2. Navigation, Dialoge, Akkordeons und Menüs; 3. Fehlermeldungen und Statusinformationen; 4. Prüfung ohne Maus und mit assistiven Technologien

1. Schritt 1: Logische Fokusreihenfolge und sichtbare Fokuszustände fachlich, redaktionell und technisch analysieren und einen prüfbaren Zielzustand festlegen.
2. Schritt 2: Navigation, Dialoge, Akkordeons und Menüs in Wagtail schrittweise modellieren, konfigurieren oder implementieren.
3. Schritt 3: Fehlermeldungen und Statusinformationen in einem realistischen Ende-zu-Ende-Fall anwenden und Varianten sowie Fehlerfälle vergleichen.
4. Schritt 4: Prüfung ohne Maus und mit assistiven Technologien mit Tests, Qualitätskriterien und klaren Verantwortlichkeiten dauerhaft absichern.

Kapitel 4: Bilder, Dokumente und audiovisuelle Inhalte

Das Kapitel ordnet Bilder, Dokumente und audiovisuelle Inhalte in den Gesamtzusammenhang ein und überführt die vier Teilthemen in einen nachvollziehbaren Arbeitsablauf.

Inhaltsverzeichnis des Kapitels: 1. Alternativtexte und dekorative Bilder; 2. Responsive Renditions und passende Bildgrößen; 3. Untertitel, Transkripte und Medienbeschreibungen; 4. Redaktionelle Pflichtfelder und Qualitätsberichte

1. Schritt 1: Alternativtexte und dekorative Bilder fachlich, redaktionell und technisch analysieren und einen prüfbaren Zielzustand festlegen.
2. Schritt 2: Responsive Renditions und passende Bildgrößen in Wagtail schrittweise modellieren, konfigurieren oder implementieren.
3. Schritt 3: Untertitel, Transkripte und Medienbeschreibungen in einem realistischen Ende-zu-Ende-Fall anwenden und Varianten sowie Fehlerfälle vergleichen.
4. Schritt 4: Redaktionelle Pflichtfelder und Qualitätsberichte mit Tests, Qualitätskriterien und klaren Verantwortlichkeiten dauerhaft absichern.

Kapitel 5: Technische Suchmaschinenoptimierung

Das Kapitel ordnet Technische Suchmaschinenoptimierung in den Gesamtzusammenhang ein und überführt die vier Teilthemen in einen nachvollziehbaren Arbeitsablauf.

Inhaltsverzeichnis des Kapitels: 1. Titel, Beschreibungen und kanonische Seitensignale; 2. Indexierbarkeit, Weiterleitungen und Fehlerseiten; 3. Strukturierte interne Verlinkung und Informationsarchitektur; 4. Prüfung generierter Metadaten über Seitentypen hinweg

1. Schritt 1: Titel, Beschreibungen und kanonische Seitensignale fachlich, redaktionell und technisch analysieren und einen prüfbaren Zielzustand festlegen.
2. Schritt 2: Indexierbarkeit, Weiterleitungen und Fehlerseiten in Wagtail schrittweise modellieren, konfigurieren oder implementieren.
3. Schritt 3: Strukturierte interne Verlinkung und Informationsarchitektur in einem realistischen Ende-zu-Ende-Fall anwenden und Varianten sowie Fehlerfälle vergleichen.
4. Schritt 4: Prüfung generierter Metadaten über Seitentypen hinweg mit Tests, Qualitätskriterien und klaren Verantwortlichkeiten dauerhaft absichern.

Kapitel 6: Performance und nachhaltige Frontend-Architektur

Das Kapitel ordnet Performance und nachhaltige Frontend-Architektur in den Gesamtzusammenhang ein und überführt die vier Teilthemen in einen nachvollziehbaren Arbeitsablauf.

Inhaltsverzeichnis des Kapitels: 1. Performance-Budgets und priorisierte Ressourcen; 2. Bild-, Schrift- und Skriptstrategie; 3. Caching und Reduktion unnötiger Datenübertragung; 4. Messung von Ladeverhalten und wiederholter Nutzung

1. Schritt 1: Performance-Budgets und priorisierte Ressourcen fachlich, redaktionell und technisch analysieren und einen prüfbaren Zielzustand festlegen.
2. Schritt 2: Bild-, Schrift- und Skriptstrategie in Wagtail schrittweise modellieren, konfigurieren oder implementieren.
3. Schritt 3: Caching und Reduktion unnötiger Datenübertragung in einem realistischen Ende-zu-Ende-Fall anwenden und Varianten sowie Fehlerfälle vergleichen.
4. Schritt 4: Messung von Ladeverhalten und wiederholter Nutzung mit Tests, Qualitätskriterien und klaren Verantwortlichkeiten dauerhaft absichern.

Kapitel 7: Qualitätssicherung und Redaktionsleitlinien

Das Kapitel ordnet Qualitätssicherung und Redaktionsleitlinien in den Gesamtzusammenhang ein und überführt die vier Teilthemen in einen nachvollziehbaren Arbeitsablauf.

Inhaltsverzeichnis des Kapitels: 1. Automatisierte Prüfungen in Entwicklung und Delivery; 2. Manuelle Stichproben und Abnahmeszenarien; 3. Redaktionelle Checklisten und verständliche Hilfetexte; 4. Fehlerklassifikation, Priorisierung und kontinuierliche Verbesserung

1. Schritt 1: Automatisierte Prüfungen in Entwicklung und Delivery fachlich, redaktionell und technisch analysieren und einen prüfbaren Zielzustand festlegen.
2. Schritt 2: Manuelle Stichproben und Abnahmeszenarien in Wagtail schrittweise modellieren, konfigurieren oder implementieren.
3. Schritt 3: Redaktionelle Checklisten und verständliche Hilfetexte in einem realistischen Ende-zu-Ende-Fall anwenden und Varianten sowie Fehlerfälle vergleichen.
4. Schritt 4: Fehlerklassifikation, Priorisierung und kontinuierliche Verbesserung mit Tests, Qualitätskriterien und klaren Verantwortlichkeiten dauerhaft absichern.