FSI FontShop International startet eine neue Kollektion digitaler Schriften, die ausschließlich für den Einsatz im Internet angefertigt sind. Webdesigner sind nicht mehr allein auf die wenigen Systemschriften angewiesen, die bei allen Website-Besuchern installiert sind. Die neuen Web-FontFonts werden so mit den Elementen einer Website verknüpft, dass erstmals HTML-Texte für alle Besucher die gleiche, individuelle Typografie aufweisen können.
Dieser lang erwartete Schritt erlaubt nicht nur das freie typografische Gestalten von Internetseiten. Corporate Design von Unternehmen und Marken kann nun noch konsistenter auf die digitalen Medien angewandt werden. Zu diesem Zweck stehen seit heute über 30 der erfolgreichsten FontFont-Schriften zur Verfügung, darunter FF DIN, FF Meta, FF Dax und FF Kievit – insgesamt 1250 Fonts; weitere werden bald folgen.
Der Preis für einen Schriftschnitt startet bei 40 Euro, was deutlich günstiger ist, als ein vergleichbarer Zeichensatz für Print-Anwendungen. Alle Infos zu den Webfonts gibt es im Fontblog, wo schon gut diskutiert wird und im FontShop, wo der Verkauf der sogenannten Woff- (Web Open Font Format) und Eot-Dateien(Embedded OpenType) am kommenden Montag beginnt.
Was bedeutet die Einführung der Webfonts? Nun, erst einmal werden sie nicht die Systemschriften verdrängen. Schriften wie die Verdana, Arial oder die Georgia sind speziell für die Darstellung am Monitor entwickelt worden und sind so verbreitet, dass gegen sie kein Kraut gewachsen ist. Wenn es darum geht längere Texte darzustellen, werden sie nach wie vor ihre Stärken und auch ihre Schwächen ausspielen dürfen. Martin Liebig hatte ihre Lesbarkeit untersucht und hier im dt darüber ausführlich geschrieben.
Webfonts sehe ich eher als Alternative, um Headline-Schriften einzubinden. Image-Replacement und die sIFR-Technik (praegnanz.de)sind da bislang die gängigen Methoden, um Hausschriften in Webpräsenzen zu integrieren. Ersteres kommt z.b. auch hier im dt zum Einsatz (Logo) und funktioniert einwandfrei. Das ist aber immer einer Frage des Aufwands. Für komplexe Sites greift man bislang zu sIFR, einem Verfahren, mit dem sich per Flash und JavaScript Schriften einbinden lassen, die bei nahezu jedem Nutzer angezeigt werden. Das funktioniert allerdings nicht immer reibungslos.
In diesem Sektor also könnten Webfonts aus meiner Sicht ihre Stärke ausspielen. Ich selbst habe noch kein Projekt mit Webfonts realisiert, deswegen kann ich nichts aus der Praxis berichten. In jedem Fall spannend, dass sich hier eine Alternative auftut.
»Nach wie vor«.
Schreibt man zusammen – nachwievor. Ist ein eigener Begriff.
Warum ich das anmerke? Was nutzt die beste Onlinetypographie, deren Fortschritt ich zu 100 % begrüße, wenn man sie nicht mehr richtig lesen kann?
Prinzipiell eine spannende Entwicklung. Ich habe mit Typekit gearbeitet und es sieht so aus, dass die Schriften nur unter MacOS gut aussehen… unter Windows aufgrund mangelhafter Schriftglättung leider grausig.
Ich möchte nur ergänzen, dass neben den beiden bereits genannten bestehenden Alternativen, Image-Replacement und sFIR, noch weitere Ansätze wie cufon und -neu-Typekit existieren. Letzteres bietet für den halben Preis (von ca. 25 USD) viele tolle Schriften bekannter Foundaries an und lässt sich (im Vergleich zu sFIR und cufon) noch müheloser in Webseiten integrieren. Zudem funktioniert es in nahezu allen gängigen Browsern unter verschiedenen OS.
Edit: Da war FrankBee schneller… Wobei ich beim Einsatz von Typekit unter Windows die von ihm beschriebenen Effekte nicht beobachten kann…
Das hängt von der Windows-Version ab. Ab Vista wird standardmäßig geglättet, bei XP wohl noch nicht. Kenne ich aber auch nur aus der eigenen Beobachtung, kann also sein, dass ich mich täusche.
@ Gast:
»nachwievor« ist falsch
Auf meinem PC (Windows7) ist die Schriftglättung erstaunlich gut. Nur bei Safari (schreckliche Schriftglättung) und unter Opera (keine Unterstützung) ist @font-face nicht zu gebrauchen. Was aber im Angesicht der geringen Verbreitung kein Problem ist. Unter Mac scheint es mit Safari besser auszusehen.
Was mich besonders interessiert ist die Frage nach Suchmaschinenoptimierung.
Mit welcher Methode (Typekit, sIFR, Image Replacement, etc.) hat man bessere Möglichkeiten zur Suchmaschinenoptimierung?
Bei Image Replacement steht der alt-Tag zur Verfügung, wie beispielsweise beim DesignTagebuch-Logo.
Grüße
wünschedesign
Fehlende “Freiheit” bei der Auswahl von Schriften im Web – Ein Umstand, der mich seit Beginn meiner Aktivität im Netz störte. Gut, wenn man kleine Websites (ohne CMS) für seinen Kunden erstellt, hat man doch schon mal schnell Headlines “gesliced”… Spätestens, wenn der Kunde vor dem Launch aber alle Headlines geändert haben wollte, war es vorbei… Erinnert ihr euch auch daran?
So wollte ich das nicht haben, gerade weil es bei manchen Webschriften nicht annähernd möglich ist, den Kunden im Web 1:1 wie im Print erscheinen zu lassen. Vieles lässt sich über Bildsprache, Farbigkeit oder Stilelemente natürlich wiedergeben. Aber ein wichtiger Faktor, die Schrift, die für viele auch ein wichtiges Erkennungsmerkmal darstellt, konnte bisweilen nicht berücksichtigt werden.
Eigentlich ist das doch etwas seltsam, dass erst jetzt die Möglichkeit besteht, ohne “Umwege” unzählige Schriften ins Web zu bringen, sodass sie bei jedem angezeigt werden können?
Ich als Gestalter nehme logischerweise immer Rücksicht auf meine Programmierer, dass es für die leicht ist, mit meinen Layouts umzugehen. Aber eine Sache, die ich irgendwie immer möchte, ist die Image-Replacement-Technologie… Es gibt mir die Möglichkeit, der Internetseite ein Stück mehr Wiedererkennungswert zu verleihen. Oft frage ich mich natürlich schon, ob dem Benutzer das auffällt oder ob es ihm “egal” wäre.
Aber Tatsache ist doch folgendes: Würden wir Gestalter uns nicht diesen Elementen und Technologien bedienen, wäre doch überhaupt nicht daran gedacht worden, Schriften fürs Web zu entwickeln? Ich musste mir oft von den Programmierern anhören: “Das ist Mehraufwand, der sich doch nicht lohnt. Ihr Grafiker braucht das natürlich…” usw. Naja, jetzt habens bald die Programmierer auch leichter :-)
Ich bin wirklich sehr froh, dass es nun bald die “Auswahl” gibt. Allerdings geht dabei eine entscheidende Sache verloren: Ich habe jedes Mal versucht, mit der begrenzten Auswahl an Web-Fonts so zu arbeiten, dass jedes Projekt anders ausseht. Sei es durch Farbigkeit, Text-Layout, Größenverhältnissen usw. Jetzt könnte man doch dazu neigen, einfach immer eine andere Schrift zu verwenden… Die Herausforderung fehl vielleicht etwas :-)
Gruß – Dennis
@ wünschedesign:
Ein kurzer Blick auf die von Achim referenzierten Websites genügt und man bekommt die Antwort (in dem Fall für siFR):
Aber was ist mit der Validität?
Keine Angst, alles wird gut! Das MarkUp ist komplett valide und besteht jeden W3C-Test. Wenn entweder Flash oder JavaScript nicht auffindbar ist, bleibt alles beim alten: HTML-Text, der mittels CSS gestylt wird. Es ist also eine optische Verbesserung für alle, die es nutzen können, aber kein inhaltlicher Nachteil für Flash- oder Javascript-Verweigerer.
Zu lesen unter: https://praegnanz.de/essays/295/sifr-revolution-der-webtypografie
Sehr interessante Seite übrigens und auch schon länger in meinen Bookmarks.
Ein kleiner Hinweis wegen der Schriftglättung unter Windows: Das hat nicht direkt mit dem verwendeten Browser zu tun. Auch Firefox unter Windows XP kann Schriften geglättet anzeigen, wenn man es entsprechend einstellt. Dazu genügt ein Rechts-Klick auf den Desktop: Anzeige – Darstellung – Effekte – Folgende Methode zum Kantenglätten von Bildschirmschriftarten verwenden: Clear Type
Gerade kleinen Schriften tut diese Einstellung allgemein sehr gut.
In neueren Windows Version bzw beim IE ab Version 7 ist das Clear Type einfach voreingestellt. Wirklich ein Jammer, so scheint es, als habe der IE den alternativen Browsern etwas voraus. Und so nutzt das Otto Normalsurfer leider nicht viel.
Bzgl. der Schriftenglättung und Typekit: Diese wird vom JavaScript, welches die Schrift einbettet, geregelt und hat nichts mit der Einstellung der allgemeinen (in Windows) Schriftenglättung, wie von Christina beschrieben, zu tun. Das ganze ist auf der Typekit Website für verschiedene OS und Browser dargestellt.
Bei dem Typekit-“Verfahren” bleibt die Seite weiterhin valide und suchmaschienenfreundlich (=keine Änderung bzgl. SEO).
@Audrey.
Das ist vielleicht seit der Neuen Rechtschreibung so. Und darauf geht Deine Quelle nicht explizit ein.
Ich sehe das unter dem Aspekt der Verständlichkeit. »Nachwievor« ist ein eigenständiges Wort, wie »Kennenlernen« oder »Zusammenhängend«. Es beschreibt Handlungen, Zustände, etc. sehr eindeutig. Getrenntgeschrieben ist die Bedeutung nicht so stark, insbesonders dann, wenn bspw. das »vor« in die nächste Zeile fällt und der »nach wie« gelesen wird. Das verwirrt.
Die Neue Rechtschreibung hat ca. 1000 dieser Worte aufgetrennt. Und Deine Quelle ist sich wohl etwas zu sicher, wenn er behauptet, daß dies nie zusammengeschrieben wurde. Ich kann auch nicht eruieren, ob er für seine Aussage den alten oder neuen Duden konsultiert hat.
Was diese Techniken betrifft: Ich als Webdesigner finde dies, oberflächlich betrachtet, eine interessante Neuerung, jedoch vermute ich auf der technischen Seite einen riesigen Aufwand sowie Unstimmigkeiten in den Browsertechniken, inbesondere bei Windows IE, auf uns zukommen. Fast jeder benutzt IE, jedoch ist dieser der technisch unterlegenste von allen. Und daran wird sich nie was ändern.
Mir reichen die Standardschriften. Ich kann alles damit machen. Und für Kunden ist nur wichtig, daß die Lesbarkeit und das Verständnis stimmt.
Auch in Deutschland benutzt die Mehrheit der Nutzer mittlerweile den Firefox. Nicht repräsentativ aber interessant: Lediglich einer von zehn dt-Lesern nutzt noch den IE (FF 50,2%, Safari 32,5%, IE 10,2%).
Spielt (noch) keine große Rolle, ob die Marge größer ist. Diese Gruppe macht immernoch die größten Probleme, da sie ja den IE nutzen. Insofern wird die Technik bis auf weiteres auf IE als schwächstes Glied in der Kette abgemünzt. Wenn der Prozentsatz auf 10 % fällt, wird’s endlich interessant.
Das Problem an dem Paket ist, aus technischer Sicht, sicherlich nicht der IE – selbst in der Version 6 lassen sich dort Schriften über das EOT-Format einbinden. Viel problematischer ist da eher das WOFF-Format, da bisher Firefox 3.6+ der einzigste Browser ist der dieses Format unterstützt.
Kantenglättung ist nochmal eine andere Geschichte …
@ Gast:
Du sagst: “Und für Kunden ist nur wichtig, daß die Lesbarkeit und das Verständnis stimmt.”
Damit habe ich andere Erfahrungen gemacht – und ich teile die Meinung auch nicht. Meiner Meinung nach gilt folgendes: “Der Kunde weiß erst dann was er will, wenn er sieht was er will.” Zeige ihm Bewährtes und er ist zufrieden. Zeige ihm Neues und er ist begeistert (oder auch nicht, aber das macht den Reiz aus).
Alles machen kann man eben nicht… Ich stelle mir immer wieder vor, wie genial es doch wäre, dasselbe zu tun, wie meine Kollegen aus dem Print-Bereich: Typografisch mehr oder minder “unabhängig” zu sein. Gerade, wenn der Punkt der individuellen Typografie ins Web eintritt, werden sich Websites vielleicht wieder maßgeblich von einander unterscheiden. Ich finde, dass das Schriftbild (eben unter anderem durch die Schriftarten) ein maßgeblicher Faktor für das individuelle Aussehen einer Seite ist.
Richtig DK. Wenn es möglich ist, die Fontbeschränkungen wirksam und wirkungsvoll zu erweitern, sodaß ein Kunde dies auch wahrnimmt und dies dann will, soll es mir auch recht sein. Doch ich kenne den Aufwand dafür nicht. Ich bin konstruktiv skeptisch, denn es muß in meinen Workflow passen und darf mir keine Zeit stehlen.
Wenn ein System entwickelt werden muß, daß die Fontdaten vom jeweiligen Server zieht, und dieses aufwendig zu produzieren ist, frage ich mich, ob es diesen Aufwand wert ist. Jeder Coder weiß, wieviel Stunden in so eine Programmierung fließen wird. Und dann muß alles wieder für die jetzigen und zukünftigen Browser abgestimmt werden. Wieder eine Baustelle mehr. Dazukommt, daß Windows in der Schriftdarstellung sehr stark der Appleplattform unterlegen ist, und sich somit der Aufwand für diese Plattform nicht lohnen würde.
Solange das nicht einwandfrei und unproblematisch läuft, beschränke ich mich lieber auf die Stilmittel, die ich effektiv browser- und plattformübergreifend mit wenig Aufwand einsetzen kann.
Ich kompensiere die Schriftdefizite mit einer gelungenen Gestaltung. Ob ich da nun immerwieder die Arial einsetze, fällt dann nicht mehr ins Gewicht.
Man muß nicht immer mit den Wölfen heulen, um gute Ergebnisse zu erarbeiten.
@ Christina und Miguel:
Es gibt aber schon einen qualitativen Unterschied zwischen Schriftglättung bei Windows und MacOS. Dazu ein interessanter link:
https://www.agenturblog.de/2010-01/typekit/
Der Grund, weshalb bei FSI nur WOFF und EOT angeboten werden, liegt wohl in der Tatsache begründet, dass man in WOFF im Gegensatz zu OTF und TTF Metadaten über den Autor und Fontschmiede hinterlegen kann. Microsofts EOT-Format ist sowieso schon immer auf Kopierschutz ausgelegt gewesen. FSI legt da offenbar wert drauf.
Typekit und Font Squirrel machen das anders und bieten alle Formate gleichermaßen an.
Wer aber Lust hat zu frickeln: einfach die .woff-Datei in .zip umbenennen, und dann extrahieren. In dem Archiv sollte eine TTF- oder eine OTF-Schrift zum Vorschein kommen, mit der man wiederum Safari, Chrome und Opera bedienen kann.
Wie man das Einbetten schnell und “bullet proof” vollzieht, hat der gute Paul Irish entwickelt und hier beschrieben. Wem das zuviel Plakerei ist, der sei auf den @font-face Generator von Font-Squirrel hingewiesen.
Die Frage des Kopierens ist auch der Antwort auf die Frage, weshalb in Gottes Namen wir diese Methode der Schrifteneinbettung erst heute an die Hand bekommen: ursprünglich schon als Spezifikation für CSS 2 anvisiert, wurde der Punkt letztlich wieder gestrichen, weil die Schriftenhersteller nicht bereit waren, ihre Schriften ohne Kopierschutz rauszurücken. Diese Denke hat sich in den vergangenen 10 Jahren offenbar geändert.
Das Problem mit der Schriftenglättung unter Windows existiert übrigens tatsächlich, und hängt mit der Art und Weise ab, wie Windows Schriften auf den Bildschirm rendert. Jeder Browser unter Windows, egal ob IE, Firefox, und (mittlerweile) auch Safari greift auf die systemeigene Schriftenglättung zurück.
Eine nicht-angeschaltete Schriftenglättung, wie es bei XP out-of-the-box der Fall ist, ist natürlich schon einmal extrem verheerend. Aber auch ein aktives Antialiasing schützt nicht immer vor den Nebenwirkungen der Windows-eigenen Grafikschnittstelle “GDI”. Die ist der eigentliche Bösewicht, der uns den Spaß an manchen Fonts unter Windows vermiest. Diese glättet Buchstaben nämlich nicht in alle Dimensionen gleichermaßen linear, und wenn Schriftarten per sogenanntem Font-Hinting nicht auf ein Gerendertwerden unter der GDI abgestimmt werden, dann bröselt’s halt.
Typekit ist sich dieser Zusammenhänge bewusst und arbeitet fortlaufend an einem Ergänzen all seiner Schriften mit einem besser funktionierenden GDI-Font-Hinting.
Wie Schriftenglättung im allgemeinen funktioniert, und wie im Speziellen unter Windows, OS X, Linux und in Adobe-Produkten wie dem Reader, das steht in diesem fantastischen aber auch sehr technischen Grundlagenartikel.
Microsoft hat das Problem aber auch längst erkannt und Windows 7 neben dem alten GDI das bessere DirectWrite spendiert. Und es wird auch per DirectX-11-Update an die Vista-Benutzer nachgereicht. Dieses hat all die Textrendering-Macken von GDI nicht mehr, und lässt sich auch besser hardwarebeschleunigen. Die Unterschiede beider Modi sind hier gegenüber gestellt. Das verbleibende Problem: die Anwendungsentwickler müssen nun nachziehen und auch auf DirectWrite als Ausgabeschnittstelle wechseln.
Wie der eben genannte Link schon andeutet: die Firefox-Jungs arbeiten schwer für FF 3.7 dran (es gibt sogar schon jetzt eine Version zum Ausprobieren), das Webkit-Team hat es sich ebenfalls auf die ToDo-Liste geschrieben, und Microsoft nutzt es sowieso für den kommenden IE9 (tolles Video. Es gibt Gerüchte, dass er zur anstehenden MIX 2010 eventuell schon als Preview/Beta herauskommen wird).
Es wird also irgendwann alles gut. Vor allem, wenn die letzten XP-Benutzer das Handtuch geworfen haben werden.
Wer auf seine Schriftenglättung partout auch unter XP nicht verzichten mag, der sollte sFIR links liegenlassen und sich wirklich lieber cúfon ansehen. cúfon läuft nur mit JavaScript, ohne Flash, und ist auch barrierefreier. Die cúfon-Buchstaben sind aufgrund der Umwandlung in eine Vektorgrafik und das geglättete Rendering derselben durch Browser immer schön glatt (sogar eher mal eine Spur zu unscharf).
In Sachen Suchmaschinen verhält sich cùfon wie sFIR und die echte Schrifteneinbettung absolut transparent. Die Suchmaschine sieht mangels ausreichender Javascript-Fähigkeit nur die Originalform vor dem Schriftenrenderig, die der Programmierer ganz wie gehabt steuern kann.
Mir ist jüngst aufgefallen, dass die Schriftkantenglättung unter Windows7 in Indesign CS4 (Anzeige hohe Quali) im Vergleich zur Darstellung unter OSX grässlich ist. Bei mir ist es sogar so schlimm, dass ich fast schon an einen Bug/Fehler glaube. Im Browser hingegen kann ich keine Qualitätsunterschiede feststellen (auf beiden OS Firefox). Die Darstellung der Schriften ist also demnach nicht betriebssystemabhängig, sondern vom jeweiligen Programm, oder?
Habt ihr auch schon mal darüber nachgedacht, dass eure subjektiven Empfindungen eine Frage des verwendeten TFTs sein können? Da spielen ja viele Faktoren eine Rolle: Lochabstand/Anzahl der Bildpunkte im Panel, Panel-Technik, etc..
Lustig, wie schnell man von aktuellen Ereignissen eingeholt wird. Seit heute erhältlich: Firefox mit Direct2D (inkl. DirectWrite) als Nighly Build von offizieller Seite verfügbar.
@QWERTZwerker
Adobe hat seine eigene Text-Renderengine im Gepäck, siehe hier. Alle anderen Anwendungen bedienen sich in der Regel aber an den Systemfunktionen (selbst Safari, das anfangs sein eigenes Schriftrendering verwendete).
@Sche Puuh, dieser Maxim Shemanarev scheint ja eine ganze Menge auf dem Kasten zu haben. Sehr guter Artikel. Werde ihn vermutlich noch fünf weitere Male lesen müssen, um ihn zu verstehen. :) Bleibt die Frage offen: Wenn unter Indesign Adobes eigene Text-Renderengine zum Zuge kommt – warum sieht’s dann bei mir auf dem PC so furchtbar aus und auf den Macs in der Agentur nicht?
@QWERTZwerker
Das kann ich Dir in diesem speziellen Fall leider auch nicht genau sagen. Hast Du vielleicht nicht dieselben Font-Formate derselben Schriftarten auf dem Mac wie auf dem PC?
Mac-verwöhnte Windows-User können die Schriftglättung “Cleartype” übrigens mit Hilfe dieses Tools durch die Schriftglättung von Apple austauschen (welche ein fleissiger Japaner offenbar mal aus einer alten Safari-Version extrahiert hat).
@Gast:
“Nach wie vor” schreibt man schon immer getrennt und wird es auch in Zukunft getrennt schreiben!
Und das ist gut so!
@ 19 Schepp
… es sei nur kurz darauf hingewiesen: Wer die FSI Schriften «umbaut» ist selbstverständlich aus der gekauften Lizenz raus und arbeitet damit illegal, was beim Einsatz auf Websites (und nicht nur dort) suboptimal ist.
Wie subjektiv das Empfinden doch ist. Ich habe die Clear-Type-Darstellung unter Windows immer als angenehmer empfunden im Vergleich zu der nach meinem Geschmack deutlich zu matschigen Schriftglättung auf MacOS.
@QWERTZwerker (22): Indesign verwendet in beiden Versionen (OSX und Windows) die selbe Raster-Engine, und die Darstellung ist bei mir tatsächlich identisch (ich arbeite abwechselnd under OSX und unter Windows). Die Unterschiede sollten also in diesem Fall wirklich nicht vom Betriebssystem abhängen. Ein paar Ideen:
– Hast du die selbe Schrift verwendet?
– ist die Darstellungsqualität von Indesign gleich eingestellt?
– Ist die Bildschirmauflösung so eingestellt, wie der TFT es vorgibt (nicht interpoliert)?
– Ist das TFT annähernd vergleichbar mit dem vom Mac?
– Unwahrscheinlich: ist die Farbtiefe geringer eingestellt?
@notenfundus (26): Ich würde mir ja eine Mischform wünschen: Lesegrößen: Cleartype (das andere ist zu “matschig”), Display-Größen: “konventionelles” Glätten (das andere ist zu “kantig”). Aber mit DirectWrite wirds ohnehin besser.
es geht doch in die richtige richtung
[…] namens SpiegelSansWeb. Ein an LF Spiegel angelehnter Webfont, der dem Webauftritt auch schon vor fünf, sechs Jahren gut gestanden […]