Typografie Grundlagen für dein nächstes Projekt

Einfach ist schwer. Das ist mein Leitsatz. Und so ist es auch mit dem Einsatz von Typografie im Webdesign, von Schriften auf der Website – eigentlich ganz einfach und doch ziemlich kompliziert. Darum möchte ich dir heute zeigen, welche Typografie Grundlagen du beachten solltest, um Text auf deiner Website bestmöglich darzustellen.

Es ist kein Geheimnis, dass es für viele Menschen schwierig ist, sich klar und verständlich auszudrücken. Weshalb sollte das über Medien einfacher sein? Um dies zu erleichtern – Kommunikation – gibt es Typografie. Sie ist einerseits die Lehre von den Schriften, andererseits ein Gestaltungselement, um Texte oder Inhalte geschickt, dem Ziel entsprechend oder „ästhetisch ansprechend“ darzustellen. Dass in Mikrotypografie und Makrotypografie unterschieden wird, ist an dieser Stelle nicht von Belang.

Warum Typgrafie Grundlagen im Webdesign?

Es ist keine Frage, dass Schriften eine Website beleben und optisch bereichern können. Fonts – Schriftarten – sind wichtige Elemente jeder guten Gestaltung. Im Internet, also im Webdesign, unterliegt die Sache mit der Typografie aber besonderen Bedingungen, die ich hier beleuchten möchte und die dir helfen sollen, die Sache mit der Schrift auf Websites besser zu verstehen.

„Gute Typografie sucht nicht nach allem, was noch möglich ist, sondern fragt nach dem, was nötig ist.“

– Kurt Weidemann

Websites werden oft nicht von ausgebildeten Grafikdesignern oder Mediengestaltern gemacht, sondern von Quereinsteigern gestaltet und umgesetzt. Das mag erklären, weshalb auf vielen Websites selbst die einfachsten grafischen Regeln missachtet werden. Besonders beim Thema Typografie wird das schnell deutlich. Der unbändige Einsatz von schlecht lesbaren VERSALIEN, der mangelnde Kontrast zwischen Schriftfarbe und Hintergrund, sowie die wirre Struktur der Texte machen den Nutzern das Lesen schwer.

Aber genau darum geht es beim Thema Typografie: um die Lesbarkeit der Texte. Wozu sollte man sonst Texte auf der Website haben, wenn diese nicht gut und angenehm zu lesen sind? Angeblich scheiden sich daran die Geister, wie gut lesbare Texte am Ende auszusehen haben. Ich kann es nicht nachvollziehen, denn wir haben in der Grafik einfache, bewährte und sehr sinnvolle typografische Regeln, um damit gut lesbare Texte zu gestalten. Typografie eben.

Eine davon ist der Kontrast – also das Farbverhältnis zwischen Schriftfarbe und dem Hintergrund. In einem Forum hatte ich einmal ein stolz präsentiertes Weblayout genau deshalb kritisiert. In der Grafik nennen wir das Phänomen, dass der angebliche Webdesigner hier verkaufen wollte „weißer Adler auf weißem Grund“. In diesem Fall hatte er einen dunkelgrauen Fließtext auf hellgrauem Grund, also einen ungenügenden Kontrast.

Das sieht vielleicht nett aus – Geschmackssache vermutlich – ist aber schwierig zu lesen. Das habe ich zurückgemeldet und gefunden, dass das für mich kein gutes Design sei, wenn ich den Text nur mit Mühe lesen kann. Und dabei habe ich noch gesunde Augen. Was machen diejenigen, die eine eingeschränkte Sehfähigkeit haben? Auch ein oft unterschätztes Problem – Stichwort Barrierefreiheit. Jedenfalls stellte sich der Designer auf den Standpunkt, das wäre nun mal sein Design und er würde es eben so machen. Kennen wir auch: „Das kannste schon so machen, aber dann isses halt kacke.“

Für mich ein weiterer Beleg dafür, wie wenig verbreitet das Wissen über die Lesbarkeit von Texten ist, also von guter Typografie. Ich hatte in meiner Ausbildung zum Mediengestalter (Print) vor vielen Jahren eine gestandene Grafikerin und Typografin, von der ich eine Menge lernen durfte.

Webdesign und Typografie

Im Webdesign haben wir aber noch andere Anforderungen an die Typografie als die der Lesbarkeit, nämlich technische. Zu einer guten Lesbarkeit gehört im Internet, dass die Website schnell lädt. Also haben wir es bei der Einbindung von Schrifttypen mit WordPress Performance zu tun.

