Was sind barrierefreie Schriftarten?

Barrierefreie Schriftarten sind Fonts, die so gestaltet sind, dass Texte für möglichst viele Menschen gut lesbar bleiben, auch bei Sehbehinderung, Leseschwäche oder kognitiven Einschränkungen. Sie zeichnen sich durch klar unterscheidbare Buchstabenformen, ausreichende Strichstärke, großzügige Laufweite und offene Innenräume aus. Auf Bildschirmen erfüllen vor allem serifenlose Schriften wie Inter, Atkinson Hyperlegible Next, Lexend, Open Sans oder Source Sans 3 diese Kriterien.

Für barrierefreies Webdesign reicht die Wahl einer guten Schrift allein nicht aus. Erst die Kombination aus passender Schriftart, ausreichendem Farbkontrast, relativen Schriftgrößen und einer logischen Lesereihenfolge macht eine Website wirklich zugänglich. Wer die Anforderungen aus WCAG 2.2 erfüllt, deckt damit auch die typografischen Pflichten aus dem Barrierefreiheitsstärkungsgesetz ab, das seit Juni 2025 für viele B2C Angebote gilt.

Seit der Veröffentlichung von Atkinson Hyperlegible Next im Februar 2025 und der breiten Verbreitung von Inter als UI Standard hat sich der Markt für Open Source Accessibility Fonts spürbar professionalisiert. Wir zeigen in diesem Glossareintrag, welche Schriftarten für welchen Use Case wirklich passen und welche Best Practices sich in NCA Beratungsprojekten bewährt haben.

NCA arbeitet seit Jahren an barrierefreien Webprojekten für Kunden aus Industrie, Mittelstand und Public Sector. Typografie ist dabei ein wiederkehrender Hebel: In der überwiegenden Mehrheit der Audits, die wir nach Inkrafttreten des Barrierefreiheitsstärkungsgesetzes 2025 durchgeführt haben, war die Schriftwahl oder Schriftgrößen Skalierung Teil der Mängelliste. Wir kennen den Unterschied zwischen einer Schrift, die im Designtool gut aussieht, und einer Schrift, die unter realen Screenreader und Zoom Bedingungen funktioniert.

Wenn ihr eure Website auf WCAG 2.2 und BFSG ausrichten wollt, unterstützen wir an der Schnittstelle aus barrierefreiem Webdesign und Frontend Engineering. Wir helfen bei der Schriftauswahl im Kontext eures Design Systems, prüfen Lesbarkeit und Farbkontraste, bauen relative Schriftgrößen sauber in CSS ein und automatisieren das Testing mit axe DevTools und Cypress. Für strategische Fragen rund um BFSG Compliance, Lighthouse Audits und Accessibility Testing bringen wir Erfahrung aus zahlreichen Projekten ein.

Schrift transportiert auf Websites zwischen 80 und 95 Prozent aller Informationen. Wer hier eine schlecht lesbare Schrift wählt, verliert Nutzer schon bevor das Design irgendetwas anderes leisten kann. Für Menschen mit Sehbehinderung, Legasthenie, ADHS oder altersbedingter Makuladegeneration entscheidet die Schriftwahl darüber, ob Inhalte zugänglich sind oder nicht.

Die Web Content Accessibility Guidelines formulieren keine festen Vorgaben für eine konkrete Schriftart. Sie stellen aber klare Anforderungen an Kontrast, Skalierbarkeit auf 200 Prozent ohne horizontales Scrollen und an die Anpassbarkeit von Zeilenabständen und Buchstabenabständen. Das schließt indirekt viele schlecht gestaltete Custom Fonts aus, weil sie diese Anforderungen nicht erfüllen.

Mit dem Barrierefreiheitsstärkungsgesetz ist Barrierefreiheit für viele B2C Anbieter seit dem 28. Juni 2025 verpflichtend. Wer einen Onlineshop, eine Banking App, eine Buchungsplattform oder ein E Book Angebot betreibt, muss Texte so darstellen, dass sie von Screenreadern, Zoom Software und alternativen Eingabegeräten verarbeitet werden können. Die Schriftwahl ist dabei einer der ersten Hebel im Accessibility Audit.

