Barrierefreiheit

SubLearn wurde von Grund auf mit Barrierefreiheit im Blick entwickelt. Wir setzen uns dafür ein, allen Nutzern ein inklusives Lernerlebnis zu bieten – unabhängig von ihren Fähigkeiten oder den assistiven Technologien, die sie verwenden. Unsere Plattform folgt den Web Content Accessibility Guidelines (WCAG) 2.1 Level AA, damit Sprachenlernen für alle zugänglich ist.

Screenreader-Unterstützung

SubLearn ist vollständig kompatibel mit gängigen Screenreadern wie NVDA, JAWS, VoiceOver und TalkBack. Wir verwenden semantisches HTML und umfassende ARIA-Labels (Accessible Rich Internet Applications) auf der gesamten Plattform, damit alle Inhalte und interaktiven Elemente korrekt an Screenreader-Nutzer weitergegeben werden.

Semantisches HTML: Alle Seiteninhalte sind mit einer korrekten Überschriftenhierarchie (h1, h2, h3 usw.), semantischen Elementen (main, nav, article, section) und aussagekräftigen Linktexten strukturiert.
ARIA-Labels: Formularfelder, Buttons und dynamische Inhaltsbereiche sind mit passenden ARIA-Attributen versehen, darunter aria-label, aria-describedby und aria-live für Echtzeit-Updates.
Alt-Texte: Alle Bilder, einschließlich Thumbnails und Icons, haben beschreibende Alternativtexte, um ihre Bedeutung auch für Nutzer zugänglich zu machen, die sie nicht sehen können.
Formular-Barrierefreiheit: Alle Formularelemente sind korrekt mit Labels verknüpft, Fehlermeldungen werden vorgelesen und Validierungs-Feedback wird klar bereitgestellt.

Vollständige Tastaturnavigation

Jede Funktion auf SubLearn ist vollständig per Tastatur bedienbar. Du brauchst keine Maus, um irgendeinen Teil der Plattform zu nutzen:

Tab-Navigation: Nutze Tab und Shift+Tab, um in einer logischen Lesereihenfolge durch interaktive Elemente zu navigieren.
Tastenkürzel: Öffne unsere umfassende Übersicht der Tastenkürzel (drücke ? auf einer beliebigen Seite), um zu navigieren, die Videowiedergabe zu steuern, Karteikarten zu bewerten und mehr.
Fokus-Management: Visuelle Fokus-Indikatoren sind auf allen interaktiven Elementen deutlich sichtbar, damit du immer weißt, wo du dich auf der Seite befindest.
Überspringbare Inhalte: Oben auf jeder Seite gibt es einen „Zum Hauptinhalt springen"-Link, um die Navigation zu überspringen und direkt zum Lernbereich zu gelangen.
Keine Tastaturfalle: Tastaturnutzer können auf keinem Element gefangen werden – der Fokus kann immer vor- und zurückbewegt werden.

Reduzierte Bewegungen

Animationen und Übergänge können für manche Nutzer ablenkend sein oder Unbehagen verursachen. SubLearn respektiert die prefers-reduced-motion-Einstellung deines Geräts:

Automatische Erkennung: Wenn du „Bewegung reduzieren" oder „Animationen reduzieren" in deinen Betriebssystem-Einstellungen aktiviert hast, deaktiviert SubLearn automatisch nicht-essentielle Animationen.
Seitenübergänge: Fade- und Slide-Animationen werden im Modus für reduzierte Bewegungen deaktiviert.
Interaktive Elemente: Hover-Effekte und Mikrointeraktionen bleiben funktional, aber ohne unnötige Bewegung.
Erhaltene Animationen: Wichtiges visuelles Feedback (wie Button-Zustände oder Ladeanzeigen) funktioniert weiterhin zuverlässig.

Hoher Kontrast und farbenblindfreundliches Design

Das Design von SubLearn berücksichtigt Farbenblindheit und Kontrastempfindlichkeit:

Farb-Unabhängigkeit: Informationen werden nie allein durch Farbe vermittelt. Zum Beispiel verwenden Validierungsfehler Text, Icons und Farbe gemeinsam.
Hoher Kontrast: Text und interaktive Elemente halten ein Mindest-Kontrastverhältnis von 4,5:1 für normalen Text und 3:1 für großen Text ein – gemäß WCAG AA-Standards.
Dark Mode: Ein kontrastreicher Dark Mode ist verfügbar, um die Augenbelastung zu reduzieren und die Lesbarkeit bei schwachem Licht zu verbessern. Sowohl der helle als auch der dunkle Modus erfüllen die Barrierefreiheits-Kontrastanforderungen.
Farbenblind-Palette: Unsere Akzentfarben und UI-Elemente sind so gewählt, dass sie auch für Nutzer mit Farbenblindheit (Deuteranopie, Protanopie und Tritanopie) unterscheidbar sind.

Textgröße und Lesbarkeit

SubLearn unterstützt flexible Textgrößen und bleibt auf allen Zoom-Stufen gut lesbar:

Browser-Zoom: Du kannst mit Strg/Cmd + Plus/Minus hinein- und herauszoomen, ohne dass Inhalte verzerrt oder unbrauchbar werden.
Responsive Typografie: Schriftgrößen passen sich auf Mobilgeräten, Tablets und Desktops angemessen an.
Zeilenhöhe und Abstände: Großzügige Zeilenhöhen und Buchstabenabstände verbessern die Lesbarkeit und reduzieren die Augenbelastung bei langen Lernsitzungen.
Gut lesbare Schriften: Wir verwenden klare, serifenlose Schriften mit guter Lesbarkeit in allen Größen.

Video-Untertitel und Transkripte

Alle Videos auf SubLearn enthalten umfassende Untertitel und Transkripte für Nutzer, die gehörlos oder schwerhörig sind oder textbasiertes Lernen bevorzugen:

Automatisch generiert und überprüft: Video-Untertitel werden automatisch erstellt und auf Richtigkeit überprüft.
Mehrere Sprachen: Untertitel sind in der Originalsprache des Videos und auf Englisch verfügbar.
Einfaches Umschalten: Du kannst Untertitel einfach ein-/ausschalten und die Anzeige anpassen (drücke S oder nutze die Player-Steuerung).
Vollständige Transkripte: Für jedes Video sind komplette Transkripte verfügbar, falls du den gesamten Inhalt lieber lesen möchtest.

Fokus-Indikatoren und visuelles Feedback

Klare, sichtbare Fokus-Indikatoren helfen Tastaturnutzern und Menschen mit motorischen Einschränkungen bei der Navigation:

Sichtbarer Fokusring: Ein leuchtend violetter Fokusring erscheint um Buttons, Links und Formularfelder, wenn sie den Tastaturfokus erhalten.
Hover-Zustände: Buttons und Links ändern ihr Erscheinungsbild deutlich, wenn sie überfahren oder fokussiert werden.
Klarheit bei deaktivierten Elementen: Deaktivierte Elemente sind visuell klar erkennbar und können nicht bedient werden.