Außerdem muss gewährleistet sein, dass die Texte auf möglichst allen Ausgabegeräten gleich lesbar sind, was eine weitere Herausforderung darstellt. Am Ende hast du mit den Möglichkeiten der Auszeichnungssprache CSS derart viele Möglichkeiten, in die Typografie einer Website einzugreifen, dass die Sache schnell komplexer wird, als gedacht.

Und wir wollen selbstverständlich einen gut strukturierten Text haben, der ebenfalls die Lesbarkeit erhöht, Ermüdung vermeidet und auf Google, sprich auf das Ranking in der Suchmaschine, wirkt. Als Beispiel seien die Überschriften Tags H1, H2, H3 usw. genannt, der Einsatz von Listen und Auszeichnungsformen wie Bold/Strong und em/i, sowie die Absatzmarken und andere sinnvolle HTML Elemente.

Ich bin ein Freund von Standardschriften. Das mal vorweg. Ich meine, es ist nicht wirklich nötig spezielle eigene Schriften auf einer Website einzubinden. Als Beispiel, weshalb man eine eigene Schrift integriert, sei hier die CI Schrift genannt. Also eine speziell für die Firma entwickelte Schrift, die eine wichtige Funktion bei der Corporate Identity hat. Oder man ist ein richtig guter Designer, Künstler oder Fotograf und legt Wert auf ein extravagantes oder sehr individuelles designlastiges Erscheinungsbild. Dann geht es aber auch nicht unbedingt um große Textblöcke oder schriftliche Informationen.

Eine eigene CI Schrift wird meist von größeren Unternehmen eingesetzt, die mit eigener IT Abteilung und einer Serverfarm operieren. Da gibt es dann keine Performance Probleme und die Einbettung der CI Fonts wird technisch überwacht.

Ist man Designer und will zeigen, was man kann, empfiehlt es sich bei der Typografie auf existierende Dienste – auf bewährte Webfonts – zurückzugreifen, um die gewünschte Schrift sicher und performant in die eigene Website einzubinden.

Manchmal erscheint es auch gegeben, den gewünschten Schriftschnitt in webtaugliche Formate zu verwandeln und einzeln einzubinden. Ob das dann immer und auf Dauer einwandfrei funktioniert, steht auf einem anderen Blatt. Daher präferiere ich in solchem Fall Google Fonts, weil diese schnell, sicher und einfach in der Anwendung ist. Aber auch dies ist vielleicht Geschmackssache.

Diese 10 Typografie Regeln helfen dir weiter

Oberste und ganz einfache Regeln: Weniger ist mehr. Berücksichtige die Lesegewohnheiten der Menschen. Orientiere dich an Websites, die umfangreiche redaktionelle Texte darstellen und lerne.

Die Lesbarkeit von Texten unterliegt bestimmten, wissenschaftlich fundierten Regeln. Sie betreffen nicht nur die Schrift selbst, sondern auch ihre Umgebung, den Kontrast, die Übersichtlichkeit und Struktur der Texte sowie die Schärfe ihrer Ränder.

1. Schriftgröße

Sie hängt von dem Font ab und richtet sich nach dem grundsätzlichen Design der Website. Beachte bitte, dass der User jederzeit die Möglichkeit hat, die Schriftgröße in seinem Browser oder seinem Smartphone zu verändern. Versuche relative Schriftgrößen zu nehmen, also %, EM/REM oder small/normal/medium/large.

2. Zeilenbreite

Diese wird deutlich unterschätzt. Es wurde ermittelt, welche Textbreite von den Menschen noch gern gelesen wird: Es ist eine Breite bis maximal rund 70 Zeichen, also eine Standard A4 Textbreite eines Word Dokuments. Schau auch hier einfach mal bei SPIEGEL ONLINE und Co. nach, wie breit deren Textblöcke sind.

3. Zeilenabstand

Für eine optimale Lesbarkeit ist der sog. Durchschuss, also der Abstand zwischen den einzelnen Zeilen eines Textes – auch die Höhe eines Absatzes – von großer Bedeutung. Im Netz haben sich je nach Font gut 140–150 % „line-height“ bewährt.

4. Laufweite

Das ist der Abstand zwischen den Buchstaben, der durch das „letter-spacing“ manipuliert wird. Man sollte hier sehr vorsichtig sein und diese Gestaltungsmöglichkeit nur mit Bedacht – etwa bei bestimmten Überschriften – einsetzen. Im Zweifel nicht einstellen.