• Lesbarkeit: Klare Buchstabenformen helfen allen Nutzern, besonders Menschen mit Sehschwäche
• Wiedererkennbarkeit: Distinkte Glyphen verhindern Verwechslungen wie I, l, 1 oder 0, O, Q
• Skalierbarkeit: Schriften müssen sich auf 200 Prozent vergrößern lassen ohne Layoutbrüche
• Performance: Variable Fonts reduzieren Ladezeiten und verbessern die User Experience
• Lizenz: SIL Open Font License oder Apache 2.0 ermöglichen DSGVO konformes Self Hosting

Eine Schrift gilt nicht automatisch als barrierefrei, nur weil sie serifenlos ist. Atkinson Hyperlegible Next, Inter und Lexend setzen sich gegen andere Sans Serif Schriften deshalb durch, weil sie eine Reihe konkreter Designentscheidungen treffen, die in der Forschung zur Schriftlesbarkeit als wirksam belegt sind.

1. Klare, unterscheidbare Buchstabenformen: Ähnliche Glyphen wie das große I, kleines l und die Ziffer 1 oder das große O und die Ziffer 0 müssen klar voneinander zu unterscheiden sein. Atkinson Hyperlegible löst das mit einer geschnittenen Null und einem Punkt auf dem kleinen i.
2. Hohe x Höhe: Die Höhe der Kleinbuchstaben ohne Ober und Unterlängen entscheidet maßgeblich über die Lesbarkeit bei kleinen Schriftgrößen. Inter und Source Sans 3 haben eine bewusst hohe x Höhe.
3. Großzügige Laufweite: Buchstabenabstände sollten nicht zu eng sein, damit Wörter klar als Einheiten erkennbar bleiben. Lexend nutzt explizit erweiterte Laufweiten als Designprinzip.
4. Offene Innenräume: Buchstaben wie a, c, e, o brauchen offene Counter, damit sie nicht ineinander verlaufen. Geschlossene Counter wie bei manchen geometrischen Schriften schaden der Lesbarkeit.
5. Gleichmäßige Strichstärke: Starke Kontraste zwischen dünnen und dicken Strichen erschweren das Lesen bei niedrigen Kontrasten oder kleinen Größen. Humanistische Sans Serif Schriften lösen das deutlich besser als geometrische.
6. Eigenständige Akzente und Umlaute: Für deutsche Webseiten essentiell. Manche US Schriften behandeln ä, ö, ü, ß stiefmütterlich oder mit zu eng gesetzten Punkten.
7. Variable Font Support: Variable Fonts erlauben feinjustierbare Gewichte und sind performanter als mehrere statische Dateien. Inter und Atkinson Hyperlegible Next sind als Variable Fonts verfügbar.

Wer diese Kriterien an die Auswahl anlegt, landet automatisch bei einer überschaubaren Menge an wirklich geeigneten Schriften. Daran orientieren wir uns auch in unseren Accessibility Webdesign Projekten.

Auf Basis aktueller Releases und unserer Bewertung in Beratungsprojekten ergibt sich für 2026 ein klares Bild. Diese Open Source Schriften sind alle SIL OFL lizenziert, kostenlos nutzbar und für Self Hosting geeignet.

