Ausgangslage
BSCG Miteinander brauchte eine neue Website — nicht nur als digitale Visitenkarte, sondern als echtes Werkzeug fuer Mitglieder-Akquise und Event-Kommunikation. Anforderung: niedrige Barriere fuer Senioren und Menschen mit kognitiven Einschraenkungen, sehr klare Sprache, hoher Kontrast, grosse Klickziele. Plus: ein Admin-Panel, in dem Vorstand und Trainer ohne Technik-Kenntnis Inhalte pflegen koennen.
Ziel
Eine Website, die das Vereinsleben digital widerspiegelt — Events, Mitglieder, Sportarten, Inklusionsangebote. Plus ein Admin-Panel mit Login, das auch ein 65-jaehriger Trainer ohne Schulung bedienen kann. Barrierearm im Sinne von WCAG 2.1 AA. Vier verschiedene Design-Varianten fuer die Public-Site, damit der Vorstand waehlen kann.
Umsetzung
Wir haben vier komplette Design-Varianten gebaut — editorial, sportlich, minimal und brutalist — alle mit identischer Funktionalitaet, sodass die Wahl rein aesthetisch ist. Der Admin-Bereich laeuft unter /admin mit Login (Magic-Link plus optional TOTP). Inhalte werden ueber eine simple Block-Editor-Logik gepflegt (kein WordPress, keine Plugin-Hoelle). Postgres als Datenbank, Fastify-API auf Port 3020.
Funktionen im Detail
- Public-Site mit 4 Design-Varianten (editorial / sport / minimal / brutalist) zur Auswahl
- Admin-Panel mit Magic-Link-Login + optional TOTP
- Event-Verwaltung mit Kalender und Anmelde-Formular
- Mitglieder-Bereich mit Bio, Foto, Sportart
- Sportarten-Uebersicht mit Trainings-Zeiten
- Inklusionsangebote prominent platziert
- DSGVO-konformes Kontakt- und Mitglieds-Antrag-Formular
- Cache-Buster-Pattern (?v=2026051001) fuer nginx-Asset-Caching
- WCAG 2.1 AA Barrierefreiheit (Kontrast, Tastatur-Navigation, ARIA)
- Vereinsfarben und Logo in allen vier Varianten konsistent
Technischer Ansatz
Public-Site: statisch generiertes HTML, ausgeliefert von nginx unter bscg-miteinander.de. Admin-Panel: SvelteKit-SSR unter /admin, Postgres als Datenbank, Fastify-API auf Port 3020. Hosting auf dem Slorify-Stack. Login via Magic-Link mit Token-Schutz vor Mail-Scanner-Prefetch (POST verbraucht Token, GET nicht). nginx-Quirk: location ^~ /admin/ wegen Asset-Regex zwingend.
Design-Ansatz
Vier Varianten zur Wahl — alle barrierearm gehalten, hoher Kontrast, grosse Klickziele (mindestens 44 mal 44 px). Editorial-Variante mit Serif-Headlines und grosser Leerraum-Disziplin. Sport-Variante mit kraeftigen Farben und Bewegungs-Motiven. Minimal-Variante mit reduzierter Typografie. Brutalist-Variante mit harten Kanten und Mono-Typografie fuer die juengere Zielgruppe.
Ergebnis
Die Website ist seit Mai 2026 live, der Admin-Bereich wird vom Vorstand aktiv genutzt. Inhalte werden ohne technische Hilfe gepflegt, Events kommen direkt in den Kalender. Mitglieder-Anmeldungen ueber das Formular landen sicher in der Vereins-Datenbank. Die vier Design-Varianten erlaubten dem Vorstand, in Ruhe zu waehlen — gewonnen hat die editorial-Variante.
Du hast ein ähnliches Projekt?
Lass uns 30 Minuten sprechen — kostenlos und unverbindlich. Du sagst, was du vorhast, wir sagen ehrlich, ob und wie wir helfen können.
Jetzt Erstgespräch buchen Oder anrufen: +49 30 4397922284