schriften

Google Fonts über den eigenen Server einbinden

Es gibt verschiedene Methoden, um Google Fonts in eine Webseite einzubinden. Die klassische Methode ist, die Schriften über einen Link in der header.php oder – besser – über die functions.php ins Theme einzubinden. Ellen Bauer hat einen ausführlichen Artikel dazu geschrieben: Google Fonts in WordPress Themes

Bei dieser Methode liegen die Schriften auf den Google-Servern und werden über einen Link auf meine Webseite geholt. Wird meine Seite geladen, schickt sie eine Anfrage an den Google Server und der liefert dann die Schriften aus. Davon merkt man in der Regel nicht viel. Aber es bleibt die Tatsache, dass eine Abfrage passiert und das dauert ein paar Millisekunden.

Je nach der Qualität der Datenverbindung kann es auch passieren, dass die Schriften nicht schnell genug ausgeliefert werden. Dann erscheinen alle Texte plötzlich in Arial oder Times.
Auch Firewalls können ein Problem darstellen – in manchen Firmen gelten so strenge Regeln, dass die Mitarbeiter keine Google Fonts zu sehen kriegen.

Google Fonts herunterladen und Webfont erzeugen

Aus diesen Gründen bin ich in letzter Zeit dazu übergegangen, Google Webfonts nicht mehr per Link einzubinden, sondern direkt auf den Sever zu laden, auf dem auch das WordPress-Theme liegt. Ich gehe davon aus, dass das rechtlich kein Problem ist, denn die Google Webfonts haben eine SIL Open Font License, die das Herunterladen erlaubt.

Wenn man sich bei den Google Webfonts eine Auswahl zusammengestellt hat, kann man diese Auswahl über einen Link herunterladen. Der Link versteckt sich hinter dem kleinen Pfeil rechts über der bunten Page-Load-Anzeige.

 

Allerdings befindet sich in dem zip-Archiv, das im Download-Ordner landet, nur eine TrueType-Version der Schrift. Damit können nicht alle Browser etwas anfangen. Der Font muss in mehreren Formaten (ttf, eot, woff, woff2, svg) zur Verfügung gestellt werden.

Das ist aber nicht weiter schwierig, denn es gibt Tools um aus einem TrueType-Font einen Webfont zu erzeugen. Zum Beispiel den Google Webfonts Helper. Ich nutze sehr gerne den Webfont-Generator von fontsquirrel.com.

Beide Tools bringen praktische CSS-Schnipsel mit, die man per Copy & Paste in die CSS-Datei des WordPress-Themes übertragen kann. Hier ein Beispiel von FontSquirrel.

/* Generated by Font Squirrel (http://www.fontsquirrel.com) on March 12, 2016 */
@font-face {
    font-family: 'fira_sansthin';
    src: url('firasans-thin-webfont.eot');
    src: url('firasans-thin-webfont.eot?#iefix') format('embedded-opentype'),
         url('firasans-thin-webfont.woff2') format('woff2'),
         url('firasans-thin-webfont.woff') format('woff'),
         url('firasans-thin-webfont.ttf') format('truetype'),
         url('firasans-thin-webfont.svg#fira_sansthin') format('svg');
    font-weight: normal;
    font-style: normal;

}

Windows-Fonts vergrößern: Mehr Komfort mit größeren Schriften

Je größer der Monitor ist, umso kleiner sind die Schriften auf dem Bildschirm. Auf sehr großen Monitoren ist dann zwar viel Platz für Programmfenster – die Menüs, Symbolunterschriften und Internetseiten sind aber kaum noch zu entziffern. Mit wenigen Handgriffen können Sie die Schriften vergrößern, ohne die Bildschirmauflösung zu verändern.

Gehen Sie folgendermaßen vor, um die Schriften auf dem Bildschirm zu vergrößern:

1. Verkleinern Sie mit der Tastenkombination [Windows-Taste[D] alle Programmfenster.

2. Klicken Sie mit der rechten Maustaste auf einen freien Bereich der Windows-Arbeitsoberfläche, und wählen Sie aus dem Menü den Befehl “Anpassen” (wenn Sie Windows Vista, Windows 7 oder Windows 8 verwenden) bzw. “Eigenschaften” (Windows XP).

3. Bei Windows Vista klicken Sie auf Schriftgrad anpassen (DPI)” und bestätigen den Sicherheitshinweis mit “Fortsetzen”. Bei Windows 7 und Windows 8 klicken Sie auf “Anzeige” sowie “Benutzerdefinierte Textgröße (DPI) festlegen”. Nutzer von Windows XP wechseln in das Register “Einstellungen” und klicken auf die Schaltfläche “Erweitert”.

windows-schriftgroesse-aendern-schriftgrad-dpi-anpassen

4. Im nächsten Fenster aktivieren Sie bei Windows XP die Option “Größere Skalierung (120 DPI) – Text ist besser lesbar”; bei Windows Vista, Windows 7 wählen Sie über das Listenfeld oder das Lineal eine prozentuale Vergrößerung aus. Das Lineal können Sie skalieren, indem Sie darauf klicken und die Maus mit gedrückter Maustaste nach rechts oder links schieben.

windows-schriftgroesse-aendern-schriftgrad-dpi-anpassen-2

Bei Windows 8 müssen Sie zuerst das Kästchen “Manuell eine Skalierungsstufe für alle Anzeigegeräte auswählen” ankreuzen und dann auf “Benutzerdefinierte Optionen für die Größenanpassung” klicken. Erst dann erscheint das Fenster für die DPI-Einstellung.

windows-schriftgroesse-aendern-windows-8-2

Bei Windows 8 können Sie im Feld “Nur die Textgröße ändern” sogar individuell die Größer der einzelnen Fensterelemente festlegen. Hierzu wählen Sie zunächst aus, welche Elemente Sie vergrößern möchten – etwa die “Titelleisten” – und dann die gewünschte Schriftgröße, etwa “12″.

windows-schriftgroesse-aendern-windows-8

5. Bestätigen Sie die Änderungen mit OK bzw. “Übernehmen”. Mitunter müssen Sie zur Aktivierung den Rechner neu starten.