BFSG für Apotheken: Online-Apotheke und Webshop barrierefrei machen

Online-Apotheken und BFSG: Warum hier besonders strenge Anforderungen gelten

Online-Apotheken sind als E-Commerce-Plattformen klar vom BFSG erfasst. Gemäß § 1 Abs. 2 BFSG fallen Dienstleistungen im elektronischen Geschäftsverkehr unter die Barrierefreiheitspflicht – und dazu gehören Online-Apotheken und Apotheken-Webshops ohne Ausnahme.

Dazu kommt ein entscheidender Faktor: Apotheken verkaufen Gesundheitsprodukte an Menschen, die oft alters- oder krankheitsbedingt Einschränkungen haben. Sehbehinderungen, motorische Einschränkungen oder kognitive Beeinträchtigungen sind in der Zielgruppe überdurchschnittlich vertreten. Barrierefreiheit ist hier nicht nur Pflicht, sondern direkt geschäftsrelevant.

Wer seine Online-Apotheke barrierefrei macht, erreicht mehr Kunden und erfüllt gleichzeitig das BFSG.

YMYL-Relevanz: Gesundheitsinformationen tragen besondere Verantwortung

Online-Apotheken fallen in die Kategorie YMYL (Your Money or Your Life). Fehlerhafte oder unzugängliche Gesundheitsinformationen können reale gesundheitliche Konsequenzen haben. Wenn ein sehbehinderter Mensch die Dosierungsanweisung nicht lesen kann oder ein Screenreader die Wechselwirkungs-Warnung nicht vorliest, wird Barrierefreiheit zur Frage der Patientensicherheit. Weitere Informationen finden Sie im BFSG-Glossar.

Das bedeutet: Die Anforderungen an Klarheit, Zugänglichkeit und Verständlichkeit sind bei Apotheken-Webseiten höher als bei einem durchschnittlichen Online-Shop. Sowohl Google (E-E-A-T-Bewertung) als auch die Marktüberwachungsbehörden schauen bei Gesundheitsangeboten genauer hin.

Kritische Stellen in Online-Apotheken

Medikamenten-Beipackzettel als nicht-barrierefreies PDF. Dosierungsanweisungen in zu kleiner Schrift. Wechselwirkungs-Checker, die nur per Maus funktionieren – ein Verstoß gegen WCAG SC 2.1.1 (Tastatur).

Produktbilder von Medikamenten-Verpackungen ohne Alt-Text – Verstoß gegen WCAG SC 1.1.1 (Nicht-Text-Inhalt). Rezept-Upload-Funktionen ohne barrierefreie Dateiauswahl. Und: Warenkorb-Hinweise („Achtung: rezeptpflichtig“), die nur farblich markiert sind – Verstoß gegen WCAG SC 1.4.1 (Benutzung von Farbe).

Auch die Navigation und Menüführung ist bei Apotheken-Shops oft problematisch: Mega-Menüs mit hunderten Produktkategorien, die per Tastatur nicht erreichbar sind.

Medikamenten-Suche barrierefrei gestalten

Die Medikamenten-Suche ist das Herzstück jeder Online-Apotheke. Damit sie barrierefrei funktioniert, müssen mehrere WCAG-Kriterien erfüllt sein:

• Suchfeld mit sichtbarem Label – nicht nur ein Placeholder-Text, sondern ein echtes <label>-Element (WCAG SC 3.3.2).
• Autocomplete-Vorschläge per Tastatur navigierbar – mit Pfeiltasten durch Vorschläge navigieren und mit Enter auswählen (SC 2.1.1).
• Suchergebnisse als aria-live-Region – damit Screenreader „12 Ergebnisse gefunden“ vorlesen (SC 4.1.3).
• Filter und Sortierung – Checkboxen und Dropdowns für Darreichungsform, Hersteller oder Preis müssen korrekte Labels haben.

Tipp: Teste die Suche einmal komplett nur mit der Tastatur – vom Eingeben des Medikamentennamens bis zum Hinzufügen in den Warenkorb.

Wechselwirkungs-Checker: Interaktive Tools barrierefrei umsetzen

Viele Online-Apotheken bieten Wechselwirkungs-Checker an, mit denen Kunden prüfen können, ob sich ihre Medikamente vertragen. Diese Tools sind oft als JavaScript-Widgets implementiert – und häufig nicht barrierefrei.

So machst du den Checker BFSG-konform:

