BFSG für Floristen: Online-Bestellung und Blumenshop barrierefrei

Floristen und das BFSG: Online-Bestellung im Fokus

Viele Blumenläden bieten inzwischen Online-Bestellung mit Lieferservice an — spätestens seit Corona ein wichtiger Umsatzkanal. Sobald Kunden über deine Webseite Blumen bestellen und bezahlen können, ist das eine digitale Dienstleistung im Sinne von § 1 Abs. 2 BFSG. Das gilt unabhängig von der Unternehmensgröße.

Betroffen sind insbesondere:

• Online-Bestellformulare für Sträuße und Gestecke
• Anlass-Konfiguratoren (Hochzeit, Trauer, Geburtstag)
• Abo-Modelle für regelmäßige Blumenlieferungen
• Liefergebiets-Prüfung per PLZ-Eingabe
• Online-Bezahlung (PayPal, Kreditkarte, Vorkasse)

Hinweis: Dieser Artikel dient der allgemeinen Orientierung und ersetzt keine Rechtsberatung. Für verbindliche Aussagen zur BFSG-Konformität konsultiere bitte einen Fachanwalt.

Besondere Herausforderung: Visuelle Produkte beschreiben

Blumen sind ein extrem visuelles Produkt. Alt-Texte für Blumensträuße zu schreiben ist eine besondere Herausforderung — WCAG SC 1.1.1 (Nicht-Text-Inhalte) verlangt, dass jedes informationstragende Bild eine Textalternative hat. Weitere Informationen finden Sie im BFSG-Glossar.

„Bunter Blumenstrauß“ reicht nicht. Besser: „Frühlingsstrauß mit rosa Tulpen, weißen Lilien und grünem Eucalyptus, ca. 40 cm, in Naturtönen“. Je beschreibender der Alt-Text, desto besser kann ein sehbehinderter Kunde eine Kaufentscheidung treffen.

Vorlage für Floristen-Alt-Texte:

• Struktur: [Straußtyp] mit [Hauptblumen], [Farben], ca. [Größe], [Anlass]
• Beispiel 1: „Trauergesteck mit weißen Lilien und Schleierkraut, ca. 45 cm, klassisch gebunden“
• Beispiel 2: „Bunter Geburtstagsstrauß mit Sonnenblumen, Gerbera und Rosen in Gelb und Orange, ca. 35 cm“
• Beispiel 3: „Hochzeitsstrauß in Pastelltönen mit Pfingstrosen, Eukalyptus und Schleierkraut, kompakt gebunden“

Online-Bestellsystem: Schritt für Schritt barrierefrei

Ein typisches Floristen-Bestellsystem umfasst mehrere Schritte: Strauß auswählen, Lieferadresse eingeben, Termin wählen, Kartentext verfassen, bezahlen. Jeder einzelne Schritt muss barrierefrei sein.

1. Strauß auswählen

Produktbilder brauchen beschreibende Alt-Texte (siehe oben). Preise müssen als HTML-Text dargestellt werden, nicht als Bild. Wenn du Filteroptionen anbietest (Anlass, Farbe, Preis), müssen diese per Tastatur bedienbar sein (WCAG SC 2.1.1). Jede Filteroption braucht ein sichtbares Label.

2. Liefergebiet prüfen

Viele Floristen bieten eine PLZ-Prüfung an, ob in das gewünschte Gebiet geliefert werden kann. Achte darauf:

• Das Eingabefeld hat ein sichtbares <label>-Element (WCAG SC 1.3.1)
• Die Ergebnismeldung („Lieferung möglich“ / „Leider nicht im Liefergebiet“) wird per aria-live="polite" für Screenreader angekündigt (WCAG SC 4.1.3)
• Fehlermeldungen benennen klar das Problem: „Bitte gib eine gültige 5-stellige Postleitzahl ein“ statt nur „Fehler“ (WCAG SC 3.3.1)

3. Lieferdatum wählen

Termin-Picker (Datepicker) sind ein häufiger Stolperstein. Der Picker muss vollständig per Tastatur navigierbar sein — Pfeiltasten für Tage, Monatswechsel über Buttons. Biete zusätzlich ein Textfeld an, in das Nutzer das Datum manuell eingeben können (Format: TT.MM.JJJJ).

4. Kartentext und Grußbotschaft

Das Textfeld für die Grußkarte braucht ein Label („Kartentext“) und idealerweise eine Zeichenbegrenzung mit Live-Zähler, der per aria-live aktualisiert wird. So wissen Screenreader-Nutzer, wie viele Zeichen noch übrig sind.

5. Bezahlung

Zahlungsformulare müssen alle Anforderungen an barrierefreie Formulare erfüllen: Labels, Fehlermeldungen, Tastatur-Bedienbarkeit. Wenn du einen externen Zahlungsanbieter einbindest (PayPal, Stripe), prüfe, ob dessen Checkout-Seite ebenfalls barrierefrei ist.

Anlass-Filter und Produktkategorien

Viele Floristen-Shops bieten Filter nach Anlass: Hochzeit, Trauer, Geburtstag, Valentinstag, Muttertag. Diese Filter müssen:

• Per Tastatur aktivierbar sein (WCAG SC 2.1.1)
• Über einen sichtbaren Fokus-Indikator verfügen (WCAG SC 2.4.7)
• Den aktiven Zustand nicht nur farblich, sondern auch textuell oder per Icon kennzeichnen — Farbe allein reicht nicht (WCAG SC 1.4.1 Benutzung von Farbe)
• Die Ergebnisliste dynamisch aktualisieren und dies per aria-live ankündigen

Blumen-Konfigurator und individuelle Sträuße

Wenn du einen Konfigurator für individuelle Sträuße anbietest, muss jede Auswahloption (Blumenart, Farbe, Größe) ein Text-Label haben (WCAG SC 4.1.2). Vorschaubilder müssen beschrieben werden. Der Warenkorb-Button muss per Tastatur erreichbar sein.

Biete immer eine Text-Alternative zum visuellen Konfigurator an — z. B. ein einfaches Formular mit Dropdown-Menüs. Nicht jeder Nutzer kann (oder möchte) einen Drag-and-Drop-Konfigurator bedienen.

Was kostet die Umsetzung für Floristen?

Die gute Nachricht: Viele Maßnahmen sind mit überschaubarem Aufwand umsetzbar. Die größten Hebel:

• Alt-Texte ergänzen: 1–2 Stunden für einen typischen Shop mit 30–50 Produktbildern
• Formulare nachbessern: Labels und Fehlermeldungen hinzufügen dauert meist wenige Stunden
• Datepicker austauschen: Barrierefreie Datepicker-Bibliotheken sind kostenlos verfügbar
• Kontraste anpassen: Farbwerte im CSS ändern — Aufwand minimal

Einen Überblick über typische Kosten und Budget-Planung findest du in unserem separaten Ratgeber. Für einen schnellen Erst-Check nutze unseren kostenlosen BFSG-Scanner.

Häufig gestellte Fragen