Eine gut lesbare Schriftart für Ihre Website auswählen

Man denkt selten daran, und doch ist sie **entscheidend**: die Typografie, also die Auswahl und Gestaltung der Zeichen Ihrer Website. Ein zu kleiner Text, eine unleserliche verschnörkelte Schrift, ein blasses Grau auf weißem Hintergrund, zu lange Zeilen: und der Besucher ermüdet, kneift die Augen zusammen, gibt auf. Umgekehrt vermittelt ein klarer, gut dimensionierter und angenehm lesbarer Text einen seriösen Eindruck und lädt zum Verweilen ein. Eine lesbare Typografie ist keine Frage des künstlerischen Geschmacks: es geht vor allem um Komfort und Barrierefreiheit. Hier erfahren Sie, wie Sie den Text Ihrer Website für alle angenehm und lesbar gestalten.

Warum Lesbarkeit über Ästhetik geht

Die Typografie hat eine viel wichtigere Rolle, als man denkt. Der Text ist das **WESSENTLICHE** Ihrer Website: der größte Teil der Informationen wird über die Wörter vermittelt; wenn der Text schwer lesbar ist, ist alles andere kompromittiert, egal wie schön das Design ist. Die Lesbarkeit hält die **BESUCHER**: ein bequemer Text lädt zum Lesen und Verweilen ein; ein anstrengender Text schreckt ab; der Besucher sollte nie gezwungen sein, Sie zu lesen. Es ist eine Frage der **BARRIEREFREIHEIT**: eine gute Lesbarkeit nützt allen, vor allem aber Menschen mit Sehbehinderungen, Senioren, denen, die auf dem Handy oder unter schlechten Bedingungen lesen; es ist eine Frage der Inklusion. Sie vermittelt **SERIÖSITÄT**: eine sorgfältige und professionelle Typografie beruhigt; eine verschnörkelte Schrift oder ein vernachlässigter Text entwertet. Was macht einen Text **LESBAR**? Eine ausreichende **GRÖSSE**: der Text sollte nicht zu klein sein; besser zu groß als zu klein. Ein guter **KONTRAST**: dunkler Text auf hellem Hintergrund (oder umgekehrt); vermeiden Sie blasses Grau auf Weiß, das schwer lesbar ist. Eine einfache und lesbare **SCHRIFT**: klare und schlichte Zeichen für den Fließtext, keine anstrengende dekorative Schrift. Nicht zu lange **ZEILEN**: eine zu breite Zeile ist schwer zu verfolgen; eine angemessene Breite entlastet das Auge. Ein bequemer **ABSTAND**: Luft zwischen den Zeilen und um den Text herum erleichtert das Lesen. Eine klare **STRUKTUR**: Überschriften, kurze Absätze, Leerzeichen lockern auf und leiten. Wozu dient das? Um die Besucher zu **BEHALTEN** (ein angenehmer Text wird gelesen); um **ALLE** einzubeziehen (Barrierefreiheit); um **VERTRAUEN** zu inspirieren (Seriosität); und um Ihre **BOTSCHAFT** zu vermitteln (vorausgesetzt, man liest sie). Die zentrale Idee: auf einer Website geht Lesbarkeit vor Ästhetik. Eine Typografie muss nicht „originell“ sein; sie muss für alle **BEQUEM** lesbar sein. Ein ausreichend großer, gut kontrastierter Text in einer einfachen Schrift mit nicht zu langen Zeilen und ausreichend Platz: das ist entscheidend. Das schönste Design nützt nichts, wenn man den Text nicht lesen kann. Bevorzugen Sie immer den Komfort des Lesers – er ist es, der am Ende Ihre Website bewertet.

Wie man Text lesbar macht