5. Kontrast

Das Verhältnis zwischen Farbe und Hintergrundfarbe nennt man Kontrast. Der sollte bei Fließtexten sehr hoch sein. Der maximale Kontrast ist natürlich schwarzer Text auf weißen Hintergrund. Das ist leicht zu lesen.

6. Struktur

Das bedeutet: gut und semantisch richtig strukturierte Texte! Das meint in HTML bspw. die Überschriften Tags H1/H2/H3, die Absatzmarken, Listen Auszeichnungen, den intelligenten Einsatz von Hervorhebungen mittels Fettung, Kursiv und Farbe. Wirkt unmittelbar auf die Lesbarkeit und auch auf das Google Ranking.

7. Maximal zwei Schrifttypen

Oft reicht eine Schrift pro Website, Buch oder Schriftstück. In Sonderfällen funktionieren auch mehr, aber mit dem Einsatz von mehr als 2 Fonts pro Dokument solltest du vorsichtig sein.

8. Versalien

Verzichte auf Versalien in Überschriften und im Menü. Sie sind schwierig zu lesen. Wenn es sich aber um einzelne Worte, beispielsweise in der NAVIGATION handelt, kannst du Versalien einsetzen. Aber nicht in Großbuchstaben reinschreiben, sondern mittels CSS über „text-transform:uppercase“ lösen.

9. Standardschriften

Im Zweifel und als Fallback solltest du bewährte Systemfonts wählen. Arial, Verdana, Georgia sind solche hervorragend lesbaren Systemfonts, die nahezu alle Ausgabegeräte besitzen und immer gut dargestellt werden.

Ein Fallback ist im CSS der nachfolge Font, wie etwa bei BMW: „bmwTypeWebBoldAll“,“Arial“,“Helvetica“,sans-serif; hier sind Arial, Helvetica und Sans Serif (also der erste unter Sans Serif vorhandene Font) die Fallbacks, die angezeigt werden, wenn die Schrift davor („bmwTypeWebBoldAll“) nicht zur Verfügung steht.

10. Fortbildung

Mein Tipp: Bilde dich in Sachen Typografie durch Workshops, Bücher und Magazine oder auch mal durch ein YouTube Video zum Thema weiter. Ich kann z. B. dieses Video empfehlen. Zwar rät Sven Wolfermann in seinem Vortrag auf der “MobileTechCon” – im Gegensatz zu mir – von Systemfonts ab, liefert aber hier eine Menge wertvolle Informationen zum Thema!

Schriftgestaltung mit CSS: Ist das sinnvoll?

Ein Wort zur Schriftgestaltung, genauer gesagt Einstellung mittels CSS: Nicht zuletzt seit der Einführung von CSS3 stehen den Entwicklern subtile Einstellungsmöglichkeiten für die Schriften einer WordPress Website zur Verfügung. Aber ergeben die wirklich immer Sinn? Wozu setze ich sie wann ein? Was will ich erreichen? Lesbarkeit? Schönes Design? Darüber scheinen nicht alle Coder – oder ihre Kunden – nachzudenken. Sie machen manchmal alles, was möglich ist. Verändern nicht nur den Durchschuss („line-height“), was zuweilen Probleme mit Höhen, Abständen und Positionierungen mit sich bringt, sondern auch das letter-spacing oder legen Schatten um den Text („text-shadow“). Schlimm, was manchmal zu sehen ist.

Ich rate dir deshalb dazu, mit diesen Einstellungen sehr vorsichtig umzugehen und diese Techniken mit Bedacht einzusetzen. Sie funktionieren nicht überall und behindern auf kleinen Displays sogar die Darstellung. Dann musst du die Anweisungen für den Desktop über „Media Queries“ wieder zurücknehmen, was wiederum Zeit und Code kostet. Ergibt das wirklich Sinn? Die Antwort sollte sehr klar und präzise ausfallen.

Schriftschnitte für das Web: die Webfonts

Nebenbei bemerkt: BMW benutzt auf seiner Website wie eben gesehen dies: font-family: „bmwTypeWebBoldAll“,“Arial“,“Helvetica“,sans-serif;font-weight: normal; – im Fließtext ganz normal Arial. Auch Amazon nutzt Arial auf der Shop Website. Apple dagegen benutzt natürlich eine eigene Schrift als Webfont. Der Ölkonzern TEXACO nutzt Adobe Fonts. Nur als kleine Beispiele.

