Es gibt keine Möglichkeit, alle für Website-Designer verfügbaren Schriftartoptionen zu quantifizieren. Fast jeden Tag erscheint eine neue Schrift in meinem Posteingang oder Twitter-Feed. Aber nicht jede dieser Schriftarten - egal wie schön sie auch sein mag - eignet sich für die Gestaltung einer Website.
Bei der Auswahl der perfekten Schriftart müssen Sie verschiedene Aspekte berücksichtigen, darunter Kompatibilität, Ladezeit und Designzweck. Heute haben wir sieben Tipps, mit denen Sie die beste Webschriftart für Ihr Designprojekt auswählen und verwenden können.
1. Beginnen Sie mit den Grundlagen
Das Arbeiten mit Webfonts ist wie jedes andere Typografieprojekt. Das fängt bei den Grundlagen an.
- Serif vs. Sans Serif: Es gibt andere Typkategorien, aber in Bezug auf das Webdesign basiert fast jedes Projekt auf einer dieser Optionen. (Und serifenlose Schriften sind die dominierende Wahl.)
- Kerning, Tracking und Leading: Die Menge an Text, die den Text umgibt, kann genauso wichtig sein wie die Schrift. Kerning ist das Leerzeichen zwischen Buchstabenpaaren; Während der Nachverfolgung ist der Abstand zwischen Gruppen-DOS-Zeichen. Führend ist der Abstand zwischen den Textzeilen (auch bekannt als Zeilenhöhe).
- Lesbarkeit: Bei der Arbeit mit Text für das Web kann die Anzahl der Zeichen pro Zeile wichtig sein. Denken Sie über die Größe des Bildschirms nach, wo Text erscheinen soll, und gestalten Sie ihn so, dass er gut lesbar ist.
- Silbentrennung: Tu es einfach nicht. Bindestriche machen Text auf dem Bildschirm durcheinander.
- Ausrichtung und Begründung: Am besten für große Textblöcke geeignet. Denken Sie jedoch darüber nach, wie Text auf dem Bildschirm ausgerichtet wird (links, rechts oder in der Mitte) und ob Textblöcke unregelmäßige Kanten haben oder vollständig ausgerichtet sind.
- Anzahl der Schriften: Wie bei jedem Projekt nicht mehr als drei Schriftarten? es sei denn, du hast einen wirklich guten Grund.
- Erinnere dich an den Kontrast: Es ist egal, welche Schriftart Sie auswählen, wenn zwischen Text und Hintergrund kein ausreichender Kontrast besteht, damit er lesbar ist. Zu den Elementen, die zum Kontrast beitragen, gehören Größe, Konturstärke, Farbe und Raum.
2. Erwägen Sie die Kompatibilität
Schwierig ist die Web-Typografie unter anderem, dass Browser sich ständig ändern und Updates erhalten. Sie sollten eine Schriftart auswählen, die mit modernen Weboberflächen auf Desktop- und mobilen Geräten kompatibel ist.
Klingt einfach, richtig? Es kann ein Test auf mehreren Geräten erforderlich sein, um etwas zu finden, das nahtlos funktioniert.
Noch mehr Glück haben Sie, wenn Sie sich an eine Typfamilie halten, die für das Web konzipiert ist, oder indem Sie eine Option aus Google Fonts oder die @ font-face-Regel verwenden. (Weitere Informationen zu letzteren und zur Funktionsweise von Six Revisions finden Sie hier.)
3. Verwenden Sie einen Service
Apropos Google Fonts: Viele Designer entscheiden sich für einen Web-Font-Service. Dies ist eine gute Idee und kann viele technische Probleme leicht lösen.
Abgesehen von Google (wahrscheinlich die beliebteste Option) gibt es eine Vielzahl weiterer Optionen. Während Google Fonts ein kostenloser Service ist, variieren die Preisstufen für die anderen von kostenlosen Optionsstufen bis zu teureren Kits.
- Adobe Typekit
- Fonts.com
- Webtyp
- Fontspring
Jeder dieser Dienste verfügt über Tausende von Typenoptionen und ist recht einfach zu bedienen. Das Schöne an diesen Optionen ist, dass sie eine umfangreiche Typenbibliothek bereitstellen können, ohne für viele einzelne Zeichensätze Geld ausgeben zu müssen. Der Nachteil ist, dass die meisten Schriftarten nur für die Online- und nicht für gedruckte Projekte verfügbar sind.
4. Seien Sie Rücksicht auf Ton und Botschaft
Beginnen Sie mit dem Typ. Manchmal ist die Auswahl der Schriftarten fast eine Nachdenklichkeit. Dinge werden einfacher zusammenkommen, wenn Sie zuerst die Typoptionen festlegen. Überlegen Sie dann, wie der Text mit anderen Designelementen wie Farben und Bildern zusammenspielt.
Die Wahl einer Schriftart kann Ihr Gehirn mit allen verfügbaren Optionen in eine visuelle Überlastung versetzen. Wenn Sie von Anfang an eine Vorstellung von dem haben, wonach Sie suchen, ist es einfacher, durch das gesamte Font-Clutter zu navigieren.
Es muss unbedingt sichergestellt werden, dass die von Ihnen ausgewählte Schriftart mit dem Ton und der Nachricht des Projekts übereinstimmt, an dem Sie gerade arbeiten. Hier sind einige Fragen, die Ihnen helfen sollen, es herauszufinden:
- Ist das Projekt formell oder beiläufig?
- Sollte Text fett oder heller sein?
- Ist die Schrift für großen Text oder klein?
- Wie passt es zu Farbe oder Bildern?
- Stimmt die Stimmung der Schrift mit den gelesenen Wörtern überein?
5. Es ist in Ordnung, Vorschläge anzuschauen
Google Fonts eignet sich besonders gut, da der Benutzer Schriftkombinationen betrachten und Vorschläge zur Schriftkombination machen kann. Es ist keine Schande, eine dieser Optionen zu verwenden. (Die Adobe Typekit-Bibliothek hilft Benutzern außerdem bei der Auswahl von Schriften, je nachdem, wie sie verwendet werden. Sehen Sie sich die Tools auf der rechten Seite des Bildschirms an.)
Das Pairing von Schriftarten kann schwierig sein. Es ist nicht für jeden Designer ein starker Anzug. Hilfe zu bekommen ist in Ordnung. Seien Sie vorsichtig bei überlasteten Schriftkombinationen. Die erste Option, die Sie sehen, ist möglicherweise die am häufigsten verwendete.
Denken Sie an Ihre Grundprinzipien der Schriftpaarung und achten Sie auf Buchstabenformen, die in Stimmung, Strichstärke und x-Höhe ähnlich sind. Denken Sie über die Form und Neigung von Buchstaben nach und entscheiden Sie sich für Schriften mit ähnlichen Konturen. Es ist eine gute Idee, Schriftstile zu mischen und ein Serifenpaar oder eine serifenlose Schrift sowie eine serifenlose Schrift zu wählen.
6. Über die Ladezeiten nachdenken
Wenn eine Schrift nicht schnell geladen wird, suchen Sie nach einer anderen Option. Benutzer haben keine Geduld für langsame Websites. Egal wie großartig die Schrift auch sein mag, sie muss fast mit Blitzgeschwindigkeit geladen werden, um effektiv zu sein.
Wenn Sie eine Schriftart auswählen, testen Sie sie auf Geschwindigkeit. (Die meisten Typ-Services helfen Ihnen dabei, auch Google.) Dann sollten Sie andere Möglichkeiten zur Reduzierung der Ladezeiten in Betracht ziehen.
- Verwenden Sie eine begrenzte Anzahl von Schriftarten.
- Wählen Sie für jede Schrift nur die Stile aus, die Sie verwenden möchten.
- Wählen Sie nur die Sprachen aus, die Sie für eine bestimmte Schriftart verwenden werden.
7. Sei wählerisch
Sie müssen Helvetica, Arial oder Droid Sans nicht verwenden, um Web-Typografie zu erstellen. Nehmen Sie sich Zeit und wählen Sie bei der Auswahl einer Schriftpalette wählerisch.
Typewolf ist eine großartige Ressource, wenn es darum geht, beliebte Schriftarten zu vermeiden. Die Website zählt zu den Top 10 der beliebtesten Optionen in einer Vielzahl von Kategorien - Serifen, serifenlose Serifen, Slab-Serifen, Monospaced usw. Es gibt auch einige lustige Listen für Alternativen zu bekannten Schriften wie den oben genannten.
Bonus: 10 tolle Webfonts
Abril Fatface
Josefin Slab
Lato
League Gothic
Open Sans
PT Sans
Roboto Slab
Patt
Ubuntu
Vollkorn
Fazit
Die Auswahl einer perfekten Web-Schriftart kann einer der Prozesse sein, die sich unglaublich lohnend anfühlen - wenn Sie die perfekte Kombination finden - oder die Haare ausreißen möchten - wenn nichts zu funktionieren scheint. Sie können jedoch alle verfügbaren Optionen durcharbeiten, um eine Schriftart und ein System zu finden, die für Ihre Website-Designprojekte geeignet sind.
Wie wählst du eine Webschriftart aus? Gibt es einen anderen Prozess als die oben beschriebenen Schritte? Wir würden uns freuen, wenn Sie Ihre Tipps auch in den Kommentaren mitteilen.