Hier sind die Einstellungen und guten Entscheidungen für einen bequemen Text. Eine bequeme **TEXTGRÖSSE** – der Fließtext sollte groß genug sein, um ohne Anstrengung gelesen zu werden; im Zweifel lieber vergrößern als verkleinern; ein zu kleiner Text ist der häufigste Fehler; denken Sie an Menschen mit Sehbehinderungen (unsere Leitfäden zum Vergrößern des Textes auf dem Bildschirm). Ein starker **KONTRAST** – sorgen Sie für einen deutlichen Kontrast zwischen Text und Hintergrund: dunkler Text auf hellem Hintergrund oder umgekehrt; meiden Sie blasses Grau auf Weiß, blassen Text oder Text auf einem überladenen Bild, der unlesbar wird. Eine einfache **SCHRIFT** für den Fließtext – wählen Sie für den laufenden Text eine schlichte und lesbare Schrift (Schriften ohne Schnörkel, mit klaren Zeichen, sind sicher); reservieren Sie dekorative Schriften, wenn Sie welche möchten, für die **ÜBERSCHRIFTEN** und sparsam; niemals für lange Texte. Wenige verschiedene **SCHRIFTEN** – eine oder zwei Schriften reichen (z. B. eine für die Überschriften, eine für den Text); zu viele Schriften wirken unordentlich; Kohärenz vermittelt Seriosität. Zeilen mit angemessener **LÄNGE** – vermeiden Sie zu breite Textzeilen, die den ganzen Bildschirm durchqueren; eine begrenzte Breite (der Text erstreckt sich nicht ins Unendliche) entlastet das Auge und erleichtert das Lesen. Ausreichend **ABSTAND** – lassen Sie Luft: ausreichender Abstand zwischen den Zeilen, Ränder um den Text, Platz zwischen den Absätzen; ein „gedrängter“ Text ist erstickend. Eine aufgelockerte **STRUKTUR** – unterteilen Sie mit Überschriften und Untertiteln, kurzen **ABSÄTZEN**, Listen; ein ununterbrochener Textblock schreckt ab; die Auflockerung leitet und erleichtert. Denken Sie an **MOBILE** – überprüfen Sie die Lesbarkeit auf dem Handy: der Text sollte auf dem kleinen Bildschirm groß genug und gut beabstandet bleiben, ohne dass man zoomen muss (unsere Leitfäden zum Testen Ihrer Website auf mobilen Geräten). TESTEN Sie auf verschiedenen Bildschirmen und Personen – lesen Sie Ihre Website auf dem Handy, auf dem Computer, und lassen Sie sie von jemandem lesen; was Ihnen lesbar erscheint, ist es nicht unbedingt für alle. Einige **TIPPS**: im **ZWEIFEL** größer und kontrastreicher; **SCHLICHT** statt originell für den Fließtext; und denken Sie immer an Menschen mit Sehbehinderungen. Zusammengefasst: ausreichend große Schrift, starker Kontrast, einfache Schrift, wenige Schriften, nicht zu lange Zeilen, großzügiger Abstand, aufgelockerte Struktur und Überprüfung auf mobilen Geräten. Die Lesbarkeit wird mit diesen einfachen Einstellungen erreicht, zum Wohlbefinden aller.

• Eine ausreichend große Schrift (mindestens 16 Pixel für Fließtext)
• Starker Kontrast (dunkel auf hell oder umgekehrt)
• Einfache, klare Schrift für den Haupttext
• Maximal zwei Schriftarten auf der gesamten Website
• Zeilenlänge begrenzt (max. 60-70 Zeichen pro Zeile)
• Ausreichend Abstand (mind. 1,5-facher Zeilenabstand)
• Strukturierte Absätze und Überschriften
• Mobile-Test durchführen (Text muss ohne Zoomen lesbar sein)