Glücklicherweise gibt es mittlerweile viele Anbieter von Web-Schriften, die gut funktionieren und sich in der Regel leicht einbinden lassen. Leider sind diese „Webfonts“ in der Regel kostenpflichtig, wobei sich die Preise stark unterscheiden. Als Beispiele, neben Google Fonts , seien noch genannt: Adobe Fonts (Typekit) , Webtype , Adobe Edge Web Fonts  und viele weitere mehr – Geschmacksache.

Der Vorteil diese Dienste liegt auf der Hand: Du hast keine Lizenz-Sorgen (siehe weiter unten „Achtung: Lizenzen!“), die Fonts funktionieren und es gibt Hilfe genauer gesagt Anleitungen zum Einbinden der Fonts auf der eigenen Website (also Support oder Foren dazu). Die Tarife sind oft erweiterbar und du hast eine gewisse Auswahl an spannenden Schriften.

Das Missverständnis mit Google Fonts

Als im Mai 2018 die sog. DSGVO für alle verbindlich eingeführt wurde, schreckte die Netzgemeinde vor dem Einsatz von Google Fonts panisch zurück. Man hatte Angst, dass der Einsatz der Google Webfonts – Google als „Datenkrake“, gegen die sich diese Gesetzgebung ja richtete – nicht mit den Datenschutzgesetzen übereinstimmen und man deshalb teure Abmahnungen riskieren würde.

Diese immer noch verbreitete Angst beleuchtet die leider immer noch anhaltende große Verwirrung um die DSGVO. Zum Wohl der Rechtsanwälte und Web Kanzleien natürlich. Wenn man wegen des Einsatzes von Google Analytics mit Google eine Auftragsverarbeitung abgeschlossen hat und auf den Einsatz der Fonts – und im Zweifel auf Cookies – in der Datenschutzerklärung hinweist, ist das Problem vom Tisch.

Wer immer noch Angst hat, kann alle Google Fonts auch lokal einbinden, also die Google Webfonts downloaden und auf dem eigenen Webspace speichern.

Außerdem wurde immer wieder die Performance angeprangert, die angeblich so schlecht war, wenn man die Fonts über Google lädt. Dabei bleibt unerwähnt, dass Google eine schnelle und äußerst stabile Server Architektur besitzt und dass es noch Fallbacks (siehe oben) gibt. Überdies lädt man die Fonts von einer anderen URL, was gleichzeitig mit dem Laden der Dateien vom eigenen Server geschehen kann. Aber man ist einmal mehr von Google abhängig.

Achtung: Ladezeiten!

Die Sache ist ganz einfach. Extern integrierte Webfonts können die Ladezeit der WordPress Website erhöhen. Der notwendige Code, um eigene Schriften in die WordPress Website zu integrieren, auch. Einzig die Standardschriften, die Systemfonts auf den Rechnern und Smartphones der User, benötigen keine Ladezeit, weil sie nicht über einen Server, nicht über das Internet geladen werden.

Oder anders ausgedrückt: Wenn deine WordPress Website schnelle Ladezeiten braucht, vielleicht nicht das entsprechende WordPress Hosting dahintersteckt und das Unternehmen keine CI-Schrift hat, die unbedingt eingebunden werden muss, würde ich immer auf Standard setzen. Also auf Systemfonts, wie es Amazon mit Arial macht. Das hat schon seinen Sinn.

Natürlich geht es hier nicht um die Kilobytes der zu ladenden Schriften. Es geht darum, dass diese on top kommen, also noch zusätzlich heruntergeladen werden müssen und dass der Server, der sie ausliefern soll, unter Umständen gerade schwächelt. Das sieht dann nicht gut aus und ist … vermeidbar.

Achtung: Lizenzen!

Was auf jeden Fall zu beachten ist, sind die Lizenzen für die eingesetzten Fonts. Wenn man Google Fonts einsetzt oder Systemschriften, die ja bekanntlich vom Rechner des Users geladen werden, ist man auf der sicheren WordPress Website. Bei allen anderen Schriften, die man auf der Website einsetzt, muss man darauf achten, dass man die Lizenz dafür besitzt. Und diese kann schnell ziemlich teuer werden. Sei es, um sie auf der eigenen Website einzusetzen, oder ob es sich um einen Free Font handelt, der manchmal andere Sorgen bereitet, wenn wir etwa an die deutschen Umlaute und das Eszett (ß) denken.

