Eine barrierefreie Website: Was kleine Unternehmen beachten sollten

Eine barrierefreie Website soll Menschen den Zugang zu Ihrem Angebot ermöglichen, auch wenn sie schlecht sehen, keine Maus bedienen können oder sich Inhalte vorlesen lassen. Für einen Handwerksbetrieb, eine Praxis oder ein Geschäft betrifft das ganz praktische Dinge: Leistungen verstehen, Kontaktdaten finden und eine Anfrage abschicken.

Dafür genügt es nicht, die Schrift etwas größer zu machen. Inhalte, Gestaltung und Technik müssen zusammenspielen. Ich zeige Ihnen, worauf Sie achten können und wo eine fachliche Prüfung sinnvoll ist. Rechtliche Fragen klären Sie mit Ihrem Rechtsberater. Rechtstexte wie Impressum, Datenschutz und AGB kommen ebenfalls von Ihrem Rechtsberater; ich binde sie technisch ein.

Was eine barrierefreie Website im Alltag bedeutet

Menschen nutzen Websites auf unterschiedliche Weise. Manche navigieren mit der Tastatur statt mit der Maus. Andere verwenden einen Screenreader, also ein Programm, das Inhalte vorliest oder über eine Braillezeile ausgibt. Wieder andere benötigen starke Kontraste oder eine deutlich vergrößerte Darstellung.

Eine Hürde entsteht beispielsweise, wenn ein Menü nur auf Mausbewegungen reagiert. Ebenso problematisch ist ein Formular, das Fehler ausschließlich durch rote Rahmen kennzeichnet. Wer die Farbe nicht erkennt, erfährt nicht, was korrigiert werden soll.

Als fachliche Grundlage dienen die WCAG, internationale Leitlinien für zugängliche Webinhalte. Sie liefern konkrete Prüfkriterien. Für Sie als Inhaber ist vor allem wichtig: Nicht allein das Aussehen zählt, sondern ob Besucher die vorgesehenen Aufgaben tatsächlich erledigen können.

Lesbarkeit und verständliche Inhalte gehören zusammen

Eine ruhige Gestaltung hilft bei der Orientierung. Entscheidend ist jedoch, wie einzelne Inhalte umgesetzt sind. Achten Sie besonders auf diese Punkte:

• Kontraste: Text und Bedienelemente sollten sich deutlich vom Hintergrund abheben. Hellgraue Schrift auf weißem Grund kann schwer lesbar sein.
• Vergrößerung: Bei vergrößerter Browserdarstellung sollten Texte lesbar bleiben und Schaltflächen nicht verschwinden oder Inhalte verdecken.
• Überschriften: Sie gliedern die Seite in nachvollziehbare Abschnitte. Technisch müssen sie als Überschriften ausgezeichnet sein, nicht nur größer oder fett aussehen.
• Linktexte: „Mehr über unsere Badsanierung“ beschreibt das Ziel verständlicher als ein alleinstehendes „Hier klicken“.
• Informationen ohne Farbrätsel: Hinweise sollten durch Text oder verständliche Symbole erkennbar sein, nicht ausschließlich durch eine Farbe.

Bilder benötigen passende Textalternativen, wenn sie Informationen vermitteln. Beschreiben Sie dabei den Inhalt, der im jeweiligen Zusammenhang wichtig ist. Rein dekorative Bilder sollten vom Vorleseprogramm übersprungen werden können. Wichtige Angaben gehören nicht ausschließlich in eine Grafik.

Bei Videos helfen passende Untertitel, gesprochene Inhalte zugänglich zu machen. Wesentliche Informationen, die nur im Bild vorkommen, brauchen ebenfalls eine zugängliche Alternative. Wie Sie Leistungen verständlich formulieren, erläutere ich im Beitrag Website-Texte schreiben.

Menüs und Formulare müssen ohne Maus funktionieren

Eine gute Einstiegsprüfung ist die Bedienung mit der Tastatur. Mit der Tabulatortaste wechseln Sie zwischen Links, Schaltflächen und Formularfeldern. Dabei sollte jederzeit sichtbar sein, welches Element gerade ausgewählt ist, beispielsweise durch einen deutlichen Rahmen.