• Atkinson Hyperlegible Next: Im Februar 2025 vom Braille Institute veröffentlicht, sieben Gewichte, Variable Font, Unterstützung für über 150 Sprachen. Die einzige Schrift, die explizit für Low Vision Leser entworfen wurde und gleichzeitig professionell genug aussieht für UI Einsatz. Klare Favoritin für Texte, die maximale Lesbarkeit brauchen.
• Inter: Mit Abstand am weitesten verbreitete Open Source UI Schrift. Variable Font, neun Gewichte, hervorragende x Höhe, perfekt für Web Apps und Dashboards. Wir setzen Inter in vielen Frontend Projekten als Default ein.
• Lexend: Von Bonnie Shaver Troup entwickelt, mit Studien belegte Verbesserung der Lesegeschwindigkeit. Sieben Varianten mit unterschiedlicher Laufweite, ideal für Plattformen mit hohem Anteil an Leseschwachen Nutzern oder ADHS Betroffenen.
• Source Sans 3: Von Adobe gepflegt, sechs Gewichte, sehr ausgewogen, gut für klassisches Webdesign und Print Materialien. Solider Default für Corporate Websites.
• Open Sans: Klassiker von Google Fonts, sehr breit verfügbar, sehr gut lesbar, niedrige Risikoauswahl. Wird gerne unterschätzt, ist aber bis heute eine starke Wahl für Standardtexte.
• Roboto Flex: Die Variable Font Version des Roboto Klassikers von Google. 16 Achsen, extrem flexibel, gut für responsive Typografie auf verschiedenen Endgeräten.
• Verdana: Speziell für Bildschirmlesbarkeit designed, auf praktisch jedem System installiert. Gute Notlösung für E Mail Vorlagen und Fallback Stacks ohne Web Font Loading.
• Arial: Auf praktisch jedem System verfügbar, akzeptable Lesbarkeit, aber keine erste Wahl mehr für moderne Webprojekte. Brauchbar als System Fallback in der Font Stack Kaskade.

Mit Serifenschriften lässt sich ebenfalls barrierefreies Design realisieren. Georgia, Merriweather und Source Serif 4 sind belastbare Optionen, wenn ihr aus inhaltlichen Gründen eine Serifenschrift braucht, etwa für Magazinprojekte oder lange Fließtexte.

Im Februar 2025 hat das Braille Institute zusammen mit Applied Design die zweite Generation der Atkinson Hyperlegible Familie veröffentlicht. Die Schrift wurde von zwei auf sieben Gewichte erweitert, unterstützt jetzt 150 statt 27 Sprachen, gibt es als Variable Font und als Monospace Variante für Code Editoren. Das macht sie zur ersten echten Accessibility Schrift, die auch für anspruchsvolles UI Design taugt.

Der Designansatz unterscheidet sich von klassischen Sans Serif Schriften deutlich. Atkinson Hyperlegible bricht bewusst mit typografischer Uniformität und macht jede Glyphe maximal unterscheidbar. Konsequenzen dieser Designentscheidungen:

• Geschnittene Null: Die Ziffer 0 hat einen Diagonalstrich, sodass sie nicht mit dem Buchstaben O verwechselt werden kann
• Distinkte Spurs und Tails: Buchstaben wie q, g, J haben markante Schwünge, die sie eindeutig identifizierbar machen
• Offene Counter: a, c, e, s haben großzügige Innenräume und wirken auch bei kleinen Größen offen
• Asymmetrische Punkte: Der Punkt auf dem kleinen i und j ist bewusst nicht rund, sondern leicht abgesetzt

Wer eine Website für Healthcare, Versicherungen, öffentliche Verwaltung oder Banking baut, also Branchen mit überdurchschnittlichem Anteil älterer Nutzer, sollte Atkinson Hyperlegible Next ernsthaft prüfen. Die Schrift ist über Google Fonts, das Braille Institute und als selbstgehostete Variante kostenlos verfügbar.

Schriftarten, die speziell für Menschen mit Legasthenie entwickelt wurden, polarisieren in der Fachwelt. Die populärste Vertreterin OpenDyslexic wird in der Praxis viel eingesetzt, etwa auf Kindle Geräten oder als Browser Extension, hat aber in Studien keinen messbar besseren Effekt als gut gestaltete Sans Serif Schriften erzielt. Die Studien von Rello und Baeza Yates 2013 sowie die Masterarbeit von Leeuw 2010 fanden keinen signifikanten Vorteil bei Lesezeit oder Augenfixierung.

