Design-Update 2025

Im Juli 2025 wurde das Design der Spendenformulare aktualisiert. Ziel war es, eine bessere visuelle Orientierung zu bieten, Kontraste zu verbessern, ablenkende Elemente zu reduzieren und die Spendenformulare barrierefrei zu machen.

Kunden mit einem selbst hinterlegten Layout (CSS-Datei) bekommen weiterhin die Version vor dem Update ausgespielt. Diese kann in den Projekteinstellungen unter Design deaktiviert werden. Details dazu findest du in dieser FAQ.

Folgende Änderungen wurden umgesetzt:

Farb- und Design-Anpassungen

  • Standard-Farbschema: Neue Default-Farben für Organisations-Design-Einstellungen wurden gesetzt, inkl. besserer Graustufen-Palette für Kontraste.

  • Hintergrund-Entfernungen:

    • Event-Spendenbereiche und Shop-Übersichten haben keinen opaken Hintergrund mehr.

    • Signalfarben (z. B. im Geschenke-Shop) wurden reduziert, um Ablenkungen zu minimieren.

    • Hinweise und Fehlermeldungen (Warnungen, Errors) nutzen jetzt konsistente Farbcodierung mit ausreichendem Kontrast.

  • Feinjustierungen: Fehlermeldungs-Labels, Input-Felder und Hover-Effekte wurden so angepasst, dass sie optisch klarer und kontrastreicher sind.

Umfassende Accessibility-Optimierungen

  • ARIA & Tastaturbenutzeung:

    • Alle interaktiven Elemente (Buttons, Checkboxen, Slider, Form­felder) erhielten passende aria--Attribute, tabindex und aria-controls, damit sie von Screen­readern und Tastatur­nutzern korrekt angesprochen werden.

    • Fokus-Styles und Schatten wurden hinzugefügt, damit aktive Elemente deutlich sichtbar sind.

    • Fehlermeldungen werden nun als Text ausgespielt statt als reines Label, mit Verbindung zum jeweiligen Eingabefeld.

  • Komponenten-Umbau:

    • Buttons: Pfeil-Icons und CSS wurden so überarbeitet, dass sie semantisch und visuell barrierefrei sind (z. B. „hollow-button“ statt reinem Farb-Button).

    • Checkboxen: Migration auf ein neues, einheitliches Layout, für bessere Klick- und Fokus-Kontrolle.

    • In den Spendenurkunden-Projekten wurde die Signalfarbe und einige Hintergrundfarben bei Erklärungstexten entfernt

  • Sonstiges:

    • Mehrsprachigkeit: Alle HTML-Elemente haben jetzt ein lang-Attribut.

    • IFrames: Eingebettete Codes haben title-Attribute für Kontext.

    • Screenreader: An vielen Stellen wurden erklärende Label und Beschreibungen ergänzt.

Barrierefreie PDF-Generierung

  • Umstellung auf neuen PDF-Service: Die dynamischen PDF-Templates (z. B. Spendenurkunden, Danke-Anschreiben) werden jetzt in einem zugänglichen PDF-Format erzeugt.

  • Sprach- und Metadaten: Alle Dokumente wurden um Sprach-Attribute und sinnvolle Meta-Tags erweitert, damit Screen­reader korrekte Dokument­sprache und Dokument­Informationen auslesen können.