Zurück zum Blog

Saynovo-Blog

Schriftarten für eine Website wählen - ohne zu raten

Schriftarten für eine Website wählen - ohne zu raten

Schriftarten für eine Website wählen - ohne zu raten

Die meisten Ratgeber zum Thema Schriftarten für Websites präsentieren Ihnen eine Galerie hübscher Schriften und wünschen Ihnen viel Glück. Das ist der falsche Ausgangspunkt. Eine Schrift ist kein Dekorationselement. Sie ist das, was Ihr Kunde liest, bevor er entscheidet, ob er Sie anruft, bucht oder das Tab schließt. Eine schlechte Wahl lässt ein solides Unternehmen amateurhaft wirken. Eine gute Wahl lässt einen kleinen lokalen Betrieb so wirken, als stehe ein Designteam dahinter.

Dieser Leitfaden richtet sich an Inhaber, die keine Designer sind und auch keine werden möchten. Sie lernen, wie Sie Schriften wählen, die klar lesbar sind, schnell laden, zur Art Ihrer Arbeit passen und auf einem Smartphone-Bildschirm bestehen. Ungefähr die Hälfte des Folgenden gilt unabhängig davon, mit welchem Tool Sie Ihre Website erstellen.

Mit der Aufgabe beginnen, nicht mit dem Aussehen

Bevor Sie eine einzige Schrift durchblättern, klären Sie, was die Schrift leisten muss. Eine Schrift, die auf einem Plakat charmant aussieht, kann in einem langen Absatz qualvoll zu lesen sein. Teilen Sie Ihr Denken in zwei Aufgaben auf.

  • Die Überschriften-Aufgabe. Großer Text oben auf einer Seite: Ihr Unternehmensname, Ihr Hauptversprechen, Ihre Abschnittsüberschriften. Dieser Text kann Persönlichkeit tragen, weil ihn die Leute in kurzen Phasen lesen.
  • Die Fließtext-Aufgabe. Die Absätze, Servicebeschreibungen, das Kleingedruckte. Dieser Text hat eine einzige Pflicht: mühelos lesbar zu sein für jemanden, der auf einem Smartphone in der Mittagspause scrollt.

Fast jede gute Website löst diese zwei Aufgaben mit höchstens zwei Schriften. Eine für Überschriften, eine für Fließtext. Manchmal erledigt eine einzige gut gebaute Schriftfamilie beide. In dem Moment, in dem Sie nach einer dritten oder vierten Schrift greifen, beginnt die Seite wie ein Erpresserbrief auszusehen und Ihre Glaubwürdigkeit sinkt.

Die fünf Dinge, die wirklich zählen

Hübsch ist subjektiv. Diese fünf Qualitäten nicht. Beurteilen Sie jede Schrift daran.

1. Lesbarkeit bei kleinen Größen

Lesen Sie einen vollständigen Absatz echten Textes in der Größe, in der Fließtext tatsächlich erscheint - etwa 16 bis 18 Pixel. Beurteilen Sie eine Schrift nicht an ihrem großen Namen. Achten Sie auf Buchstaben, die verschwimmen, auf ein kleines "x", das beengt wirkt, oder auf Zahlen, bei denen Sie blinzeln müssen. Eine Schrift mit einer großzügigeren x-Höhe - einer taller Kleinbuchstabenhöhe - bleibt tendenziell lesbar, wenn sie kleiner wird.

2. Eine klare Trennung zwischen ähnlichen Zeichen

Einige Schriften zeichnen ein großes I, ein kleines l und die Zahl 1 fast identisch. Auf einer Seite voller Telefonnummern, Preise und Adressen ist das ein echtes Problem. Tippen Sie die Zeichenfolge Il1 und O0 und prüfen Sie, ob Sie sie sofort unterscheiden können. Websites für Handwerksbetriebe stehen und fallen damit, dass eine Telefonnummer korrekt gelesen wird.

3. Genug Gewichtungen, um eine Hierarchie aufzubauen

Eine Gewichtung ist die Stärke der Striche. Sie möchten mindestens Regular und Fett, idealerweise dazwischen auch Medium. Gewichtungen sind die Art, wie Sie eine Überschrift wichtig und eine Bildunterschrift ruhig wirken lassen, ohne die Schrift zu wechseln. Eine Schrift, die nur eine Gewichtung mitliefert, engt Sie schnell ein.

4. Echte Kursivschrift, keine gefälschte Neigung

Gute Schriften enthalten eine gezeichnete Kursivschrift für Betonung. Günstigere oder in Eile kostenlose Schriften fälschen sie, indem sie die aufrechten Buchstaben einfach kippen - was leicht falsch aussieht, auch wenn der Leser nicht sagen kann warum. Wenn Sie Wörter betonen möchten, bestätigen Sie, dass eine echte Kursivschrift vorhanden ist.