Die Reihenfolge muss nachvollziehbar bleiben. Ein geöffnetes Menü oder Dialogfenster darf Besucher nicht festhalten, ohne dass sie es wieder verlassen können. Auch Inhalte, die erst beim Darüberfahren mit der Maus erscheinen, brauchen einen zugänglichen Bedienweg.

Für Kontaktformulare sind insbesondere diese Details wichtig:

• Jedes Feld hat eine sichtbare und technisch zugeordnete Beschriftung.
• Hinweise zum erwarteten Eingabeformat stehen am passenden Feld.
• Fehlermeldungen erklären verständlich, was fehlt oder nicht passt.
• Bereits eingegebene Angaben bleiben bei korrigierbaren Fehlern erhalten.
• Die Bestätigung nach dem Absenden ist auch für Vorleseprogramme wahrnehmbar.

Prüfen Sie außerdem den Schutz vor unerwünschten Nachrichten. Ein schwer erkennbares Bildrätsel kann Menschen von einer Anfrage ausschließen. Hier sollten geeignete Schutzverfahren gewählt werden, die den Zugang nicht unnötig erschweren.

Warum ein Zusatz-Plugin nicht genügt

Manche Erweiterungen blenden ein Menü für größere Schrift, andere Farben oder eine Vorlesefunktion ein. Solche Funktionen können ergänzen. Sie reparieren aber nicht automatisch die Struktur einer Website.

Wenn eine Schaltfläche technisch keine verständliche Bezeichnung hat, fehlt diese Information weiterhin. Wenn ein fremdes Buchungsformular nicht per Tastatur bedienbar ist, löst ein zusätzliches Bedienmenü das Grundproblem nicht.

Zugänglichkeit gehört in die Website selbst. Ich setze deshalb an den betroffenen Inhalten und Funktionen an, statt eine Zusatzfunktion als vollständige Lösung darzustellen. Auch ein unauffälliges Ergebnis eines automatischen Prüfdienstes ist noch kein Beleg dafür, dass sämtliche Besucherwege funktionieren.

So prüfen Sie die wichtigsten Besucherwege

Beginnen Sie mit einer konkreten Aufgabe, nicht mit einer beliebigen Unterseite. Ein Betrieb, der Anfragen über seine Website erhält, könnte beispielsweise den Weg von der Leistungsübersicht bis zur Bestätigung des Kontaktformulars untersuchen.

1. Ohne Maus navigieren: Finden Sie die passende Leistung, öffnen Sie das Menü und erreichen Sie das Formular?
2. Darstellung vergrößern: Bleiben Texte und Bedienelemente erreichbar, auch auf einem schmalen Bildschirm?
3. Fehler bewusst auslösen: Wird verständlich erklärt, weshalb eine Eingabe nicht angenommen wird?
4. Inhalte vorlesen lassen: Sind Überschriften, Linkziele und Feldbezeichnungen nachvollziehbar?
5. Eingebundene Funktionen einbeziehen: Funktionieren auch Buchungen, Karten, Dialogfenster und herunterladbare Dokumente?

Automatische Werkzeuge können unter anderem bestimmte Kontrastprobleme oder fehlende technische Beschriftungen finden. Ob ein Bild sinnvoll beschrieben ist oder eine Fehlermeldung wirklich weiterhilft, braucht dagegen eine inhaltliche Beurteilung.

Für eine belastbare Einschätzung werden automatische Prüfungen mit manuellen Tests kombiniert. Tests mit Menschen, die assistive Technik im Alltag verwenden, können zusätzliche Hürden sichtbar machen. Dokumentieren Sie dabei nicht nur Fehler, sondern auch die untersuchten Seiten und Funktionen.

Praxisbeispiel: klare Struktur bei LED Performance

Bei LED Performance aus Sinsheim-Dühren habe ich die Firmenwebsite komplett neu umgesetzt. Das Unternehmen bietet LED-Beleuchtung für Industrie, Handel, Parkplätze und Sportanlagen an. Der frühere Auftritt zeigte dieses Leistungsspektrum nicht mehr klar.

Ich habe die Inhalte in eindeutige Bereiche gegliedert: Industrie-, Shop-, Parkplatz- sowie Flutlicht- und Sportplatzbeleuchtung. Dazu kamen ein reduziertes Layout mit Fokus auf Projekten und Leistungen, kurze Kontaktwege auf allen Seiten und eine vollständig responsive Umsetzung.

