[Tutorial] Google Web-Fonts verwenden 2.0

Schriftarten die nicht dem Standard entsprechen können etwas optischen "Luxus" ins Forum bringen und Überschriften wunderschön gestalten. Manchmal ist eine andere Schriftart auch etwas worauf das Auge sofort achtet und eine wunderbare Möglichkeit etwas hervorzuheben oder einfach nur hübsch anzusehen.
Dabei sollte aber ein jeder Admin beachten, dass JEDE neue Schriftart, die in das Forum gepflanzt wird, auch dazu führen kann das das eigene Forum länger in der Ladezeit braucht. Ratsam ist es zwei bis drei Schriftarten einzusetzen die sich im "Load Time FAST" bewegen. (Dazu später mehr)

In diesem Beitrag gehe ich nach und nach auf folgende Bereiche ein:
Die Seite von Google Front und das einsetzen in die Templates bzw. dem Forum.

Bevor ich aber nun dazu komme möchte ich eine wichtige Sache ansprechen:
Für das Umsetzen dieses Tutorials ist ein solides CSS-Wissen unverzichtbar um CSS-Einträge zusammenzustellen sowie einzusetzen. Sofern diese Fertigkeit nicht vorhanden ist rate ich demonstrativ davon ab weiter diesem Thema zu folgen und zunächst diese Wissenslücke zu füllen um sich zu einem späteren Zeitpunkt erneut dieser Sache widmen zu können.

Sobald der Link aufgerufen wird gelangst du auf die "Startseite" (DIRECTORY). Bitte auf dieser bleiben da mehr Informationen zu dieser Seite den Rahmen sprengen.
Wie du nun sehen kannst ist auf der rechten Seite ein "Menü" das dir dabei hilft auf der Seite eine passende Schriftart zu finden ohne stundenlang dich auf der Seite aufzuhalten. Die Haken in der Kategorie können beliebig mit einem Klick entfernt oder wieder gesetzt werden. Die Seite sortiert in: Trendy (Trendy) Popular (Berühmt/ oft genutzt) Date Added (Datum) Alphabetical (alphabetisch) ein jeweiliger Klick auf das kleine Dreieck auf der Seite gewährt die Möglichkeit der Einstellung. Das selbe Prinzip lässt sich bei Languages verfolgen, doch sucht man an dieser Stelle vergebens die deutsche Spracheinstellung. Bei Problemen der Übersetzung empfehle ich daher: Leo.

Wie sicherlich schon aufgefallen ist, ist mein Beispielbild wesentlich schmaler als die Seite selbst. Lenkt aber wunderbar das Auge auf das Wesentliche. Wer die Seite nun seinen Wünschen noch optimaler anpassen möchte kann den Bereich unter: Languages, nutzen und den Punkt auf dem Stich beliebig verschieben zumindest, wenn zuvor der Haken gesetzt wurde.
Sodann sieht man folgendes Resultat: Number of styles (Anzahl der Schriftarten) Thickness (Dicke/ Stärke der Schriftart) Slant (Winkel/ Schräge) Width (Breite). Ich empfehle hier eine persönliche Einstellung nach Geschmack und werde nicht weiter auf die einzelnen Punkte eingehen, sondern nun zu dem wichtigen Schritt kommen, wie eine Schriftart von der Seite zu entnehmen ist.

Auf dem Beispielbild siehst du eine "Raute" darin befindet sich ein "Plus-Zeichen" wie an jeder anderen Schriftart auch. Klicke bitte auf das Plus und du kannst verfolgen wie sich dieses in ein Minus verwandelt und im unteren Bereich des Browsers sich ein "schwarzer Kasten" offenbart.

Zuvor habe ich den Bereich: Load Time, erwähnt und auf diesen möchte ich kurz und verständlich noch einmal eingehen.
Ein wirklich sehr wichtiger Punkt und ich appellieren an jeden Admin sich dies zu Herzen zu nehmen, da es die Ladezeit des Forums beeinflusst.
Denn dieser Punkt zeigt an wie "brauchbar" eine Schriftart ist bzw. wie lange sie selbst zum Laden braucht. Ich habe mir in diesem Beispiel glücklicherweise ein "Fast" Beispiel gewählt. Für alle die mit Englisch nicht allzu viel anfangen können verweise ich noch einmal auf Leo und gebe einen praktischen Tipp mit: Alles was Grün ist, ist gut, was gelb ist stoppt und was rot ist, ist eigentlich kaum zu gebrauchen, sondern würde das Forum zu stark beeinflussen. Ebenso wird die Ladezeit aber auch durch mehrere Schriften beeinflusst, selbst wenn diese alle "Fast" sein sollten kommt doch eine "Masse" zusammen und bekanntlich wiegt die Masse mehr und in diesem Fall beeinflusst sie stark die zusammengerechnete Ladezeit.

Wer nun noch nicht genug gesehen hat und eigentlich mehr Schriften suchen möchte kann an dem Schwarzen Kasten oben rechts auf das "Minus" gehen und der "Kasten" verschiebt sich wieder an den unteren Bereich und alle Schriften die durch ein "Plus" angeklickt werden, werden in dem Kasten gespeichert.

Ich habe mir in dem Beispiel nun zwei weitere Schriften ausgesucht und hinzugefügt. Leider steht nun dort: "Load Time: Moderate " (oranger Hintergrund) und ich denke mir, dass beeinflusst mein Forum doch eher zum Nachteil. (Roter Kasten im kommenden Beispiel Bild)
Also möchte ich die Schriften lieber wieder entfernen. Entweder schließe ich den Kasten nun wieder und gehe auf die "Minus-Zeichen" Und die Schriften entfernen sich automatisch wieder aus dem Kasten oder ich gehe im Kasten direkt auf, dass Minus das neben den Namen der Schriften zu sehen ist. (Pinker Kasten im Beispiel Bild)

Für alle die Forenbereiche ansprechen wollen oder die Schrift immer wieder nutzen möchten, empfiehlt sich diese Variante:
Für jede Version wird der obere Teil der "Link" der Schrift in das Template gesteckt um diese Schriftart Global für einige Bereiche anzeigen zu lassen und der untere Teil (steht auch oben drüber: Specify in CSS) in die gewünschte Class oder Id im Css.
Jede Version hat dafür das ein und selbe Template: Allgemeines    overall_header
Unter dem Punkt 19 findet ihr diese Variable: