THINK AHEAD!
Eine Website für ein gemeinnütziges Lernbrettspiel aus Graz, das Jugendliche auf das Leben nach der Schule vorbereitet – mit Themen rund um (Aus-)Bildung, Finanzen, Gesundheit und Wohnen.
- Nuxt
- Vue
- TypeScript
- UnoCSS
- Nitro
- Umami
Projektdetails ansehen
Mein Beitrag
Entwicklung der responsiven Nuxt-/Vue-Website mit TypeScript, wiederverwendbaren UI-Komponenten, typisierten Inhaltsmodellen und UnoCSS-Design-Tokens. Umsetzung eines datengetriebenen Quiz mit Schwierigkeitsstufen, zufälliger Fragenauswahl, Punkteauswertung und Tastatur-Fokusmanagement. Integration einwilligungsabhängiger Umami-Ereigniserfassung über einen serverseitigen Nitro-Endpunkt mit Payload-Validierung und Berücksichtigung von Datenschutzeinstellungen des Browsers. Konfiguration seitenspezifischer SEO-Metadaten, kanonischer URLs, strukturierter Daten und XML-Sitemap-Generierung.
Technisches Ergebnis
Eine komponentenbasierte Website, die Spiel, Quiz und herunterladbare Materialien zusammenführt. Optimierung der Ladegeschwindigkeit durch komprimierte WebP-Bilder und selbst gehostete variable Schriftarten; Verbesserung von Benutzerfreundlichkeit und Barrierefreiheit durch responsive Layouts, semantisches Markup, Tastaturnavigation und Unterstützung reduzierter Bewegung.
