Adminator
9a61f55cb1
- Design-System (assets/css/design-system.css) mit 21 Komponenten, iPad-Responsive-Breakpoints, Touch-Ziele 36px, Music-Player, Glossar-Tooltips - Templates (sims/template.html + student/teacher-Dashboard) - Docs: module-interface.md (inkl. 4a Sprachregel, 4b Leichte Sprache, 4c iPad), content-architecture.md, crash-recovery.md, music-registry.md - Admin-Infrastruktur: admin-modules.html + api/admin-modules.php (Titel, Emoji, Bild, Status, Dauer, Alter pro Modul) - Inbox-System: _inbox/README.md + _status.md fuer Atlas + Briefings an Klima, Glossar, Lehrplan, Fluss - Zentrale SFX-Pipeline (scripts/generate-sounds.py) - DALL-E-Bilder: 8 Badges + 5 Glossar-Repraesentationsbilder (Querformat) - Logo + Inter-Font lokal - PHP-APIs: admin, glossar, levels, licenses, progress, waypoints, assignments, profile, tickets - Spielsprache entfernt (admin-modules, admin-levels, schueler) - Landing-Page-Bearbeitungen (Boote sichtbarer, Button-Hintergrund) Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
128 lines
5.9 KiB
HTML
128 lines
5.9 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>GeoGraSim — Barrierefreiheitserklärung</title>
|
||
<link rel="icon" type="image/png" href="favicon-96x96.png" sizes="96x96">
|
||
<link rel="icon" type="image/svg+xml" href="favicon.svg">
|
||
<link rel="stylesheet" href="assets/fonts/inter.css">
|
||
<style>
|
||
*{margin:0;padding:0;box-sizing:border-box}
|
||
body{font-family:'Inter',sans-serif;background:#f7f6f3;color:#1a1a1a;line-height:1.7}
|
||
.topbar{background:#fff;padding:.6rem 1.2rem;display:flex;align-items:center;gap:.8rem;border-bottom:1px solid rgba(0,0,0,.06);flex-wrap:wrap}
|
||
.topbar a{text-decoration:none}
|
||
.topbar img{height:32px}
|
||
.topbar .spacer{flex:1}
|
||
.btn-sm{padding:.3rem .6rem;border:1px solid rgba(0,0,0,.08);border-radius:6px;background:#fff;font-size:.68rem;font-weight:600;color:#4a4a4a;text-decoration:none}
|
||
.wrap{max-width:760px;margin:0 auto;padding:2rem 1.5rem 4rem}
|
||
h1{font-size:1.6rem;font-weight:900;color:#1f4e5a;margin-bottom:.5rem}
|
||
h2{font-size:1rem;font-weight:800;color:#1f4e5a;margin:1.5rem 0 .4rem;padding-top:.8rem;border-top:1px solid rgba(0,0,0,.06)}
|
||
h3{font-size:.85rem;font-weight:700;color:#4a7c8a;margin:1rem 0 .2rem}
|
||
p,li{font-size:.85rem;color:#333;margin-bottom:.5rem}
|
||
ul{margin-left:1.2rem;margin-bottom:.8rem}
|
||
.meta{font-size:.75rem;color:#8a8a8a;margin-bottom:1.5rem}
|
||
.footer-note{font-size:.72rem;color:#8a8a8a;text-align:center;margin-top:2rem;padding-top:1rem;border-top:1px solid rgba(0,0,0,.06)}
|
||
.footer-note a{color:#4a7c8a;text-decoration:none}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="topbar">
|
||
<a href="index.html"><img src="assets/img/geograsim_t.svg" alt="GeoGraSim"></a>
|
||
<span class="spacer"></span>
|
||
<a href="index.html" class="btn-sm">Startseite</a>
|
||
<a href="ueber.html" class="btn-sm">Über</a>
|
||
<a href="handbuch.html" class="btn-sm">Handbuch</a>
|
||
</div>
|
||
<div class="wrap">
|
||
|
||
<h1>Barrierefreiheitserklärung</h1>
|
||
<p class="meta">für die Lern-App GeoGraSim (geograsim.at) — gemäß Web-Zugänglichkeits-Gesetz (WZG), BGBl. I Nr. 59/2019</p>
|
||
|
||
<p>GeoGraSim ist eine webbasierte Lernumgebung für interaktive Geografie-Simulationen. Die Anwendung richtet sich an Schüler*innen der 5. bis 10. Schulstufe und wird bewusst für den inklusiven Unterricht konzipiert.</p>
|
||
|
||
<h2>Stand der Vereinbarkeit</h2>
|
||
<p>Diese Lern-App ist <strong>teilweise vereinbar</strong> mit den Anforderungen der Richtlinie (EU) 2016/2102 in Verbindung mit den Web Content Accessibility Guidelines (WCAG) 2.1, Konformitätsstufe AA. Es wird kontinuierlich an Verbesserungen gearbeitet.</p>
|
||
|
||
<h2>Bereits umgesetzte Barrierefreiheitsfeatures</h2>
|
||
|
||
<h3>1. Semantische HTML-Struktur</h3>
|
||
<ul>
|
||
<li>Verwendung semantischer HTML5-Elemente (nav, main, section, article, header, footer)</li>
|
||
<li>Korrekte Überschriftenhierarchie (h1–h3)</li>
|
||
<li>Labels für alle Formularfelder</li>
|
||
<li>Alt-Texte für Bilder und Icons</li>
|
||
</ul>
|
||
|
||
<h3>2. Kontrast und Farbgestaltung</h3>
|
||
<ul>
|
||
<li>Kontrastverhältnis von mindestens 4.5:1 für normalen Text</li>
|
||
<li>Farben werden nie als einziges Unterscheidungsmerkmal verwendet — Symbole und Text ergänzen Farbkodierungen</li>
|
||
<li>Berücksichtigung von Farbfehlsichtigkeit bei allen Rückmeldungen (Rot/Grün wird durch Symbole ✓/✗ ergänzt)</li>
|
||
</ul>
|
||
|
||
<h3>3. Responsive Design</h3>
|
||
<ul>
|
||
<li>Alle Seiten funktionieren auf Smartphones, Tablets und Desktop-Computern</li>
|
||
<li>Zoom-Funktion des Browsers wird unterstützt (bis 200% ohne Informationsverlust)</li>
|
||
<li>Touch-Bedienung für Tablets (On-Screen-Steuerung bei Simulationen)</li>
|
||
</ul>
|
||
|
||
<h3>4. Tastaturbedienbarkeit</h3>
|
||
<ul>
|
||
<li>Alle interaktiven Elemente (Links, Buttons, Formulare) sind per Tastatur erreichbar</li>
|
||
<li>Simulationen bieten Tastatursteuerung (Pfeiltasten, R für Reset, M für Mute)</li>
|
||
<li>Sichtbarer Fokus-Indikator bei Navigation per Tastatur</li>
|
||
</ul>
|
||
|
||
<h3>5. Reizarme Darstellung</h3>
|
||
<ul>
|
||
<li>Mute-Button in allen Simulationen (Taste M) zum Abschalten aller Sounds</li>
|
||
<li>Keine blinkenden oder flackernden Elemente</li>
|
||
<li>Reduzierte Animationen — SVG-Landschaftselemente sind dezent und langsam</li>
|
||
<li>Klare, lineare Aufgabenstruktur in allen Simulationen</li>
|
||
</ul>
|
||
|
||
<h3>6. Differenzierung und Nachteilsausgleich</h3>
|
||
<ul>
|
||
<li>Drei Schwierigkeitsstufen pro Simulation</li>
|
||
<li>Individuelles Lerntempo — kein Zeitdruck (außer bei speziellen Szenarien)</li>
|
||
<li>Lehrpersonen können Module individuell pro Schüler*in freischalten</li>
|
||
<li>Anonyme Pseudonyme statt Klarnamen</li>
|
||
</ul>
|
||
|
||
<h3>7. Textverständlichkeit</h3>
|
||
<ul>
|
||
<li>Einfache, klare Sprache in allen Anleitungen</li>
|
||
<li>Gender-inklusive Schreibweise (Schüler*innen)</li>
|
||
<li>Pilot-Kommentare in der Helikopter-Simulation sind verständlich und kurz</li>
|
||
<li><strong>Untertitel</strong> zu allen Pilot-Sprachausgaben — Funksprüche werden immer als Text angezeigt</li>
|
||
</ul>
|
||
|
||
<h2>Bekannte Einschränkungen</h2>
|
||
<ul>
|
||
<li>Canvas-basierte Simulationen (Klimawächter, Flussmanagement, Helikopter) sind für Screenreader nur eingeschränkt zugänglich</li>
|
||
<li>Die Kartennavigation (Leaflet/OpenStreetMap) hat begrenzte Screenreader-Unterstützung</li>
|
||
<li>Die Emoji-basierte Stadtplanung ist auf visuelle Wahrnehmung angewiesen</li>
|
||
</ul>
|
||
|
||
<h2>Geplante Verbesserungen</h2>
|
||
<ul>
|
||
<li>ARIA-Labels für alle interaktiven Canvas-Elemente</li>
|
||
<li>High-Contrast-Modus als Option</li>
|
||
<li>Screenreader-optimierte Alternativdarstellung für Simulationsergebnisse</li>
|
||
</ul>
|
||
|
||
<h2>Kontakt bei Barrieren</h2>
|
||
<p>Wenn Sie Barrieren in der Anwendung feststellen, kontaktieren Sie uns bitte:</p>
|
||
<p><a href="mailto:support@geograsim.at" style="color:#4a7c8a">support@geograsim.at</a></p>
|
||
<p>Wir bemühen uns, gemeldete Barrieren zeitnah zu beheben.</p>
|
||
|
||
<div class="footer-note">
|
||
<p>Stand: April 2026 · <a href="index.html">geograsim.at</a> · <a href="datenschutz.html">Datenschutz</a> · <a href="impressum.html">Impressum</a></p>
|
||
</div>
|
||
|
||
</div>
|
||
</body>
|
||
</html>
|