Der richtige Reflex. Bei der Wahl einer Typografie stellen Sie sich immer nur eine Frage: ist es einfach zu **LESEN**? Nicht „ist es hübsch“ oder „ist es originell“, sondern „ist es bequem für die Augen“? Denn auf einer Website geht Lesbarkeit immer vor Ästhetik. Drei Einstellungen sind entscheidend für den Komfort, und genau die werden am häufigsten vernachlässigt. Zuerst die **GRÖSSE**: der Text ist fast immer zu klein; im Zweifel vergrößern Sie ihn, auch wenn er Ihnen etwas zu groß erscheint – er wird perfekt für Menschen mit Sehbehinderungen sein und für alle bequem. Dann der **KONTRAST**: meiden Sie unbedingt blasses Grau auf Weiß, blassen Text oder Text auf einem überladenen Bild; zielen Sie auf einen klaren, dunklen Text auf hellem Hintergrund (oder umgekehrt), damit jedes Wort ohne Anstrengung hervortritt. Schließlich die **SCHRIFT**: für den Fließtext wählen Sie eine **EINFACHE** und schlichte Schrift mit klaren Zeichen; behalten Sie Ihre eventuellen verschnörkelten Schriften für die Überschriften, und sparsam – niemals für lange Texte, wo sie schnell ermüdend werden. Fügen Sie dazu zwei Gesten hinzu, die auflockern: begrenzen Sie die **BREITE** Ihrer Zeilen (ein Text, der den ganzen Bildschirm durchquert, ist anstrengend zu verfolgen) und lassen Sie **ABSTAND** (zwischen den Zeilen, um den Text, zwischen den kurzen Absätzen). Und vor allem: führen Sie den **TEST** durch, der zählt: lesen Sie Ihre Website auf einem Handy unter normalen Bedingungen und lassen Sie sie von jemand anderem lesen – idealerweise einer etwas älteren Person. Was Ihnen auf Ihrem großen Bildschirm perfekt erscheint, an den Sie den Inhalt kennen, kann für einen Besucher auf dem Handy, der neu ist, anstrengend sein. Schlicht, groß, kontrastreich, aufgelockert: eine Typografie, die man vergisst, bei der man ohne Nachzudenken liest, ist eine gelungene Typografie. Der Leser sollte nie anstrengen müssen; es ist Ihre Botschaft, die strahlen soll, nicht Ihre Zeichen.

Fehler und Barrierefreiheitsaspekte

Manche Typografie-Fehler sabotieren das Lesen; und die Lesbarkeit ist ein zentrales Thema der Barrierefreiheit. **HÄUFIGE FEHLER**: zu **KLEINER TEXT** (Fehler Nummer eins: man will „platzsparend“ oder „designmäßig“ sein, auf Kosten der Lesbarkeit); unzureichender **KONTRAST** (blasses Grau auf Weiß, helle Farben, Text auf Bild: vielleicht hübsch, aber unlesbar); dekorative **SCHRIFTEN** für den Fließtext (ermüdend, manchmal sogar unentzifferbar); **ZU VIELE** verschiedene Schriften (unordentliches Aussehen); **ZU LANGE ZEILEN** und gedrängter **TEXT** (ohne Luft, ermüdend); und **TEXTBLOCKS** ohne Struktur (abschreckend). Das Thema **BARRIEREFREIHEIT**: eine gute Lesbarkeit ist kein Luxus, sondern eine Notwendigkeit für einen Teil Ihrer Besucher; Menschen mit **SEHBEEINTRÄCHTIGUNGEN**, **SENIOREN**, diejenigen, die auf einem kleinen Bildschirm oder unter schlechten Bedingungen (in der Sonne, in Bewegung) lesen, brauchen großen, kontrastreichen Text; ein kleiner, blasser Text schließt sie einfach aus; die Lesbarkeit zu verbessern bedeutet, alle einzubeziehen (unsere Leitfäden zur Barrierefreiheit Ihrer Website). **RESPEKT** für die Wahl des Besuchers: eine gute Website lässt den Browser den Text vergrößern, wenn der Besucher es wünscht; blockieren Sie diese Möglichkeit nicht; das ist wichtig für diejenigen, die große Zeichen benötigen. **KOHÄRENZ**: eine Typografie sollte auf der gesamten Website einheitlich sein; sich ändernde Stile von einer Seite zur anderen verwirren. Die **VERLOCKUNG** des „Designs“ auf Kosten des Lesers: manchmal opfert man die Lesbarkeit für eine modische Ästhetik (winziger Text, trendiges Grau, stylische Schrift); das ist ein Fehler; der Besucher, der nicht lesen kann, geht, egal wie trendig es ist. **MOBILE** vernachlässigt: ein auf großen Bildschirmen lesbarer Text kann auf dem Handy zu klein oder schlecht beabstandet sein; überprüfen Sie das. Zusammengefasst: meiden Sie zu kleinen Text, schwachen Kontrast, dekorative Schriften für den Fließtext, zu viele Schriften, zu lange Zeilen und Textblöcke; denken Sie daran, dass Lesbarkeit ein Barrierefreiheitsaspekt ist, der Ihre Besucher ein- oder ausschließt; lassen Sie den Text vergrößern; bleiben Sie kohärent; und opfern Sie niemals das Lesen für eine Ästhetik. Ein lesbarer Text ist ein Text, der alle seine Leser respektiert.

