Permalink

17

WP Google Fonts

Zufällig bin ich gerade auf das großartige Plugin WP Google Fonts gestoßen. Wie man sieht (oder vielleicht nur auf den zweiten Blick) habe ich es gleich aktiviert und die Artikel-Einträge und Kommentare werden nun in der Schriftart „Open Sans“ dargestellt.

Das Plugin selbst bietet verschiedene Möglichkeiten, die Google Fonts zu nutzen. Nach Installation und Aktivierung findet man einen neuen Eintrag unter „Einstellungen“ im Admin-Bereich. Es werden alle möglichen Schriftarten in einer Drop-Down-Box zur Verfügung gestellt – leider gibt es keine Vorschau und man muss ein wenig rumprobieren, wenn einem der Name der Schriftart nichts sagt. Die offizielle Webseite von Google zu den Web Fonts zeigt übrigens eine Vorschau aller Schriftarten an – man kann hier also eine Auswahl für das Plugin treffen.

Wenn man nur eine Google Schriftart verwenden möchte, nutzt man lediglich die „Font 1 Options“ Einstellungen. Einfach die gewünschte Schriftart auswählen und die HTML-Formatierungen aktivieren, auf die man die Schriftart legen möchte. Abspeichern und fertig.

Autor: Thomas

Thomas beschäftigt sich schon seit vielen Jahren mit der Blog-Software WordPress. Dabei konnte er ein umfassendes Wissen aufbauen und kennt sich sowohl mit dem Backend als auch mit dem Frontend und den vielen Erweiterungsmöglichkeiten aus.

17 Kommentare

  1. Sehr interessantes Plugin. Spart einen zwar das herumwühlen in der css mit font-face, könnte aber an der Performance krazten da die Schriftarten extern geladen werden.

  2. @Andre
    Großer Perfomanceverlust ist das nicht – im Gegenteil, so werden die Ressourcen von mehreren Servern geladen und nicht nur von einem. Also schön weg vom Flaschenhals..

  3. Pingback: Best of Sammelsurium 1 – Q&A Seiten, Webfonts und ein Facebook-Klon » BlogProfis.de

  4. Pingback: Google-Fonts einbinden | Bigbossdesign

  5. besser wärs es würde auf die fonbts von fontsquirrel.com zurück greifen. bei google ist die auswahl ja wirklich sehr eingeschränkt.

    :)

  6. @Daniel S
    Normalerweise werden Fonts überhaupt nicht von einem Server geladen, sondern die lokal installierten verwendet. Insofern ist es schon zusätzlicher Traffic und ein Performanceverlust.

  7. Zum Thema NoScript: Wie sehen die Benutzer von NoScript Google-Fonts-Seiten? Wird dort eine alternative Schriftart gezeigt oder kommt es zu (ernsten) Darstellungsproblemen? Ich arbeite derzeit an einem Redesign meiner Seite und habe auch schon an Google Fonts gedacht, bin mir dabei aber noch ein bisschen unsicher.

    Werden die Fonts eigentlich aus dem Browsercache geladen, wenn man die Seite einmal aufgerufen hat? Der zusätzliche Traffic könnte sonst für Nutzer von UMTS/GPRS und Co. problematisch werden…

  8. @Lothar
    Im Grunde wird durch WP Google Fonts versucht, die Font-Einstellungen im HTML bzw. in der CSS-Datei zu überschreiben. Wenn der Script-Teil also nicht läuft (weil JS deaktiviert ist), wird einfach das verwendet, was in der CSS-Datei steht. Du solltest beim Aufbau des Redesigns also beides optisch testen (mit und ohne Google Web Fonts).

    Wenn du Ladezeit für UMTS/ GPRS Zugriffe senken willst, solltest du eher eine Browserweiche einbauen, die bei mobilem Zugriff auf eine CSS-Datei zurückgreift und die Google Fonts bzw. das externe Laden dieser Schriftarten umgeht.

  9. Eine gute Idee recht einfach die Google Schriften bereit zu stellen.
    Die Frage ist nur: Hat schon mal jemand ausgewertet, wie hoch er Anteil der Seitenbesucher mit NoScript ist?
    Wahrscheinlich sind in diesem Blog ja eher Internetaffine User, die diesen Blocker nutzen, aber der normale User wird das doch kaum installiert haben. Für viele doch wahrscheinlich viel zu kompliziert…!?

  10. Ich habe am WE das Plugin „WP GoogleFonts“ im WP (3.1.2)-Theme „Magazine Basic“ aktiviert (zusätzlich ist z. Zt. nur Plugin „Contactform 7“ aktiviert).

    Folgende Fonts wurden für folgende Elemente aufgerufen:
    „Cuprum“: für Seiten-Titel h1-h4,
    „Droid Sans“: für p, dt, dd,
    „Drois Sans Mono“: für pre.

    Die drei Fonts funktionieren, aber der Seitenaufruf dauert bis zu 15/20 Sekunden pro Seite. Wer von den HP-Besuchern den Grund nicht kennt, könnte irritiert sein und meinen, der Browser sei „bockig“ oder am System sei etwas nicht in Ordnung.
    Mein Fazit:
    wahrscheinlich habe ich zu viele Elemente mit Google Fonts belegt (acht! :-((( ) und/oder zu viele versch. Fonts eingesetzt (drei). Das brauchte zu viel Traffic.
    Es soll mir eine Lehre sein und das Plugin wird ab sofort nur im Testbereich oder äußert sparsam für Kundenprojekte eingesetzt, bis es bessere Lösungen gibt: Die Fonts sollten n i c h t vom Server geladen werden.
    Kennt jemand eine bessere Lösung?

    Unabhängig vom Plugin zu Font „Cuprum“:
    Dieser Font ist leider schwer zu editieren: der Cursor kann vielfach nicht exakt im Wort gesetzt werden. Ich mußte etliche Korrekturen im Quellcode machen, im WordPress-Editor war die Textkorrektur erfolglos.

    <bHat jemand von euch ähnliche Erfahrungen? (Ich liebe diesen Font ;-) .
    chriss

    • Hi chriss,

      du könntest auch versuchen, das selbst nachzubauen (ohne das Plugin zu verwenden) und dann die Schriftarten so laden, wie du sie brauchst. Man kann bspw. auch nur bestimmte Zeichen aus einer Schriftart von Google laden, wodurch die Dateigrößen drastisch reduziert werden können.

      http://fonts.googleapis.com/css?family=Droid+Sans&text=ABCDF

      Alternativ kannst du auch Cufon verwenden. Das mache ich bei einem anderen Projekt (ohne WordPress). Allerdings wirst du da ähnliche Probleme mit der Ladezeit haben (je nach Umfang, was du alles lädst und an Schriftarten verwendest).

  11. Endlich ein Plugin, daß es mal einfach macht. Und deine Erklärung dazu ist top !!!! Hab ewig gesucht einen einfachen Weg zu finden. Und jetzt endlich einen gefunden und schon am ausprobieren :-) Danke !

Schreibe einen Kommentar

Pflichtfelder sind mit * markiert.