BFSG für Autowerkstätten: Online-Terminbuchung und Webseite barrierefrei

BFSG für KFZ-Werkstätten: Wann bist du betroffen?

Als Autowerkstatt denkst du vielleicht, das BFSG geht dich nichts an. Aber: Gemäß § 1 BFSG in Verbindung mit § 2 Nr. 1 fallen digitale Dienstleistungen im B2C-Bereich unter die Barrierefreiheitspflicht. Wenn du einen der folgenden Dienste online anbietest, bist du betroffen:

• Online-Terminbuchung für Inspektionen, HU/AU oder Reifenwechsel
• Werkstatt-Konfiguratoren (Fahrzeug-Auswahl, Service-Pakete)
• Reifenrechner oder Reifengrößen-Finder
• Kostenvoranschlag-Formulare für Reparaturen
• Ersatzteil-Shop mit Online-Bestellung
• Kontaktformulare für Anfragen und Terminwünsche

Und: Immer mehr Kunden erwarten Online-Terminbuchung. Wenn die nicht barrierefrei ist, verlierst du potenzielle Kunden mit Einschränkungen — und riskierst Bußgelder bis 100.000 Euro.

Was auf Werkstatt-Webseiten typisch schiefgeht

Terminbuchungs-Widgets die nur per Maus funktionieren verstoßen gegen WCAG SC 2.1.1 (Tastatur). Preis-Tabellen für Inspektionen als Bild statt als HTML sind für Screenreader unsichtbar — ein Verstoß gegen SC 1.3.1 (Info und Beziehungen). Fahrzeug-Fotos ohne Alt-Texte verletzen SC 1.1.1 (Nicht-Text-Inhalte).

Kontaktformulare mit Dropdown-Menüs die per Tastatur nicht navigierbar sind. Google-Maps-Einbettung ohne Textadresse daneben. Werkstatt-Videos (Reparatur-Tipps, Erklärungen zum Reifenwechsel) ohne Untertitel verstoßen gegen SC 1.2.2. Weitere Informationen finden Sie im BFSG-Glossar.

Häufig übersehen: Öffnungszeiten und Notdienst-Nummern als Bild-Grafik statt als Text. Gerade in Notsituationen (Autopanne) muss jeder Nutzer diese Information schnell finden können.

Online-Terminbuchung barrierefrei: Schritt für Schritt

Die Online-Terminbuchung ist der häufigste digitale Dienst von KFZ-Werkstätten. Hier buchen Kunden Inspektionen, HU/AU-Termine oder Reifenwechsel. So machst du sie BFSG-konform:

Schritt 1: Fahrzeugdaten-Eingabe. Felder für Marke, Modell, Baujahr und Kennzeichen brauchen sichtbare <label>-Elemente (WCAG SC 1.3.1). Nutze autocomplete-Attribute wo möglich, damit Autofill funktioniert.

Schritt 2: Service-Auswahl. Checkboxen oder Radio-Buttons für Inspektion, Ölwechsel, HU/AU etc. müssen per Tastatur auswählbar sein (SC 2.1.1). Jede Option braucht ein Label. Erklärungstexte (z. B. "Inspektion inkl. Ölwechsel und Bremsflüssigkeit") per aria-describedby verknüpfen.

Schritt 3: Kalender-Widget. Das ist die größte Hürde: Viele Datepicker sind per Tastatur nicht bedienbar. Teste: Kann der Nutzer mit Pfeiltasten durch die Tage navigieren? Wird der ausgewählte Tag per Screenreader angesagt? Falls nein, biete ein alternatives Textfeld im Format TT.MM.JJJJ an.

Schritt 4: Bestätigung. Nach dem Absenden muss der Nutzer eine klare Bestätigung erhalten. Nutze role="alert" oder aria-live="assertive", damit Screenreader die Erfolgsmeldung sofort ansagen.

Detaillierte Anleitungen zu barrierefreien Buchungssystemen findest du unter Buchung und Reservierung barrierefrei.

Werkstatt-Konfiguratoren und Reifenrechner

Werkstatt-Konfiguratoren lassen Kunden ihr Fahrzeug auswählen und passende Services oder Reifen finden. Diese interaktiven Tools müssen vollständig per Tastatur bedienbar sein (SC 2.1.1).