Achtung: eine unlesbare Typografie schließt einen Teil Ihrer Besucher aus. Das muss klar gesagt werden: eine schlechte Lesbarkeit ist nicht nur unangenehm, sie **SCHLIESSST** bestimmte Personen einfach aus. Ein zu kleiner, zu blasser Text in einer verschnörkelten Schrift wird für eine sehbehinderte Person, einen Senior mit nachlassender Sehkraft oder jemanden, der Sie auf dem Handy in der Sonne konsultiert, einfach unlesbar. Diese Besucher „kneifen nicht die Augen zusammen“, um sich anzustrengen: sie gehen, weil sie Sie nicht lesen können. Die Lesbarkeit zu verbessern ist also ein Thema der **BARRIEREFREIHEIT** und Inklusion, kein rein ästhetisches Feintuning. Die häufigste und schädlichste Falle ist es, das Lesen einer „trendigen“ Ästhetik zu opfern: überall sieht man Websites mit winzigem Text, blassem Trend-Grau, in stylischen, aber anstrengenden Schriften – das sieht auf der Entwurfsvorlage des Designers hübsch aus, auf seinem großen Bildschirm, den er bereits kennt; es ist anstrengend, ja unlesbar, für den echten Besucher, der neu ist. Fallen Sie nie in diese Falle: zwischen einer ansprechenden Ästhetik und einem Text, den alle lesen können, wählen Sie immer den Leser. Konkret: behalten Sie einen ausreichend **GROSSEN** Text (im Zweifel größer), einen starken **KONTRAST** (niemals blasses Grau auf Weiß, niemals Text auf überladenem Bild) und eine **EINFACHE** Schrift für den Fließtext. **BLOCKIEREN** Sie nicht die Möglichkeit für den Besucher, den Text über seinen Browser oder sein Gerät zu vergrößern: manche brauchen das unbedingt, und eine Website, die das verhindert, schließt sie aus. Überprüfen Sie unbedingt die Lesbarkeit auf **MOBILE**, wo viele Sie lesen werden, und unter realen Bedingungen (nicht nur auf Ihrem perfekten Bildschirm). Der beste Test: lassen Sie Ihre Website von einer älteren Person oder jemandem mit Sehbehinderung lesen; wenn sie Mühe hat, schließt Ihre Typografie aus. Ein Text, den alle ohne Anstrengung lesen können, ist keine Einschränkung: es ist das Mindestmaß an Respekt, das Sie jedem Ihrer Besucher schulden.

Häufige Fragen

Welche Textgröße sollte man für eine Website wählen?

