Tipps für die Auswahl der perfekten Schriftart, um deine Coaching-Webseite professionell und ansprechend zu gestalten.
Die Schriftart ist ein oft unterschätztes Gestaltungsmittel deiner Website. Ist die Schriftart gut ausgewählt und professionell eingesetzt, lädt sie zum Bleiben ein. Die Texte lassen sich leicht und angenehm lesen. Das Schriftbild wirkt insgesamt harmonisch. Deine Besucher und Besucherinnen haben Lust auf deiner Website zu stöbern und sich mit deinen Inhalten zu beschäftigen.
Schlecht ausgewählte oder unpassend eingesetzte Schriftarten hingegen machen das Lesen schwer. Eine gute Schrift fällt nicht weiter auf. Eine schlechte umso mehr.
Das erwartet dich hier:
Das musst du wissen
Die Schriftart ist Teil deiner Brand
Wie möchtest du dich deinem Publikum vorstellen: modern, feminin, elegant, innovativ, vertrauenswürdig, verspielt – oder was ist dein Stil? Durch die Auswahl deiner Schriftart kannst du die gewünschte Wirkung erzielen.
Wenn du magst, schau dich bei CANVA um: Dort findest du mehr über Schriftarten (Fonts) und ihre Botschaften: 18 professionelle Fonts für deine Website
Die weiße Fläche ist ebenso wichtig wie die Schrift
Die schönste Schriftart nützt dir nichts, wenn sie ungeschickt eingesetzt wird. Zu kleine Buchstaben, lange Zeilen oder enge Abstände zwischen den Zeilen erschweren es deinen Lesern und Leserinnen, den Inhalt deines Textes zu erfassen. Eine gut lesbare Schrift braucht Luft zum Atmen – genug, aber nicht zu viel. Hier ein paar Tipps zur Orientierung:
Schriftgröße
Die empfohlene Schriftgröße für Fließtexte liegt bei 16 bis 18 Pixel. Der Fließtext legt die 100-Prozent-Marke fest. Alles andere wie die Überschriften orientieren sich daran.
Überschriften sind ein Mittel, Texte zu strukturieren und eine Hierarchie herzustellen. Sie sollten sichtbar größer sein als der Fließtext, damit sich deine Leser und Leserinnen orientieren können. Versuche es einmal mit diesen Maßen.:
- H1-Überschrift zwischen 180 und 200 Prozent.
- H2-Überschrift zwischen 130 und 150 Prozent.
- H3-Überschrift in etwa so groß wie der Fließtext.
Je größer der Unterschied zwischen Überschrift und Fließtext, desto dramatischer die Wirkung.
Zeilenhöhe
Die Zeilenhöhe definiert den weißen Raum zwischen den Zeilen. Dieser Raum ist wichtig für die Lesbarkeit: Stehen die Zeilen zu eng zusammen, wird das Lesen mühsam. Ist der Abstand zu groß, wirkt das Textbild unharmonisch.
Die Zeilenhöhe beträgt im Schnitt das 1,5-fache der zugehörigen Schrift. Ist der Fließtext 16 Pixel hoch, beträgt die Zeilenhöhe 24 Pixel.
Zeilenlänge
Die ideale Zeilenlänge liegt zwischen 75 und 80 Zeichen pro Zeile. Deine Leser und Leserinnen sollten in der Lage sein, am Ende einer Zeile gleich den Anfang der nächsten Zeile zu erfassen.
Die gekonnte Verwendung von Schriften ist keine exakte Wissenschaft. Das Gesamtbild entscheidet. Zudem hängen die richtige Schriftgröße und der Zeilenabstand von der Schriftart ab. Manche Schriftarten wirken größer, andere kleiner.
Der Golden Ratio Typography Calculator kann dir weiterhelfen. Er rechnet Abstände, Zeilenlauflängen und Schriftgrößen in Abhängigkeit der ausgewählten Schriftart aus.
Die perfekte Schriftart für deine Website: Best Practices
Serifen-Schrift vs. serifenlose Schrift
Serifen sind die kleinen An- und Abstrichen am Anfang oder am Ende eines Buchstabens. Serifen-Schriften eignen sich für Bücher, Zeitschriften und andere Print-Erzeugnisse. Für das Internet haben sich Schriftarten ohne Serifen bewährt.
Websichere Schriftarten
Websichere Schriften sind solche, die ab Werk auf Desktop-Rechnern, Tablets oder Smartphones installiert sind. Sie gelten als sicher, weil sie auf fast allen Geräten der Welt geladen und korrekt angezeigt werden können – unabhängig von Ort und vom Device.
Zu den verbreitetsten „sicheren“ Schriftarten zählen:
- Arial
- Verdana
- Helvetica
- Tacoma
- Trebuchet MS
- Times New Roman
- Georgia
- Garamond
- Courier New
- Brush Script MT
Die Gestaltungsmöglichkeiten sind allerdings eingeschränkt. Solltest du dich für eine exklusive Schriftart entscheiden, kann es sein, dass diese auf dem Endgerät deines Besuchers nicht installiert ist. Ruft dein Besucher deine Website auf, muss sein Gerät sowohl Inhalt als auch die Schrift herunterladen.
Je mehr Daten, desto langsamer wird die Seitenladegeschwindigkeit. In der Regel lässt sich der Nachteil verschmerzen, doch wenn dein Besucher ein altes System verwendet oder die Leitung langsam ist, kann dies zu einem Störfaktor werden.
Viele Web-Profis empfehlen deshalb, eine „schöne“ Schriftart und eine Standard-Schriftart als Fallback zu verwenden.
Google-Schriften und die DSGVO
Google bietet unzählige Schriften an, eine wahre Fundgrube! Diese sogenannten Web-Fonts liegen im Netz auf einem Google-Server. Du kannst sie auf deiner Website verwenden, ohne sie fest zu installieren. Die Schriften bleiben im Netz.
Ruft ein Besucher deine Website auf, geht zugleich ein Signal an den Google-Server. Die Schrift wird geliefert, zusammen mit den Inhalten deiner Website. Der Browser setzt beides zusammen.
Mit diesem Prozess verlangsamt sich die Ladegeschwindigkeit deiner Website und außerdem ist Google im Spiel. Damit entsteht ein Konflikt mit der DSGVO, der Datenschutzgrundverordnung.
Ein Ausweg besteht darin, die verwendeten Google-Schriftarten herunterzuladen und fest in deinem System zu installieren. Wenn dein Besucher deine Seite lädt, ist Google nicht mehr involviert.
Du weißt, ich bin keine Rechtsanwältin. Wende dich für verbindliche Informationen bitte an Experten, wie eRecht24.
Vorsicht, Fehler!
Verwende nie mehr als drei Schrifttypen pro Website
Auch wenn die Möglichkeiten vielfältig und fantastisch sind: Weniger ist mehr. Viele Websites kommen mit zwei Schriftarten aus.
Zeilenumbrüche
Unpassende Zeilenumbrüche können das Gesamtbild sehr beeinträchtigen. Ich hatte Probleme, bis der Techniker meines Vertrauens folgenden Code ins CSS schrieb:
body {
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
}
Seither werden automatische Silbentrennungen erzeugt. Zumindest ich sehe das so und auf den meisten Geräten sollte es ebenso sein. Es gibt jedoch keine absolute Sicherheit. Wenn du mehr über Zeilenumbrüche lesen möchtest, schaue hier nach: Silbentrennung im Browser mit CSS, HTML oder JavaScript
Ich finde: Die Auswahl deiner Schriftart ist ein spannendes Thema und Mittel der Gestaltung. Wenn du tiefer einsteigen möchtest, lies bei CANVA weiter: Your ultimate guide to understanding typography