Für das Thema Zugänglichkeit zeigt das Beispiel einen wichtigen Ansatz: Angebote sollten nachvollziehbar geordnet und Kontaktmöglichkeiten leicht auffindbar sein. Eine klare Struktur und mobile Darstellung ersetzen allerdings keine Barrierefreiheitsprüfung. Tastaturbedienung, Kontraste und die Ausgabe durch Vorleseprogramme müssen gesondert untersucht werden.

Was den Aufwand bestimmt und wie Sie Verbesserungen planen

Ob sich eine bestehende Website gezielt verbessern lässt, hängt von ihrer Grundlage ab. Ein unzugängliches Menü kann an einer zentralen Stelle korrigiert werden. Wiederkehrende Probleme in unterschiedlichen Vorlagen oder eingebundenen Fremdsystemen erfordern einen anderen Umfang.

Für die Planung betrachte ich insbesondere die Seitentypen, Formulare, Erweiterungen, Medien und Dokumente. Wichtig ist außerdem, wer Inhalte künftig pflegt. Neue Bilder ohne passende Beschreibungen oder unverständlich benannte Links können wieder Hürden schaffen.

Sinnvoll ist eine nachvollziehbare Reihenfolge: zunächst Hindernisse, die zentrale Aufgaben blockieren, anschließend weitere Mängel in Gestaltung und Inhalten. Nach Änderungen werden die betroffenen Wege erneut geprüft. Wie die laufende technische Betreuung grundsätzlich aufgebaut ist, lesen Sie unter Website Wartung.

Den konkreten Umsetzungs- und Prüfumfang stimmen wir im Erstgespräch ab. Darauf aufbauend erhalten Sie ein Angebot, das die vereinbarten Arbeiten beschreibt.

Der nächste Schritt

Sie möchten eine barrierefreie Website planen oder Hürden im bestehenden Auftritt angehen? Bringen Sie Ihre Website-Adresse und die wichtigsten Aufgaben Ihrer Besucher zum kostenlosen Erstgespräch mit. Gemeinsam klären wir, welche Bestandsaufnahme und welche nächsten Arbeiten sinnvoll sind.

Ich bin Lukas Vosylius, Webentwickler aus Angelbachtal bei Sinsheim. Sie besprechen Ihr Projekt direkt mit mir, nicht mit wechselnden Ansprechpartnern einer Agentur. Mehr über meine Umsetzung neuer und bestehender Firmenwebsites erfahren Sie auf der Leistungsseite Websites & Webentwicklung.

Häufige Fragen

Brauche ich dafür eine komplett neue Website?

Nicht unbedingt. Ob sich Ihr bestehender Auftritt gezielt verbessern lässt, hängt vom technischen Aufbau, der Gestaltung und den verwendeten Erweiterungen ab. Eine Bestandsaufnahme zeigt, welche Hürden sich einzeln beheben lassen und wo grundlegende Änderungen sinnvoll sind.

Reicht ein Plugin für Barrierefreiheit?

Ein Plugin kann einzelne Funktionen ergänzen, behebt aber nicht automatisch unzugängliche Menüs, fehlende Feldbeschriftungen oder eine falsche Lesereihenfolge. Entscheidend ist, dass Inhalte und Funktionen selbst zugänglich umgesetzt und praktisch geprüft werden.

Wie kann ich meine Website selbst auf Barrieren prüfen?

Versuchen Sie, ohne Maus eine Leistung zu finden und das Kontaktformular zu bedienen. Vergrößern Sie anschließend die Darstellung im Browser und achten Sie auf abgeschnittene Inhalte oder verdeckte Schaltflächen. Diese Versuche zeigen mögliche Probleme, ersetzen aber keine umfassende fachliche Prüfung.

Wovon hängt der Aufwand für die Umsetzung ab?

Entscheidend sind die vorhandene technische Grundlage, unterschiedliche Seitentypen, interaktive Funktionen und eingebundene Fremdsysteme. Auch Bilder, Videos und Dokumente können Anpassungen erfordern. Nach dem kostenlosen Erstgespräch erhalten Sie ein Angebot für den vereinbarten Umfang.