Die nützlichste Regel ist einfach: groß genug, um ohne Anstrengung gelesen zu werden, und im Zweifel lieber größer als kleiner. Der häufigste Fehler im Web ist ein **ZU KLEINER TEXT**: man versucht, „mehr Inhalt unterzubringen“ oder eine modische, minimalistische Ästhetik nachzuahmen, auf Kosten des Lesekomforts. Dabei sollte der Fließtext (der laufende Text, nicht die Überschriften) für einen durchschnittlichen Erwachsenen in normaler Entfernung **KOMFORTABEL** lesbar sein, **OHNE** die Augen zusammenkneifen oder zoomen zu müssen. Wenn Sie zwischen zwei Größen schwanken, wählen Sie die größere: ein etwas großzügiger Text hat noch niemanden abgeschreckt, während ein zu kleiner Text abschreckt und Menschen mit Sehbehinderungen ausschließt. Denken Sie besonders an ältere Menschen und Sehbehinderte, für die ein kleiner Text ein unüberwindbares Hindernis ist. Am besten ist es, nicht in abstrakten Zahlen zu denken, sondern in der **REALITÄT** zu **TESTEN**: lesen Sie Ihre Website auf einem Handy in normaler Entfernung, auf einem Computer, und lassen Sie sie von jemand anderem lesen; wenn einer von ihnen sich anstrengen muss, vergrößern Sie. Achten Sie auch darauf, dass der Text auf **MOBILEN GERÄTEN** lesbar bleibt (er sollte auf dem kleinen Bildschirm nicht winzig werden), und blockieren Sie nicht die Möglichkeit für den Besucher, den Text über sein Gerät zu vergrößern, wenn er es braucht. Zusammengefasst: es gibt keine magische universelle Größe, aber einen klaren Grundsatz: bevorzugen Sie immer den Komfort des Lesers, und im Zweifel: größer. Ein Text, den man ohne Nachzudenken liest, hat die richtige Größe.

Kann ich eine originelle Schrift verwenden, um mich abzuheben?

Ja, aber mit Bedacht und am richtigen Ort: niemals auf Kosten der Lesbarkeit des Fließtextes. Eine originelle oder markante Schrift kann tatsächlich Ihre Identität verstärken und Sie abheben; aber sie hat ihren Platz, und der Fließtext gehört nicht dazu. Der richtige Ansatz: reservieren Sie **ORIGINELLE** oder dekorative Schriften für die **ÜBERSCHRIFTEN** und punktuelle Elemente (Ihr Logo, einige Aufhänger), wo sie Charakter verleihen, ohne die Lesbarkeit zu beeinträchtigen; und für den **FLIESSTEXT** – alles, was der Besucher wirklich lesen muss – wählen Sie eine **EINFACHE**, schlichte und lesbare Schrift mit klaren Zeichen. Eine verschnörkelte Schrift, die für lange Absätze verwendet wird, wird schnell anstrengend, ja unentzifferbar: der Besucher gibt auf. Halten Sie auch die **MASSHALTUNG** ein: eine oder zwei Schriften reichen für eine ganze Website (z. B. eine charaktervolle für die Überschriften, eine sehr lesbare für den Text); mehr zu verwenden wirkt unordentlich und amateurhaft. Stellen Sie schließlich sicher, dass Ihre „originelle“ Schrift auf allen Geräten korrekt lesbar ist und angezeigt wird. Zusammengefasst: ja, Sie können eine typografische Persönlichkeit pflegen, um sich abzuheben, aber intelligent: Charakter in den Überschriften, Klarheit im Text. Das Abheben sollte nie auf Kosten des Lesekomforts gehen; eine Website, die man erkennt, aber schwer liest, hat alles verfehlt. Die wahre typografische Eleganz ist ein Text, der **STIL** hat **UND** der sich ohne Anstrengung lesen lässt.

Ist der Farbkontrast so wichtig für den Text?

