Spaces. Smartes Cloud Hosting für anspruchsvolle Webprojekte. Loslegen und Spaces testen. Von Mittwald.
Dieter Petereit 4. November 2013

Typecast für Google Fonts: Web-Typografie mit Spaßfaktor

Monotype und Google koope­rie­ren erneut und brin­gen mit einer spe­zi­el­len Version von Monotypes Typecast-App eine kos­ten­lo­se und sehr kom­for­ta­ble Möglichkeit, mit Google Fonts rea­li­täts­nah zu expe­ri­men­tie­ren. Die Einfachheit der Bedienung und das beacht­li­che Featureset könn­ten der Web-Typografie wei­te­ren Auftrieb geben. Designer soll­ten sich die Typecast-App auf jeden Fall näher anse­hen. Und genau das haben wir im fol­gen­den Beitrag getan.

typecast-landing

Web-Typografie: Im Kommen, aber noch unterstützungsbedürftig

Das Experimentieren mit pas­sen­den Web-Fonts hat, zumin­dest in mei­ner täg­li­chen Praxis, nichts mit Spaß zu tun. Besser wur­de es vor eini­ger Zeit, als Monotype das Produkt SkyFonts für die Verwendung mit Google Fonts kos­ten­frei ver­füg­bar mach­te. Auch wenn es sich nicht eine Anwendung han­delt, die tat­säch­lich Webfonts unter­stützt, so erleich­ter­te die Verfügbarkeit der Google Fonts als Desktop-Schrift doch die Beurteilung der Layouts für das Web.

SkyFonts stell­te ich im Dr. Web Magazin in dem Beitrag “SkyFonts: Die bes­te Art, Google Fonts auf dem Desktop zu nut­zen” aus­führ­li­cher vor. Vor SkyFonts behalf ich mir mit dem Komplett-Download aller Google Fonts. Die Vorgehensweise dazu beschrieb ich für das Dr. Web Magazin im Beitrag “So laden Sie alle 500+ Google Web-Fonts auf Ihren loka­len Desktop”.

Seit ein paar Tagen exis­tiert eine nahe­zu idea­le Lösung, denn Monotype und Google ver­ste­hen sich offen­bar der­ma­ßen gut, dass eine wei­te­re, für den Nutzer kos­ten­lo­se Kooperation in den Stiel gesto­ßen wur­de. Ab sofort steht Monotypes Typecast App für die Verwendung mit dem kom­plet­ten Google Fonts Repository ohne Anmeldung oder sons­ti­ge Bürokratismen frei zur Verfügung. Erreichbar ist Typecast über eine spe­zi­el­le Landingpage, sowie direkt aus dem Google Fonts Directory über die jewei­li­gen Pop-Outs der ein­zel­nen Schriften.

typecast-in-google-fonts

Typecast wur­de 2013 mit dem „Game Changer of the Year“-Award des Magazins „.net“ aus­ge­zeich­net und das erscheint schon auf den ers­ten Blick völ­lig berech­tigt. Typecast erlaubt es, Schriften mit ech­ten Inhalten in ech­ten Strukturen inner­halb lebens­na­her Layouts aus­zu­pro­bie­ren.

„Eine Schrift los­ge­löst vom inhalt­li­chen Kontext und ande­ren Textteilen aus­zu­wäh­len, ist eine schwie­ri­ge Aufgabe. Das Typecast Design-Tool macht es ein­fach, Schriften aus dem Google Font-Verzeichnis aus­zu­pro­bie­ren und mit ihnen zu expe­ri­men­tie­ren.“

- Filip Zembowicz, Product Manager Google

Die Vorgehensweise ist dabei sehr ein­fach. Entweder über die Landingpage der Typecast-App oder über das Pop-Out der jewei­li­gen Schrift im Google Font Directory star­tet man Typecast und erhält eine Oberfläche, die der­je­ni­gen eines her­kömm­li­chen Word-Prozessors nicht unähn­lich ist. Auch Adobe-Anwender wer­den sich umge­hend hei­misch füh­len.

typecast-menu-preview

Der rechts neben dem Menü ange­ord­ne­te Arbeitsbereich ist direkt mit den Standardinhalten aus Google Fonts gefüllt, so dass eine unmit­tel­ba­re Beurteilung der Optik mög­lich ist. Über das Menü kann nun das erfor­der­li­che CSS/HTML her­un­ter­ge­la­den wer­den. Für die Weitergabe und Beurteilung durch Kunden und/oder Co-Worker las­sen sich PNGs erzeu­gen.

typecast-vollvorschau
PNG des Ergebnisses

Typecast: Kleiner Exkurs zur Vollversion

In der kos­ten­pflich­ti­gen Vollversion der Typecast-App, die dann nicht nur Zugriff auf die Google Fonts zulässt, ist es mög­lich, meh­re­re Versionen für ein spä­te­res Review zu spei­chern, Previews auch online mit ande­ren zu tei­len, Tests auf meh­re­ren Geräten durch­zu­füh­ren oder schnell einen kom­plet­ten Styleguide zu gene­rie­ren. Ab 29 Dollar net­to muss man für die­sen Funktionsumfang aller­dings monat­lich ein­kal­ku­lie­ren.