Dropdown-Menüs für Marke, Modell und Baujahr brauchen korrekte Labels (SC 1.3.1). Wenn sich die Optionen im zweiten Dropdown ändern, sobald im ersten eine Auswahl getroffen wird (kaskadierend), muss das per aria-live="polite" angekündigt werden.

Reifenrechner mit Größen-Eingabe (z. B. 205/55 R16) sollten klare Eingabehinweise haben. Nutze placeholder als visuellen Hinweis, aber verlasse dich nicht darauf — ein echtes Label ist Pflicht. Ergebnisse müssen als Text ausgegeben werden, nicht nur als Grafik.

Kostenvoranschlag-Formulare barrierefrei

Online-Kostenvoranschläge sind für Werkstätten ein wichtiges Lead-Tool. Kunden beschreiben ihr Problem, laden optional Fotos hoch und erhalten eine Einschätzung. So wird das Formular barrierefrei:

Jedes Feld braucht ein sichtbares Label. Textarea-Felder für die Problembeschreibung brauchen einen Hinweis zur erwarteten Eingabe (SC 3.3.2 — Labels oder Anweisungen). Datei-Upload-Buttons müssen per Tastatur erreichbar sein und der akzeptierte Dateityp muss kommuniziert werden.

Pflichtfelder mit aria-required="true" markieren. Fehlermeldungen müssen konkret sagen, was fehlt (SC 3.3.1). Mehr dazu im Ratgeber Formulare barrierefrei gestalten.

Schnelle Fixes für Werkstatt-Webseiten

Preislisten als HTML-Tabelle einfügen — nicht als Bild oder PDF-Screenshot. Terminbuchung per Tastatur testbar machen. Adresse und Telefonnummer als klickbare Links (tel: und mailto:).

Alle Fahrzeugbilder mit beschreibenden Alt-Texten (z. B. "Reifenwechsel an einem VW Golf in unserer Werkstatt"). Kontaktformular mit korrekten Labels. Öffnungszeiten als Text, nicht als Bild.

Die meisten Fixes dauern weniger als eine Stunde und kosten nichts. Ein guter erster Schritt: Lass deine Webseite kostenlos scannen und sieh dir an, wo die größten Barrieren liegen.

Reifen- und Ersatzteil-Shop barrierefrei

Wenn du online Reifen, Öle oder Ersatzteile verkaufst, muss der gesamte Shop BFSG-konform sein. Produktbilder mit beschreibenden Alt-Texten (Reifenmarke, Größe, Typ). Fahrzeug-Auswahl-Tools per Tastatur bedienbar.

Filter-Optionen (Marke, Modell, Baujahr) mit korrekten Labels (SC 1.3.1). Und der Checkout muss komplett per Tastatur navigierbar sein (SC 2.1.1). Produktbeschreibungen müssen als Text verfügbar sein — nicht nur in Bildern oder PDFs.

Tipp: Teste den gesamten Kaufprozess einmal nur mit der Tastatur. Vom Produktfinden über den Warenkorb bis zur Bestellbestätigung. Wenn du irgendwo hängen bleibst, steckt dort dein Screenreader-Nutzer auch fest. Weitere Hinweise zum Thema Budgetplanung findest du unter Barrierefreiheit: Kosten und Budget.

Checkliste: BFSG-Compliance für KFZ-Werkstätten

• Terminbuchung: Komplett per Tastatur bedienbar, Kalender-Widget getestet
• Preistabellen: Semantische HTML-Tabellen mit <th>-Überschriften
• Kontaktformular: Labels, Pflichtfelder markiert, Fehlermeldungen verknüpft
• Kostenvoranschlag: Formularfelder beschriftet, Upload-Button per Tastatur erreichbar
• Bilder: Alt-Texte für Fahrzeuge, Werkstatt, Team-Fotos
• Google Maps: Textadresse als Alternative daneben
• Videos: Untertitel für Reparatur-Tipps und Erklärvideos
• Öffnungszeiten: Als Text, nicht als Bild-Grafik
• Kontraste: Mindestens 4,5:1 für normalen Text (SC 1.4.3)
• Responsive: Barrierefreiheit auf Smartphone getestet

Hinweis: Dieser Artikel dient der allgemeinen Information und ersetzt keine Rechtsberatung. Für eine verbindliche Einschätzung deiner BFSG-Pflichten wende dich an einen spezialisierten Anwalt.

Häufig gestellte Fragen