Als Webdesigner hatte man es nie so leicht wie heute, schicke Schriftarten für eine Website zu finden. Dank moderner neuer Webfonts sind Ihrer Kreativität quasi keine Grenzen gesetzt. Diese riesige Auswahl kann allerdings auch dafür sorgen, dass man etwas länger benötigt, um die ideale Schriftart für seine Seite zu finden. Dabei ist die Bedeutung der Schriftart nicht zu unterschätzen, denn mit der richtigen Kombination kreativer Webfonts, die den Charakter Ihrer Seite widerspiegeln und auch im Responsive Webdesign eine gute Figur machen, hinterlassen Sie bei Ihren Lesern einen positiven Eindruck.
Die Rolle der Webtypografie hat sich in den vergangenen Jahren stark verändert, was vor allem auf technische Fortschritte und die dadurch entstandenen Möglichkeiten zurückzuführen ist. In den Anfängen von HTML und Co. war es beispielsweise noch so, dass Schriftarten und -stile durch die Einstellungen des verwendeten Internetbrowsers definiert wurden und nicht etwa durch den Code der Website. Erst mit dem mittlerweile veralteten <font>-Tag erhielten Entwickler das notwendige Werkzeug, selbstgewählte Schriftarten einzubinden. Nutzer konnten die jeweiligen Fonts jedoch nur laden, wenn diese auch auf ihrem Computer installiert waren; ansonsten wurde auf einen „Fallback-Font“ – in der Regel einen Browser-Standard-Font – ausgewichen.
Dank der Trennung des Inhalts (HTML) von gestalterischen Mitteln in Cascading Style Sheets (CSS) und der Implementierung des Font-Downloads in Webbrowsern können Webdesigner heutzutage bei der Webseitengestaltung auf die sogenannten Webfonts zurückgreifen. Dabei handelt es sich um digitalisierte Schriftarten. Der Browser des Nutzers erhält beim Laden der Seite den Hinweis, auf welchem Server die jeweiligen Webfonts liegen und ruft diese dort ab. Dadurch sehen Besucher der Website die gewählte Schriftart, selbst wenn diese nicht auf ihrem Computer installiert ist.
Seit der Entwicklung des Web-Open-Font-Formats (2007) werden Webfont-Lizenzen von einer immer größer werdenden Zahl an Anbietern zu unterschiedlichsten Konditionen verkauft. Dabei variieren vor allem der Preis und die Bezahlmethode sowie die Art des Hostings (auf dem eigenen Server oder auf dem Server des Anbieters). Aufgrund des Wettbewerbs, der vor allem durch die hohe Bedeutung der Typografie für mobile Geräte zustande kommt, stehen Designern zahlreiche moderne und kreative Webfonts zur Auswahl.
Mit dem Begriff Schriftart fasst man sämtliche Schriftzeichen zusammen, die nach einem identischen Gestaltungskonzept entworfen wurden. Existieren mehrere Varianten solch einer Schriftart, die sich bspw. hinsichtlich der Strichstärke oder Laufweite unterscheiden, dann bezeichnet man sie als Schriftfamilie.
Die unterschiedlichen Schriften eignen sich für verschiedene Einsatzgebiete. Bei der Auswahl einer Schriftart sollte man daher vor allem auf zwei Dinge achten: die Lesbarkeit der Schrift und ihre emotionale Wirkung. Dabei spielt auch das Medium eine große Rolle. Bei sogenannten Serifenschriften weisen die einzelnen Buchstaben am Ende der Buchstabenbalken kleine Querstriche auf, die ein flüssiges Lesen kleingedruckter Texte erleichtern. Für das Lesen am Monitor ist diese Schriftart allerdings nicht immer ideal.
Funktion und Position im Text sollten die Wahl der Schriftart ebenfalls beeinflussen: Während besonders auffällige Schriften in den Überschriften für die gewünschte Aufmerksamkeit sorgen, wirken sie im Fließtext oft deplatziert. Aus diesem Grund verwenden Webdesigner häufig mehrere unterschiedliche Schriftarten oder Schriftschnitte (so nennt man die Varianten innerhalb einer Schriftfamilie) in einem Textes. Allerdings sollte man es hierbei nicht übertreiben, da die Website sonst schnell überladen wirkt.
Auch hinsichtlich ihrer Wirkung unterscheiden sich die einzelnen Schriften sehr stark voneinander. Die nachfolgende Tabelle bietet einen Überblick, welche Schriften für welche Texte besonders geeignet sind und welchen Assoziationen sie beim Leser auslösen.
Die hier aufgelisteten Eigenschaften der unterschiedlichen Webfont-Kategorien stellen nur die allgemeinen Erwartungen dar. In der Praxis ist oftmals gerade der Einsatz unerwarteter Fonts ein probates Mittel, sich von der Konkurrenz abzuheben. Um die passenden Webfonts zu finden, sollten Sie folgende Ratschläge beherzigen:
Anbieter moderner Webfonts verkaufen Ihnen digitale Schriftarten mit verschiedenen Lizenz-Modellen, wodurch Sie z. B. entweder einmalig für den Besitz der Fonts oder für die Dauer ihrer Nutzung bezahlen. Im ersten Fall hosten Sie die Fonts selbst, im zweiten erhalten Sie in der Regel einen Link zum Server des Anbieters, auf dem die Webfonts gespeichert sind. Zusätzlich zu den kostenpflichtigen Schriften gibt es auch eine Reihe von Open-Source-Schriften: Solche Fonts werden allerdings von sehr vielen Webdesignern verwendet.
Wenn Sie Ihre Website mit außergewöhnlichen, neuen Webfonts erstellen bzw. optimieren möchten, sollten Sie die Angebote verschiedener Webfonts-Anbieter vergleichen. Einige interessante Dienste haben wir an dieser Stelle für Sie aufgelistet:
Sie brauchen noch ein Favicon für Ihre Webseite? Mit dem kostenlosen Favicon-Generator von IONOS können Sie im Handumdrehen Ihr eigenes entwerfen!
Webdesigner werden im Jahr 2020 größtenteils dort weitermachen, wo sie 2019 schon ihr Hauptaugenmerk hatten: bei der Nutzerfreundlichkeit. Dabei sind die Trends im Webdesign nach wie vor durch die mobile Revolution geprägt, die Webdesigner zum Umdenken zwang: Die Bildschirme wurden kleiner, das Internet musste mitziehen. Wir verraten Ihnen anhand von 8 Trends, wie sich das Webdesign 2020...
Das Internet bietet zahlreiche Texte mit unterschiedlichsten Schriftarten. Die Verbreitung des Responsive Webdesigns wirkt sich auch auf die Webseiten-Typografie aus. Schließlich sollte sich die Schriftdarstellung stets dem Bildausschnitt des verwendeten Geräts anpassen. Reaktionsfähige Typografie muss bei der Darstellung flexibel sein und entsprechende Schriftfonts nutzen. Wir geben Ihnen einen...
Im Responsive Webdesign ist die Typografie ein häufig vernachlässigtes Feld, obwohl die Gestaltung einer anpassungsfähigen Schrift kein Expertengeheimnis ist. Wie lässt sich diese realisieren? Und welche Webfonts taugen für ein responsives Schriftbild? Wir geben Ihnen einen Einblick in die technische Umsetzung reaktionsfähiger Webtypografie und wie Sie diese über CSS in Ihren Webauftritt...
Die Auswahl an Webschriften hat sich mit der Einführung von Webfonts gewaltig erhöht. Viele dieser Schriftarten lassen sich kostenlos herunterladen. Dank ihrer Anpassungsfähigkeit eignen sie sich perfekt fürs Responsive Webdesign – die Schrift Ihrer Webseiten passt sich den Anforderungen der Endgeräte an. Verschiedene Internet-Plattformen bieten reaktionsfähige Webfonts an, die Sie schon mit...