Lexend hat eine andere Datenlage. Bonnie Shaver Troup und Thomas Jockin haben die Schrift 2018 auf Basis empirischer Forschung zur Reduktion visuellen Stresses entwickelt. Studien zur Lesegeschwindigkeit bei Schulkindern zeigen messbare Verbesserungen gegenüber Times New Roman, sowohl bei Wörtern pro Minute als auch beim Textverständnis. Lexend wird von Google Fonts gepflegt und in mehreren Varianten mit unterschiedlicher Laufweite angeboten.

Unsere Einordnung für NCA Beratungsprojekte:

• OpenDyslexic: Geeignet als optionale Schriftumstellung im User Interface, wenn Nutzer sie aktiv wählen können. Nicht geeignet als Default für eine ganze Website, weil die Wirksamkeit umstritten ist und das Layout deutlich beeinflusst
• Lexend: Geeignet als Default Schrift für Plattformen mit hohem Anteil von Nutzern mit Lese oder Konzentrationsschwierigkeiten, Edu Plattformen, Therapie und Lernsoftware
• Atkinson Hyperlegible Next: Geeignet als professionelle Default Schrift für Branchen mit Low Vision Zielgruppen

Für die meisten kommerziellen Websites empfehlen wir, statt einer Spezialschrift eine sehr gut lesbare Standardschrift wie Inter oder Atkinson Hyperlegible Next zu wählen und parallel über Zoom und Anpassbarkeit der Schriftgröße auf individuelle Bedürfnisse einzugehen.

Die richtige Schriftwahl ist die halbe Miete. Die andere Hälfte entscheidet sich in der CSS Implementierung. Folgende Patterns haben sich in NCA Projekten bewährt:

1. Relative Schriftgrößen statt fester Pixel: Verwendet rem für Schriftgrößen, damit Nutzer mit Browser Zoom oder System Font Size Settings die Schrift skalieren können
2. 16 Pixel Mindestgröße: Body Text sollte mindestens 1rem entsprechen, also bei Standard Settings 16 Pixel. Kleinere Schriften wie 14 Pixel sind nur für sekundäre Inhalte vertretbar
3. Zeilenhöhe 1.5 bis 1.6: Großzügige Zeilenhöhe verbessert die Lesbarkeit deutlich, besonders für Menschen mit ADHS oder kognitiven Einschränkungen
4. Linksbündig statt Blocksatz: Blocksatz erzeugt unregelmäßige Wortabstände und ist für Leseschwache schwierig. Linksbündiger Text ist die WCAG konforme Wahl
5. Zeilenlänge 50 bis 75 Zeichen: Setzt max width auf circa 65ch für Fließtext Container, das ist die typografisch optimale Zeilenlänge
6. Variable Fonts mit font display swap: Reduziert Layout Shifts und verhindert das berüchtigte Flash of Invisible Text während des Font Loadings
7. Self Hosting statt Google Fonts CDN: Für DSGVO konformes Hosting ladet die Schriftarten von der eigenen Domain, das ist auch performanter

Ein typisches CSS Setup für eine barrierefreie Website sieht so aus:

Wer das in einem bestehenden Frontend professionell einbauen will, profitiert davon, das Setup in einem Design Token System zu pflegen. Wir helfen bei der Integration im Rahmen unseres Accessibility Webdesign Consultings und prüfen die Umsetzung mit Lighthouse Audits und automatisierten axe DevTools Tests in Cypress.

Das Barrierefreiheitsstärkungsgesetz verweist für die technischen Anforderungen auf die harmonisierte Norm EN 301 549, die wiederum auf WCAG 2.1 Level AA aufbaut. Für Schriftarten ergeben sich daraus konkrete Pflichten, die seit dem 28. Juni 2025 für viele B2C Angebote rechtlich bindend sind.