5. Sie übersteht den Smartphone-Test

Mehr als die Hälfte des lokalen Unternehmensverkehrs kommt von einem Smartphone in schlechtem Licht. Was auch immer Sie in die engere Wahl nehmen - schauen Sie es sich auf einem echten Smartphone an, bevor Sie sich festlegen, nicht nur auf Ihrem Laptop. Eine Schrift, die auf einem großen Bildschirm elegant wirkt, kann auf einem kleinen dünn und blass werden.

Serife oder Serifenlos: eine einfache Entscheidung

Sie brauchen nicht die vollständige Geschichte der Typografie. Sie brauchen eine ehrliche Einschätzung des Gefühls, das Sie erzeugen möchten.

  • Serifenschriften haben kleine Füßchen an den Enden der Striche. Sie wirken etabliert, sorgfältig und traditionell. Sie passen zu einer Anwaltskanzlei, einem Steuerberater oder einem Restaurierungsunternehmen, das jahrzehntelange Erfahrung signalisieren möchte.
  • Serifenlose Schriften haben keine Füßchen. Sauber und klar. Sie wirken modern, direkt und zugänglich. Sie passen zu den meisten Handwerksbetrieben, Wellnessstudios und allem, was aktuell und ohne Schnörkel wirken soll.
  • Skript- und dekorative Schriften imitieren Handschrift oder setzen stark auf eine Stimmung. Verwenden Sie diese nur für ein Logo oder gelegentliche Überschriften, niemals für Absätze. Sie sind Gewürze, keine Mahlzeit.

Ein verlässliches Muster für ein lokales Unternehmen: eine Serifenlose für alles, in zwei oder drei Gewichtungen. Es ist kaum möglich, es damit falsch zu machen. Wenn Sie mehr Charakter wünschen, kombinieren Sie eine Serifenschrift für Überschriften mit einer Serifenlosen für Fließtext, oder umgekehrt.

Zwei Schriften paaren ohne Designabschluss

Schriften zu paaren klingt wie eine dunkle Kunst. Es sind im Wesentlichen zwei Regeln.

  • Durch Kontrast paaren. Kombinieren Sie zwei Schriften, die sich klar unterscheiden, wie eine fette Serifenlose über einem Serifen-Fließtext. Der Unterschied sollte offensichtlich sein. Zwei Schriften, die sich nur leicht unterscheiden, sehen wie ein Fehler aus, nicht wie eine Wahl.
  • Durch Familie paaren. Viele moderne Schriften werden als Familie geliefert mit einer passenden Serifenschrift und Serifenlosen, die zusammen entworfen wurden. Zwei Mitglieder einer Familie zu verwenden ist die sicherste Paarung überhaupt, weil jemand die schwierige Arbeit bereits erledigt hat.

Im Zweifel gar nicht paaren. Eine starke Schrift in mehreren Gewichtungen schlägt eine ungeschickte Paarung jedes Mal.

Ein schneller Test: Decken Sie die Schriften ab und bitten Sie einen Freund, das Unternehmen in drei Worten zu beschreiben, nur anhand der Formen. Wenn die Wörter dazu passen, wie Sie gesehen werden möchten, haben Sie gut gewählt.

Was niemand Kleinunternehmern sagt

Hier hört die meisten Schriftratschläge auf - und hier fallen Websites still auseinander. Diese Punkte erscheinen selten in populären Ratgebern, und sie sind genauso wichtig wie das Aussehen.

Ladegeschwindigkeit ist Teil der Wahl

Jede benutzerdefinierte Schrift ist eine Datei, die das Smartphone Ihres Besuchers herunterladen muss, bevor der Text erscheint. Vier Schriften laden oder eine Schrift in acht Gewichtungen - das fügt echte Verzögerung hinzu. Langsamer Text kostet Sie Besucher, die gehen, bevor die Seite geladen ist, und es senkt Ihr Suchmaschinenranking. Zwei Regeln halten Sie sicher: verwenden Sie nicht mehr als zwei Schriftfamilien, und laden Sie nur die spezifischen Gewichtungen, die Sie tatsächlich verwenden.

Einen Fallback setzen, damit Text nie verschwindet

Während eine benutzerdefinierte Schrift herunterlädt, braucht der Browser etwas zum Anzeigen. Wenn Sie ihm nichts sagen, können Besucher für einen Moment auf leeren Raum starren. Die Lösung besteht darin, eine gängige Backup-Schrift desselben Stils zu benennen, sodass gewöhnliche Systemschriften für den Bruchteil einer Sekunde einspringen, bevor Ihre eintrifft.

