Google Web Fonts
Bis in das Jahr 2010 hinein waren Schriftarten im Web noch ein Problem für manchen Webentwickler. Bei der Erstellung der eigenen Website konnte es vorkommen, dass Schriftarten nur auf speziellen Endgeräten funktionierten. Wer ein anderes Endgerät benutzte als für das Vorgesehene hatte das Nachsehen. Im Jahr 2010 begann Google damit dieses Problemfeld zu revolutionieren und erfand Google Web Fonts.
Websites zu erstellen, braucht viel Übung und Geduld. Noch einige Jahre zuvor gab es ein massives Problem für Webentwickler, denn proprietäre Schriftarten (Webfonts = Netzschriftarten) konnten nicht auf jedem Endgerät dargestellt werden. Eine Optimierung gab es nur für wenige Seite, wobei andere darunter leiden mussten.
Glücklicherweise veröffentlichte Google „Google Web Fonts“ in der Absicht, dieses Problem lösen zu können. Wie das alles funktioniert erfährst du in diesem Artikel.
Erklärung & Ursprung – Was ist ein Font?
Als Web Fonts oder Webschriften bezeichnet man eine digitale Schriftart bzw. den Gebrauch von Schriftarten auf Internetseiten. Diese kann auch ohne Installation auf den entsprechenden Endgeräten im Web dargestellt werden. Das Resultat erfolgt durch das Referenzieren von Quelltext (ein für Menschen lesbarer Text in einer Programmiersprache) und einer Seite via CSS (Stylesheet-Sprache für elektronische Dokumente).
In der Anfangszeit von HTML bestimmte man Web Fonts durch die jeweiligen Einstellungen im Webbrowser. Daher waren die Web Fonts beschränkt auf eingebaute Schriftarten wie Monospace oder Sans-Serif. Nach einiger Zeit wurde es dank dem <font>-HTML-Tag möglich auch andere Fonts zu nutzen. Dort gab es aber die Voraussetzung, dass der jeweilige Font auf dem jeweiligen Rechner installiert war. Neue Optionen wie Arial oder Times New Roman kamen später neu hinzu.
Mittlerweile unterstützen moderne Browser das Herunterladen einer großen Auswahl an zusätzlichen Fonts von einem externen Webserver. Um also deine Seite individuell zu gestalten, ist es vorteilhaft darauf zurückzugreifen. Aufpassen muss man allerdings, ob dafür eine Gebühr gezahlt werden muss oder sich Gratisangebote wie z.B. Google Fonts finden lassen.
Verwendung von Fonts
Den Einsatz finden die Webfonts natürlich im Internet. Um genau zu sein sind sie primär für browserbasierte digitale Texte vorgesehen. Außerdem kann es zur Herstellung von Logos oder Grafiken genutzt werden.
In der Regel werden sie beim Aufrufen einer Seite von einem externen Webserver in den Browser geladen und nicht etwa aus einer lokalen Schriftensammlung eines Computers geholt. Das Interesse an Webtypografie (Typografie für digitale Texte – visuelle Gestaltung von Textdokumenten) und dem Herunterladen von verschiedenen Schriftarten stieg.
Nachdem 1996 die erste Version von Cascading-Style-Sheets-Spezifikation (CSS) veröffentlicht wurde und der Internet Explorer der erste Browser war, der dies unterstützte. Später wurde der Font-Download ein Bestandteil des Font-Moduls von CSS3 und wurde seither in fast allen modernen Browsern implementiert.
Was muss bei Web Fonts beachtet werden?
Leider werden Web Fonts nicht immer kostenfrei bzw. nutzungsfrei vertrieben, sondern manchmal auch kosten- und lizenzpflichtig. Dabei variieren die Kosten, der Umfang und die Lizenzbedingungen je nach Anbieter und oder Land. Die Angebote erstrecken sich dabei von Gratis-, Sonder-, Kombi-, oder Pauschalangeboten sowie Abonnementmodellen.
Heutzutage gibt es eine Vielzahl an freien Web Fonts mit Open Source Lizenzen. Diese kann man sich auf einzelnen seriösen Seiten herunterladen, ohne Angst vor Schadsoftware oder versteckten Kosten zu haben.
Kostenlose Dienste wie „Google-fonts“ hosten die kostenlosen Schriftarten. Das Gute ist: Nahezu alle Browser und auch Mobilgeräte unterstützen die heutigen Webfonts und sind somit überall nutzbar. Aufpassen muss man allerdings bei E-Mails, da zwar die meisten Clients Webfonts unterstützen, aber zum Beispiel Outlook dahingehend einen Sonderweg geht. Dort geht es nämlich nicht.
Tipps zur Verwendung von Web Fonts
Es ist denkbar einfach Google Fonts einzubinden. Falls man in einem Webseitenprojekt steckt, sollte man sich vorher einen Plan machen, wie die Seite ungefähr aussehen soll. Danach kann man eine oder mehrere Schriftarten wählen. Diese variieren von gerade bis kursiv und von fett bis sehr dünn, von Druck- und Schreibschrift usw.
Je nach Notwendigkeit kannst du danach die Schriftschnitte auswählen. Dabei musst du aufpassen, denn je mehr Schriftschnitte ausgewählt werden, umso größer ist auch die zu ladende Datenmenge. Das heißt, du solltest nicht alle Schnitte pauschal aktivieren, sondern sie bewusst wählen.
Danach hast du die Möglichkeit eine Einbindungsvariante zu wählen. Zur Auswahl stehen dir dabei zwei: Die HTML-Einbindung und die Einbindung per CSS, wobei diese die bevorzugte Variante ist.
Und dann kommen wir schon zum letzten Schritt: Du musst die eingebundene Schriftart nun dem gewünschten HTML-Element zuweisen. Hier auch wie üblich Alternativschriften definieren und fertig!
Vor- und Nachteile
Natürlich möchte sich jede Seite von der anderen abheben und unterscheiden. Dabei spielen die Webfonts eine wesentliche Rolle, da Text meistens den meisten Platz einer Webseite einnimmt. Somit ist der größte Vorteil von Google Webfonts die Vielfalt der Schriftarten. Je nach Projekt findet man höchstwahrscheinlich die persönlich passende Schriftart. Das Angebot ist quasi endlos.
Hin und wieder kann es jedoch auch vorkommen, dass die Lesbarkeit im Web leidet. Dieses Problem entsteht, wenn man die Schriftglättung (Cleartype) unter Windows deaktiviert. Somit werden die Fonts manchmal nicht sauber dargestellt. Dabei spielt das Betriebssystem keine Rolle. Dieses Problem kann aber leicht behoben werden.
Anders war es früher mit Schriften, die vorher auf dem Computer des Lesers vorinstalliert sein mussten, damit dieser sie auch lesen konnte. Mittlerweile ist es kein Problem mehr, da mit dem modernen Webdesign nun beliebige Schriftarten verwendet werden können, ohne vom Endgerät des Lesers abhängig zu sein.
Worauf noch geachtet werden sollte ist die Auswahl bestimmter Fonts. Es gibt manche kostenlose Schriftarten, die zwar gut aussehen, jedoch sind sie für deutsche Anbieter nicht immer geeignet, da schlicht die deutschen Umlaute und Sonderzeichen fehlen. Außerdem haben sie keine eigene Darstellung von z.B. „fett“ und „kursiv“, die man dann vom Browser interpolieren muss. Das kann allerdings dazu führen, dass zum Beispiel bei Fettung die Anpassung an den normalen Schriftschnitt zu unschönen Verzerrungen führt.
Des Weiteren ist bei der Gestaltung zu beachten, dass Qualität der Schriftdarstellung abhängig von Browser und Betriebssystemen ist. Probleme dabei sind z.B. eine fett erscheinende Schrift von Gerät zu Gerät, oder Treppeneffekte bei großen Schriftarten. Achten sollte man also darauf, dass die Schriftarten für die Ausgabe auf allen Monitoren optimiert sind.
Fazit
Wie mit allem was Gestaltung und Vielfalt angeht, muss auch bei den revolutionären Google Webfonts mit Acht umgegangen werden. Wer unüberlegt Fonts nutzt die einfach nur schön aussehen, der kann am Ende eine unangenehme Überraschung erleben wie z.B. die schlechtere Lesbarkeit oder die kompliziertere Bedienbarkeit einer Seite.
Sowas kann umgangen werden, wenn man seine Seite ausführlich und umsichtig auf verschiedenen Geräten testet. Da Webfonts eine Seite individuell machen und der Website somit einen Wiedererkennungswert geben, sollten sie so oft wie möglich genutzt werden.
Der Kreativität ist hierbei keine Grenze gesetzt. Somit ist man bei „Google Web Fonts“ gut aufgehoben, da es über eine große Bandbreite an verschiedensten Schriftarten verfügt und einfach in der Handhabung ist. Hier findest du einen weiterführenden Artikel zu unserer Auswahl für die besten Google Web Fonts.
