Leitfaden: Barrierefreiheit

Inhalt

Ab dem 28. Juni 2025 verpflichtet das Barrierefreiheitsstärkungsgesetz (BFSG) viele Unternehmen, ihre Webseiten barrierefrei zu gestalten. Ziel ist, digitale Angebote für alle zugänglich zu machen – etwa durch Screenreader-Kompatibilität, klare Navigation und verständliche Inhalte.
Die Umsetzung ist komplex und teilt sich in 2 Bereiche auf:
Anpassungen im Template und Web-System
Dinge, die ein Redakteur bei der Pflege beachten muss
Um die Barrierefreiheit zu garantieren, sollte bei der Veröffentlichung eines Inhalts ein Barrierefreiheitscheck durchgeführt werden. Hierzu empfehlen wir 2 Tools:
Silktide: kostenfreies Browser-AddOn, mit dem einzelne Seiten geprüft werden können
ScreamingFrog: kostenpflichtes Offline-Tool, mit dem die komplette Webseite geprüft werden kann
weniger Empfehlenswert: Lighthouse → Accessibility-Test. Testet zu oberflächlich und zeigt deshalb nicht alle Probleme an.
Hinweis: Die unterschiedlichen Programme finden auch unterschiedliche Probleme. Teilweise werden auch Probleme erkannt, die nach näherer Betrachtung nicht vorhanden sind.

Barrierefreiheits-Probleme: Tipps + Lösungsansätze für Redakteure

Hinweise:

Die folgenden Lösungsansätze beziehen sich ausschließlich auf bee.tools Websysteme.
Ob die Lösungen funktionieren, hängt vom Eingabe-Element und dem individuellen Styling Ihrer Webseite ab.
Möglicherweise sind Klassen und Einstellungen, die hier genannt werden, in Ihrem Styling, in Ihren individuellen Eingabe-Templates nicht vorhanden.

Bei Fragen wenden Sie sich bitte an unseren Support.

Mehrere nacheinander folgende Links im Text

Mehrere nacheinanderfolgende Links müssen als Liste ausgegeben werden.

Um bei den bee.tools Web-Systemen die Listenpunkte zu entfernen, tragen Sie im Textblock-Feld „CSS-Klasse(n) für Text / Liste“ den Wert „sim“ ein.
Sollen die Listenwerte nebeneinander angeordnet werden, verwenden Sie zusätzlich die Angabe
- inlinestart, wenn die Listenpunkte links angeordnet werden sollen
- inlinecenter, wenn die Listenpunkte mittig angeordnet werden sollen
- inlineend, wenn die Listenpunkte rechts angeordnet werden sollen

Text Farbkontrast zum Hintergrund

Der Text muss klar lesbar sein. Vor allem bei Elementen, die als Hintergrundfarbe eine der Unternehmens-CI-Farben oder Hintergrundbilder verwenden, taucht das Problem häufig auf.
Regel: https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html#contrast-ratiodef

Keine Farben über den Editor setzen.
Eine andere Hintergrundfarbe über die CSS-Klasse setzen oder ein anderes Hintergrundbild wählen.
Eine andere CSS-Klasse für den Text wählen.

Mehrere Links mit gleicher Bezeichnung, aber unterschiedlichem Ziel

Mehrere Links mit der gleichen Bezeichnung, dürfen nur immer auf das gleiche Ziel zeigen.
Regel: https://www.w3.org/WAI/WCAG21/Understanding/link-purpose-in-context