Kontrast und Zugänglichkeit sind nicht optional

Eine Schrift kann perfekt sein und trotzdem unlesbar, wenn sie hellgrau auf Weiß ist, zu klein gesetzt oder zu eng. Streben Sie nach starkem Kontrast zwischen Text und Hintergrund, halten Sie Fließtext in angenehmer Größe und geben Sie Absätzen Raum zum Atmen. Das ist nicht nur Rücksicht auf ältere Kunden oder Menschen mit Sehbehinderung. Es ist auch, wie Sie jeden vermeiden, der sich einfach nicht die Mühe machen konnte, zu anstrengen.

Die Lizenz prüfen, bevor Sie sich verlieben

Wenn Sie eine Schrift von irgendwo heruntergeladen haben, haben Sie möglicherweise nicht das Recht, sie auf einer kommerziellen Website zu verwenden. Bleiben Sie bei Bibliotheken, die für die kommerzielle Nutzung kostenlos sind, wie Google Fonts, oder bei ordnungsgemäß lizenzierten Schriften.

Mit Ihren eigenen Worten testen

Beispieltext ist eine Falle. Eine Schrift kann wunderbar klingen, wenn sie das Alphabet buchstabiert, und dann an Ihrem tatsächlichen Unternehmensnamen, Ihrer Stadt oder Ihrer längsten Dienstleistung stolpern. Fügen Sie Ihre echten Überschriften, Ihre echte Telefonnummer, Ihren längsten Absatz und den schwierigen Straßennamen in Ihrer Adresse ein.

In sieben Schritten Schriften für eine Website wählen

Wenn Sie lieber einen Plan als eine Vorlesung möchten, tun Sie dies in dieser Reihenfolge.

  • Entscheiden Sie das Gefühl in einem Wort: etabliert, modern, warm oder Premium.
  • Wählen Sie eine Serifenlose, die bei kleinen Größen klar lesbar ist und mindestens drei Gewichtungen hat.
  • Entscheiden Sie, ob Sie überhaupt eine zweite Schrift brauchen. Oft nicht.
  • Wenn doch, fügen Sie eine kontrastierende Überschriften-Schrift hinzu, oder verwenden Sie ein passendes Familienmitglied.
  • Laden Sie nur die Gewichtungen, die Sie verwenden, und benennen Sie einen System-Fallback.
  • Fügen Sie Ihren echten Inhalt ein und lesen Sie ihn auf einem Smartphone.
  • Prüfen Sie Kontrast und Größe für jemanden, der nicht genau hinschaut.

Folgen Sie diesen sieben Schritten und Sie landen vor den meisten lokalen Mitbewerbern, die dazu neigen, das zu akzeptieren, was ihnen ihr Website-Baukasten hingestellt hat.

Wenn Sie sich damit nicht beschäftigen möchten

Viele Inhaber lesen all das oben und denken: Ich führe einen Dachdeckerbetrieb, ich möchte keine Schriften auswählen. Das ist fair. Saynovo erstellt für ein Unternehmen seine eigene Website und wählt dabei ein passendes Schriftsystem, sodass die Überschriften-Fließtext-Paarung, die Gewichtungen und die Fallbacks erledigt sind und nicht als Hausaufgaben verbleiben. Wenn Sie später entscheiden, dass die Überschriften zu förmlich oder zu laut wirken, sagen Sie es in einfachen Worten und der Schriftstil ändert sich.

Kurz zusammengefasst

Zu wissen, wie man Schriften für eine Website wählt, läuft auf einige ehrliche Überprüfungen hinaus. Lösen Sie die Überschriften-Aufgabe und die Fließtext-Aufgabe mit höchstens zwei Schriften. Testen Sie die Lesbarkeit bei echten Größen, auf einem echten Smartphone, mit Ihren echten Wörtern. Laden Sie nur, was Sie verwenden, und setzen Sie einen Fallback, damit nichts verschwindet. Halten Sie den Kontrast stark, damit alle es lesen können, und bestätigen Sie, dass Sie die Schrift überhaupt verwenden dürfen. Tun Sie das, und Ihre Schrift leistet still ihre Arbeit - aus dem Weg zu gehen und einem Kunden die Entscheidung zu ermöglichen, Sie einzustellen.

Weiterführende Quellen:

  • Choosing Web Fonts, a Beginner's Guide von Google Design
  • How to Choose Website Fonts von Squarespace
  • How To Choose The Right Font For Your Website von CareerFoundry
  • How to Choose the Best Fonts for Your Website von Wix