• Eingabefelder mit Labels – jedes Medikamenten-Eingabefeld braucht ein sichtbares Label gemäß WCAG SC 3.3.2.
• Tastatur-Bedienbarkeit – Medikamente hinzufügen, entfernen und die Prüfung starten – alles per Tastatur (SC 2.1.1).
• Ergebnisse nicht nur als Farb-Ampel – Rot/Gelb/Grün reicht nicht. Ergänze immer Text und Icons (SC 1.4.1).
• Warnungen als role="alert" – damit Screenreader kritische Wechselwirkungen sofort vorlesen.

Medikamenten-Informationen barrierefrei bereitstellen

Beipackzettel als HTML-Text auf der Produktseite anbieten (nicht nur als PDF). Dosierungshinweise in ausreichender Schriftgröße und mit gutem Kontrast – mindestens 4,5:1 gemäß WCAG SC 1.4.3. Warnhinweise nicht nur farblich, sondern auch mit Icon und Text kennzeichnen.

Produktbilder mit Alt-Text, der Produktname, Wirkstoff und Dosierung nennt. Und: Allergiker-Informationen prominent und als Text darstellen – nicht als Bild einer Tabelle.

Bei PDFs, die du ergänzend anbietest: Nutze Tagged-PDF-Struktur mit korrekten Leserichtungen. Bild-Scans von Beipackzetteln sind keine barrierefreien PDFs.

Rezept-Upload und E-Rezept barrierefrei

Die Rezept-Upload-Funktion muss per Tastatur bedienbar sein (WCAG SC 2.1.1). Datei-Upload-Buttons brauchen klare Labels gemäß SC 3.3.2. Statusmeldungen („Rezept eingegangen“, „wird geprüft“, „freigegeben“) müssen für Screenreader sichtbar sein (aria-live="polite").

E-Rezept-Integration muss den gleichen Standards folgen. Und: Der gesamte Bestell-Prozess vom Medikament bis zur Bezahlung muss per Tastatur navigierbar sein.

Achte besonders auf barrierefreie Formulare: Fehlermeldungen beim Upload („Datei zu groß“, „Falsches Format“) müssen klar kommuniziert werden – nicht nur als rote Umrandung, sondern als Text, der dem Formularfeld zugeordnet ist (SC 3.3.1).

Filialsuche und Kartenintegration

Viele Apotheken bieten eine Filialsuche mit interaktiver Karte an. Das Problem: Google Maps und ähnliche Karten-Widgets sind für Screenreader praktisch unsichtbar und per Tastatur schwer bedienbar.

Die Lösung: Biete immer eine textbasierte Alternative an. Eine durchsuchbare Liste mit Filialname, Adresse, Öffnungszeiten und Telefonnummer erfüllt die Anforderung. Die Karte darf als visuelles Extra bestehen bleiben – aber die Informationen müssen auch ohne sie zugänglich sein.

Tipp: Verwende für die Kartendarstellung ein aria-hidden="true" und stelle sicher, dass die textbasierte Liste direkt darunter oder daneben steht.

Schritt für Schritt: Online-Apotheke BFSG-konform machen

Hier ist ein pragmatischer Fahrplan, um deine Online-Apotheke barrierefrei zu machen:

1. Bestandsaufnahme: Scanne deine Seite mit dem bf-check Scanner und identifiziere die größten Barrieren.
2. Beipackzettel umstellen: PDF-Beipackzettel als HTML-Text auf den Produktseiten einbinden. Bestehende PDFs als Tagged-PDF neu erstellen.
3. Alt-Texte ergänzen: Jedes Produktbild braucht einen beschreibenden Alt-Text mit Produktname, Wirkstoff und Darreichungsform.
4. Formulare prüfen: Rezept-Upload, Kontaktformular, Checkout – alle Formulare auf Labels und Fehlermeldungen testen.
5. Navigation testen: Gesamte Seite per Tastatur durchnavigieren – von der Startseite bis zur Bestellbestätigung.
6. Kontraste prüfen: Besonders bei Dosierungshinweisen, Warnungen und kleiner Schrift (mindestens 4,5:1).
7. Screenreader-Test: Mit NVDA (kostenlos) oder VoiceOver die wichtigsten User-Journeys durchspielen.

Hinweis: Dieser Artikel dient der allgemeinen Information und ersetzt keine individuelle Rechtsberatung. Die konkreten BFSG-Anforderungen können je nach Geschäftsmodell und Angebotsumfang variieren. Im Zweifelsfall konsultiere einen spezialisierten Anwalt.

Häufig gestellte Fragen