• WCAG 1.4.3 Kontrast Minimum: Text gegenüber Hintergrund mindestens 4.5 zu 1, große Schrift ab 18pt oder 14pt fett mindestens 3 zu 1
• WCAG 1.4.4 Textgröße anpassen: Nutzer müssen Text auf 200 Prozent vergrößern können ohne Verlust von Inhalten oder Funktionalität
• WCAG 1.4.5 Bilder von Text: Inhalte als echter Text statt als Grafik, damit Screenreader Vergrößerung und Anpassung möglich bleiben
• WCAG 1.4.8 Visuelle Darstellung: Auf AAA Niveau gelten Vorgaben zu Zeilenlänge, Zeilenabstand und Blocksatz, die wir auch auf AA Projekten empfehlen
• WCAG 1.4.12 Textabstand: Wenn Nutzer Zeilenabstand auf 1.5, Buchstabenabstand auf 0.12em oder Wortabstand auf 0.16em setzen, dürfen keine Inhalte verloren gehen

Für Onlineshops, Banking, Versicherungen, E Book Reader, Buchungsplattformen und elektronische Kommunikationsdienste sind diese Anforderungen verpflichtend. Bei Verstößen drohen Bußgelder bis 100.000 Euro und Abmahnungen durch Verbände wie den BSK. Wir bieten Compliance Audits mit konkreter Mängelliste und priorisierter Roadmap, mit der Teams in 4 bis 12 Wochen BFSG ready werden.

Seit dem Inkrafttreten des Barrierefreiheitsstärkungsgesetzes im Juni 2025 haben wir zahlreiche Compliance Audits durchgeführt. Drei Muster begegnen uns dabei immer wieder, und sie betreffen alle die Typografie.

Muster 1: Hipster Custom Fonts ohne Accessibility Prüfung. Designer wählen eine geometrische Display Schrift wie Avenir Next, Futura oder eine eigene Brand Font, weil sie im Moodboard gut aussieht. Im Produktiveinsatz scheitern diese Schriften an der Lesbarkeit bei kleinen Größen, fehlenden Gewichten oder mangelhafter Glyphen Unterscheidung. Unsere Empfehlung: Display Schriften nur in Headlines einsetzen, für Body Text eine geprüfte Schrift wie Inter, Atkinson Hyperlegible Next oder Source Sans 3.

Muster 2: Feste Pixelgrößen statt rem. Wir sehen häufig CSS mit font size in Pixeln gesetzt, oft 14 Pixel für Body Text. Browser Zoom funktioniert dadurch zwar noch, aber die System Font Size Einstellungen vieler Nutzer werden ignoriert. Das verstößt direkt gegen WCAG 1.4.4. Die Lösung ist trivial: rem oder em als Einheit, 16 Pixel Mindestgröße im Body.

Muster 3: Schlechte Schriftdarstellung im Print Stylesheet. Wer barrierefrei denkt, denkt auch an Print Layouts. Nutzer mit Sehbehinderung drucken Seiten häufig aus, um sie offline mit Lupe zu lesen. Die meisten Print Stylesheets ignorieren das. Unsere Empfehlung: Im print Media Query Serifen oder mindestens 12pt Schriftgröße verwenden, Hintergrundfarben entfernen und ausreichende Kontraste sicherstellen.

In unseren Accessibility Beratungsprojekten arbeiten wir die Schriftthemen typischerweise in der ersten Sprintwoche ab. Das geht schnell, hat aber massiven Effekt auf die spätere Lesbarkeit. Wer Hilfe bei der Umstellung braucht, kann sich an uns wenden. Wir haben Erfahrung mit CSS Refactorings, Design Token Migration und der Integration in Cypress Accessibility Tests.

Hier findet ihr die wichtigsten Fragen rund um barrierefreie Schriftarten, BFSG Compliance, technische Umsetzung und Tool Empfehlungen, gebündelt aus typischen Fragen unserer Beratungsprojekte.