Die Version für Google Fonts ist eher für das schnel­le Experimentieren gedacht und als sol­ches eine sehr gute Alternative zu bis­he­ri­gen Verfahrensweisen. Sicherlich setzt Monotype dar­auf, dass die zusätz­li­che Bequemlichkeit der Premium-Funktionen mög­lichst vie­le Verwender der kos­ten­lo­sen Version zu zah­len­den Kunden wer­den lässt.

Bei mir wird das indes nicht funk­tio­nie­ren, denn ich wei­ge­re mich, den Preismodellen der Web-Font-Anbieter Raum zu geben. Nicht nur sind mir die­se Dienste schon im Ansatz zu kost­spie­lig, son­dern was mir am meis­ten miss­fällt ist die Abhängigkeit des Preises von Parametern, die man kaum beein­flus­sen kann, in aller­ers­ter Linie die Korrelation zwi­schen Preis und Traffic. Natürlich mag das ein jeder für sich anders beur­tei­len. Ich blei­be jeden­falls vor­erst bei Lösungen wie Google Fonts.

„Es freut mich, dass Fans von Google Fonts die­se neue, kos­ten­lo­se Version der Typecast-App jetzt nut­zen kön­nen. Der Service von Google ist extrem beliebt und vie­le Designer machen ihre ers­ten Erfahrungen mit Web Fonts die­ser kos­ten­lo­sen Bibliothek. In unse­rem Bestreben, die Online-Nutzung von Web Fonts zu för­dern und neue Zugriffsmöglichkeiten zur Typecast-App zu schaf­fen, ist Google für uns der per­fek­te Partner. Wir hof­fen, durch unse­re kos­ten­lo­se, frei zugäng­li­che Version mehr Schriftliebhaber zu unter­stüt­zen und auf län­ge­re Sicht mehr Fürsprecher guter Typographie zu gewin­nen. Aus unse­rer Sicht wäre das ein ech­ter Gewinn für das Web, Kunden, Leser und Designer aller Bereiche.“

- Paul McKeever, Director von Typecast

Typecast: Visuelle Layoutanpassungen sorgen für realistische Tests

Klickt man irgend­wo in den Text, ver­schwin­det das links­sei­ti­ge Menü und ein Arbeitsbildschirm zeigt sich, der alle Features mit­bringt, die man auf den ers­ten Blick für einen ordent­li­chen Test einer poten­zi­ell in Frage kom­men­den Schriftart benö­tigt.

typecast-editor

Das Menü wird durch ein Floating Windows ersetzt, wel­ches man frei auf dem Bildschirm posi­tio­nie­ren kann und wel­ches jeder­zeit die Eigenschaften des akti­ven Elements zeigt und edi­tier­bar macht. Schriftvarianten, -grö­ße, Zeilenhöhe, Text- und Hintergrundfarbe und Abstandswerte wer­den hier ver­wal­tet. Ebenso lässt sich die Schriftart hier auch gleich kom­plett ändern.

Noch aus­ge­feil­ter sind die Manipulationsmöglichkeiten in den ein­zel­nen Textcontainern selbst. Von der Breite der ein­zel­nen Elemente in px, em oder Prozent über die Textausrichtung bis hin zur Anpassung von CSS-Details ist alles mög­lich. Dabei wer­den Veränderungen direkt in der Preview sicht­bar. Ein optio­nal ein­blend­ba­res Baseline Grid erlaubt wei­te­res Finetuning.

Wer sich nicht auf die visu­el­len Bearbeitungsmöglichkeiten ver­las­sen will, der kann jeder­zeit einen CSS-Editor auf­ru­fen und manu­el­le Anpassungen vor­neh­men. Möchte man sei­ne müh­sam vor­ge­nom­me­nen Parametrisierungen zur spä­te­ren Verwendung oder wei­te­ren Bearbeitung spei­chern, ist man aller­dings gezwun­gen, zum zah­len­den Kunden zu wer­den.

Von daher wer­de ich Typecast sicher­lich nicht bis ins letz­te aus­rei­zen und noch am letz­ten Parameter fei­len. Bei mir kommt Typecast für die schnel­le, rea­li­täts­na­he Vorabprüfung zum Einsatz. Nicht mehr, aber auch nicht weni­ger.

Und für die­sen Einsatzzweck ken­ne ich kei­ne bes­se­re, vor allem güns­ti­ge­re App. Machen Sie sich selbst ein Bild!

Links zum Beitrag:

Dieter Petereit

Dieter Petereit

ist seit 1994 im Netz unterwegs, aber bereits seit über 30 Jahren in der IT daheim. Seit Anfang des neuen Jahrtausends schreibt er für diverse Medien, hauptsächlich zu den Themenfeldern Technik und Design.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.