Um diese ganzen Probleme zu vermeiden, setzte ich eben auf Systemschriften oder auf Google Fonts. Wenn der Kunde nun unbedingt eine eigene Schrift wünscht, sollte man den Aufwand dafür großzügig in die Kalkulation aufnehmen, da die Integration externer Schriften in die Website manchmal einige Probleme verursachen kann. Beispielsweise bei den CSS Anweisungen und hier zum Beispiel, was ich immer richtig mies finde, beim Suchen des korrekten Schriftnamens, um den Font für die Anzeige der HTML Tags auch korrekt ansteuern zu können.

Eigene Fonts einbinden

Mit Webfonts und/oder eigenen Fonts, die du über ein Tool für deine WordPress Website nutzbar gemacht hast, kannst du dir schnell eine Reihe von Problemen für deine WordPress Website einhandelt. Nicht selten treten folgende Phänomene dabei auf:

• Flackernde Schrift beim Laden der WordPress Website (nicht ungewöhnlich, manchmal sieht man auch eine andere Schrift, bis das CSS diese mit dem Webfont überschreibt.
• Längere Ladezeiten durch sehr komplexe Fonts (eher selten).
• Häufiger sind Unschärfen der Schrift, Verzerrung durch fehlerhaftes Rendering (auf bestimmten Systemen).

Um den gewünschten Font auf möglichst allen Ausgabegeräten anzeigen zu können, benötigst du verschiedene Varianten desselben. „TTF“ ist klar und bekannt, aber du benötigst auch „EOT“ und die beiden „WOFF“ Varianten. Das ist unumgänglich, wenn du eigene Fonts in deine WordPress Website einbinden willst. Diese Formate kannst du dir kostenlos mit dem Webfont Generator erzeugen lassen. Danach lädst du alle Formate deiner Schrift in ein Verzeichnis deines Servers und bindest diese in dein Stylesheet (CSS Datei) mit Pfad wie folgt ein:

@font-face {
font-family: 'Dein Font';
font-style: normal;
font-weight: normal;
src: local('Dein Font'),
      url('/deinfont.woff2') format('woff2'),
      url('/deinfont.woff') format('woff'),
      url('/deinfont.ttf') format('ttf'),
      url('/deinfont.eot') format('eot');
}

@font-face {
font-family: 'Dein Font';
font-style: italic;
font-weight: normal;
src: local('Dein Font Italic'), vbx
      url('/deinfont-italic.woff2') format('woff2'),
      url('/deinfont-italic.woff') format('woff'),
      url('/deinfont-italic.ttf') format('ttf'),
      url('/deinfont-italic.eot') format('eot');
}

Du siehst an diesem @font-face-Code, der deine Schrift integriert, wie komplex die Sache ist – und damit wie fehleranfällig.

Dann kannst du sie in deinem CSS-Code verwenden und den Klassen und IDs zuweisen. Auf diesem Weg können einige Fehler auftreten, die ich an dieser Stelle nicht behandeln möchte. Nach wie vor: Ich empfehle Standard- oder Systemfonts oder Google Fonts, die man einfach über die verlinkte Datei im Header der Website einbindet:

<link href='https://fonts.googleapis.com/css?family=Roboto:400,400i,700,700i' rel='stylesheet' type='text/css'>

Typografie und mobile Darstellung

Dieser Aspekt wird grundsätzlich vernachlässigt. Aus meiner Sicht ist es absolut nicht notwendig, auf einem kleinen Display oder einem Smartphone eine besondere Schrift zu laden. Wie sieht mit den Fallbacks aus, den Systemschriften der Mobiltelefone? Wenn ich eine mobile WordPress Website herstelle oder mobil optimieren muss, spare ich wegen der Ladezeit natürlich als Erstes das Downloaden eines Webfonts oder einer eigenen Schrift.

Es ist zwar eine strategische Entscheidung, die selbstverständlich mit dem Kunden diskutiert werden muss, aber ich sehe nicht ein einziges Argument, dass für einen Webfont oder eine eigene Schrift in der mobilen Darstellung spricht.

Natürlich gibt es auf dem Smartphone nicht alle Systemschriften, die es für den Desktop gibt. Aber hier ist es aus meiner Sicht auch nicht von Bedeutung, ob ihr nun diese oder jene Schrift für die Android-System vorgesehen habt. Es geht hier nur noch um schnelle Information und gute Lesbarkeit. Dies wird auf Android und Apple mit ihren websicheren Fonts auf jeden Fall garantiert.

Wenn wir die Sache unter zwei wesentlichen Gesichtspunkten betrachten, nämlich der Ladegeschwindigkeit und dem Design, müssen wir zu dem Schluss kommen, dass eine eigene Schrift für die mobile Darstellung überflüssig ist. Einerseits beeinträchtigt der Font die Ladegeschwindigkeit der mobilen WordPress Website, die gerade bei Abruf an der Bushaltestelle von Bedeutung ist. Andererseits haben wir Inhalte und Design der mobilen Version der Website (hoffentlich) aus diesen Gründen auf das Wesentliche reduziert. Weshalb da noch einen ausgebufften Webfont laden?

Das Wesentliche ist immer die Lesbarkeit bzw. das, was wir erreichen wollen: Vermittlung von Wissen, literarische Unterhaltung, den Kauf eines Produktes, eine Kontaktaufnahme, die Newsletter-Bestellung oder das Einsehen der Adresse. Und dafür, meine ich, braucht es keine Sonderschrift und keinen Webfont.

Websichere Schriften

Du solltest auf jeden Fall prüfen, ob eine der Systemschriften für dein Projekt geeignet ist. Eine vollständige Sammlung von sog. websicheren CSS Anweisungen für Systemfonts genauer gesagt websichere Schriften findest du auf CSS Font Stack.

Was sind websichere Schriften? Websichere Schriftarten sind Schriftarten, die in vielen Betriebssystemen vorinstalliert sind. Obwohl nicht auf allen Systemen die gleichen Zeichensätze installiert sind, kannst du einen websicheren Block von CSS Einstellungen verwenden, um mehrere Zeichensätze auszuwählen, die ähnlich aussehen und auf den verschiedenen Systemen installiert sind, die du unterstützen möchtest. Wenn du ab CSS3 andere als vorinstallierte Schriftarten verwenden möchtest, kannst du die Einstellungen für diese Webfonts verwenden.

Fazit zu den Typgrafie Grundlagen

Du solltest dir sehr genau überlegen, ob es ein Systemfont genauso oder sogar besser tut, als ein Webfont oder eine eigene Schrift. Bewährte Schriften wie Verdana, Arial, Trebuchet, Georgia, Times New Roman u. a. kannst du bedenkenlos einsetzen, da diese immer lesbar sind. Und dabei haben wir noch nicht über die inhaltliche Qualität der Texte geredet, die natürlich eine entscheidende Rolle spielt. Aber das ist ein anderes Thema. Unterschätze das Thema Typografie auf Websites nicht. Bedenke die technischen Aspekte, wie Ladezeit oder Umlaute der Fonts, aber auch die Nutzerfreundlichkeit deines typografischen Designs, also Lesbarkeit, Kontrast und Zeilenhöhe.

Überlege dir gut, ob du einen eigenen oder einen externen Font benutzen willst oder ob du auf Standard Fonts genauer gesagt Systemschriften setzt. Wenn du dich für einen eigenen Schrifttypen entscheidest, dann frage dich, ob du diese Schrift oder eine ähnliche Variante mit Google Fonts einsetzen kannst. Oder ob du die Fonts wirklich per Hand über CSS einbinden und sie zuvor in allen Formaten auf den Server laden möchtest. Die Standardfonts, die der User auf dem Rechner oder dem Smartphone hat und die von dort geladen werden, sind bewährt und benötigen keine Ladezeit. Dies gilt umso mehr beim mobilen Laden, bei der Anzeige deiner WordPress Website auf Smartphones.

Für mich persönlich spricht in der Regel nicht viel für die Benutzung einer externen Schrift oder eines Webfonts. Wenn ein WordPress Theme Google Fonts schon an Bord hat, nutze ich das natürlich. Weil ich sonst die ganze Sache aufschrauben oder überschreiben muss. Das ist nicht wirklich sinnvoll.

Wenn es nicht klar zur Corporate Identity eines Unternehmens gehört, ist ein eigener Font Spielerei. Und dazu haben die meisten Kunden weder Zeit noch Geld. Viele Wege führen nach Rom – der falsche Einsatz von Typografie auf einer Website und im Webdesign jedoch vermutlich nicht. Mit Systemschriften, mit Standardfonts lassen sich wunderbare Designs und tolle Websites gestalten und befüllen. Ihre Benutzung ist der sicherere Weg und das wird noch eine ganze Zeit so bleiben. Vielleicht ist es Geschmacksache, vielleicht ist dies aber der sinnvollste Ansatz zum Thema Schriften auf Websites.