Ja, absolut: der Kontrast ist einer der bestimmendsten Faktoren für die Lesbarkeit und einer der am häufigsten vernachlässigten. Das Prinzip: damit ein Text leicht lesbar ist, muss er sich **DEUTLICH** vom Hintergrund abheben. Dunkler Text auf hellem Hintergrund (der Klassiker) oder heller Text auf dunklem Hintergrund bieten einen guten Kontrast: jedes Wort springt ins Auge. Probleme gibt es mit **SCHWACHEN** Kontrasten: blasses Grau auf Weiß (sehr trendy, aber schwer lesbar), blasser Text oder schlimmer, Text auf einem Bild oder einem überladenen farbigen Hintergrund, der ihn „verschlingt“. Was auf der Vorlage elegant und dezent wirkt, wird für viele Leser zur Qual. Der Kontrast ist ein zentrales Thema der **BARRIEREFREIHEIT**: sehbehinderte Menschen, Senioren oder einfach alle, die auf einem Bildschirm in der Sonne lesen, brauchen unbedingt einen starken Kontrast; ein blasser Text schließt sie aus. Es ist auch eine Frage des Komforts für alle: selbst eine gute Sehkraft ermüdet bei wenig kontrastiertem Text. Die Regel: bevorzugen Sie immer einen **DEUTLICHEN** Kontrast zwischen Text und Hintergrund; meiden Sie blasses Grau und ausgewaschene Farben für den Text; und wenn Sie Text auf ein Bild setzen, stellen Sie sicher, dass er perfekt lesbar bleibt (z. B. mit einem verdunkelten Hintergrund dahinter). Ein guter Test: betrachten Sie Ihren Text mit leicht zusammengekniffenen Augen oder auf einem Bildschirm in hellem Licht; wenn er schwer zu erkennen ist, ist der Kontrast unzureichend. Opfern Sie niemals den Kontrast für eine „sanfte“ Ästhetik: die Lesbarkeit geht vor.

Was man sich merken sollte

Die Typografie – die Auswahl und Gestaltung der Zeichen – bestimmt das Wesentliche Ihrer Website, da der größte Teil der Informationen über den Text vermittelt wird. Dabei geht auf einer Website die **LESBARKEIT** immer vor der Ästhetik: eine Typografie muss nicht „originell“ sein, sie muss für alle **BEQUEM** lesbar sein. Was einen Text lesbar macht: eine ausreichende **GRÖSSE** (der häufigste Fehler ist zu kleiner Text: im Zweifel lieber größer); ein starker **KONTRAST** (meiden Sie blasses Grau auf Weiß und Text auf überladenem Bild; zielen Sie auf klare, dunkle Zeichen auf hellem Hintergrund); eine **EINFACHE** und schlichte Schrift für den Fließtext (reservieren Sie dekorative Schriften für die Überschriften, sparsam); wenige verschiedene Schriften (eine oder zwei); Zeilen mit angemessener Länge; großzügiger Abstand; und eine aufgelockerte Struktur (Überschriften, kurze Absätze). Überprüfen Sie immer auf **MOBILEN GERÄTEN** und lassen Sie Ihre Website von jemand anderem lesen: was Ihnen lesbar erscheint, weil Sie den Inhalt auf Ihrem großen Bildschirm kennen, ist es nicht unbedingt für einen Besucher, der neu ist. Denn die Herausforderung geht über den Komfort hinaus: es ist eine Frage der **BARRIEREFREIHEIT**. Ein zu kleiner, zu blasser oder verschnörkelter Text ist nicht nur unangenehm: er **SCHLIESSST** sehbehinderte Menschen, Senioren, diejenigen, die auf dem Handy oder unter schlechten Bedingungen lesen, einfach aus; sie gehen, weil sie Sie nicht lesen können. Die Falle, die man unbedingt vermeiden muss, ist es, das Lesen einer „trendigen“ Ästhetik zu opfern (winziger Text, trendiges Grau, stylische Schrift): zwischen einer hübschen Vorlage und einem Text, den alle lesen können, wählen Sie immer den Leser. Blockieren Sie nicht die Möglichkeit, den Text für diejenigen zu vergrößern, die es brauchen. Eine gute Typografie macht sich unsichtbar: man liest ohne Nachzudenken, ohne jemals anstrengen zu müssen. Schlicht, groß, kontrastreich, aufgelockert: so dient sie Ihrer Botschaft und respektiert jeden Ihrer Besucher. Das schönste Design nützt nichts, wenn man den Text nicht lesen kann; die Klarheit enttäuscht nie.