Schnellnavigation:

Kategorien

« Juli 2017»
S M T W T F S
            1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31          

Kopieren Sie diesen Link in Ihren RSS-Reader

RSS 0.91Nachrichten
RSS 2.0Nachrichten

In eigener Sache

Peter Linzenkirchner, Lisardo EDV Beratung in Augsburg. Freelance und Partner für Design- und Webagenturen in Augsburg und München. Pixelgenaue Templates, valides HTML, barrierearm. TYPO3-Projekte, Extension-Programmierung und mehr ... 

Zur Zeit wird gefiltert nach: webfonts
Filter zurücksetzen

Der Webfont-Dienst fonts.com hat heute die Beta-Phase hinter sich gelassen. Er bietet mehr als 7.500 Schriften für eine Einbettung auf Webseiten an, unter anderem von so renomierten Schriften-Herstellern wie Linotype, Monotype und ITC. 


Wer die Schriften einbinden will, muss bei font.com einen Account eröffnen. Es gibt ein kostenloses Abgebot, das allerdings auf 25.000 PageViews pro Monat und auf max. 2000 Schriften begrenzt ist. Die anderen Accounts kosten 10,00 resp. 100,00 USD pro Monat, wobei der letzte bereits 2,5 Mio PageViews pro Monat und unlimitierte Schriften auf unlimitierten Domains enthält. Ein durchaus interessantes Angebot. 

Weitere Informationen: 

Kategorien: Sonstiges  Kommentare 0
Tags: webfonts

Mir ist aufgefallen, dass die Standardschriften, die unter Windows in den IEs für die Darstellung von monospaced-Schriften verwendet werden, nicht besonders gut aussehen und schlecht lesbar sind. Zudem gibt es eine Standardeinstellung in den IE, die verhindert, dass eine bestimmte Minimalgröße unterschritten wird. Und da ich heute vormittag ein bisschen was über Webfonts gelesen habe, wollte ich es gleich ausprobieren. 

Erster Schritt: eine vernünftige Schrift finden, die ich auch verwenden darf, also Open Source. Da gibts nicht gerade viel Auswahl, aber gerade im Bereich monospaced gibt es doch ein paar. Die »Inconsolata« von Ralph Levien hat mir gut gefallen: frei verwendbar, gut lesbar auch in kleinen Schnitten und sauberes Schriftbild in den wichtigsten Browsern. 

Zweiter Schritt: die Schrift liegt nur als Opentype vor, also konvertieren in die passenden Webformate, und zwar mit FontSquirrel, einem Online-Service zum Konvertieren von Schriften. Der Dienst arbeitet perfekt und bequem: ich erhalte ein zip-Archiv mit vier Schriftdateien: eot für die Internet-Explorer, svg fürs iPhone, ttf für Safari und woff für Firefox. (Es ist wirklich genau so bescheuert, wie es sich anhört ...). Ausserdem eine Demo-Datei mit den passenden CSS-Einträgen.

Und so werden die Fonts eingebunden: 

  1. /* Das hier zuoberst der CSS-Datei */
  2. @font-face {
  3.     /* hier folgt ein "Kunstname", frei wählbar */
  4.     font-family: 'InconsolataMedium';
  5.     /* Hier folgen die Pfadangaben, erst für die IE */
  6.     src: url('inconsolata-webfont.eot');
  7.     /* und hier die Pfade für die anderen Browser */
  8.     src: local('☺'), url('inconsolata-webfont.woff') format('woff'),
  9.         url('inconsolata-webfont.ttf') format('truetype'),
  10.         url('inconsolata-webfont.svg#webfontFxENNjp4') format('svg');
  11.     font-weight: normal;
  12.     font-style: normal;
  13. }

Danach können die entsprechenden Absätze mit dieser Schrift formatiert werden: 

  1. .tx-vjrtecodesnippets {
  2.   font-family:'InconsolataMedium',Monaco,courier,"courier-new",monospace;;
  3. }

Eine schöne Anleitung ist im Artikel »Cross Browser Font Embedding« (Englisch) zu finden. Der Autor erläutert genau die Bedeutung der einzelnen Abschnitte im CSS-Code. Insbesondere die url-Angaben sind wichtig, damit die ganze Sache funktioniert. 

Zu sehen ist die eingebettete Schrift hier recht unspektakulär in den Abschnitten mit dem Soruce-Code, z. B. die Zeilen oben. Damit umgehen können alle modernen Browser und auch die weniger modernen Internet Explorer ... 

Achtung: Schriften so einbetten ist natürlich ein Lizenzproblem. Die meisten Schriften dürfen nicht so ohne weiteres eingebunden werden, da die Besucher die Schrift ja herunterladen und bei sich im System installieren könnten. Es müssen deshalb Open Source Schriften sein, von denen es nicht gerade viele gibt (Google bietet zum Beispiel einige).

Allerdings entstehen gerade einige Web-Services (unter anderem sogar mit Linotype-Schriften), die eine Einbettung von DRM-geschützten Schriften ermöglichen. Dazu muss man sich bei diesen Anbietern anmelden und in seinem Account dort die Schriften zusammenstellen und das CSS generieren lassen. Um die Dateien möglichst klein zu halten, können bei manchen Anbietern sogar die Zeichen zusammengestellt werden, die die Schrift zur Verfügung stellen soll. Die Schriften werden auf diese Art nicht vom eigenen Server geladen sondern von den Servern dieser Dienste. Ein paar Links zu solchen Webfont-Services habe ich hier zusammengestellt. Die meisten bieten einen Demo-Account, mit dem man ein- oder zwei Schriften testen kann, ansonsten berechnen sie ab ca 20,– USD im Jahr für beliebig viele Schriften pro einer Domain. Die Kosten sind überschaubar: TypeKit verlangt z. B. 99 USD / Jahr für beliebig viele Schriften, eine beliebige Anzahl Domains und bis zu 100.000 Aufrufe im Monat. Wie sich die Performance entwickelt, kann man jetzt allerdings noch nicht sagen. 

Besuchen Sie mich auf Google+