Icon Fonts – performante Bilder fürs Web

Icon Fonts sind Schriftarten die nur kleine Bilder sogenannte Icons statt Buchstaben, Ziffern etc. darstellen, ähnlich wie die bekannte Schriftart Webdings die man aus Word kennt.

Vorteile dieser Methode:

  • voll skalierbar
  • in der Farbe über Schriftfarbe anpassen
  • kleiner als eine Reguläre Bilddateien in entsprechenden Größen

es gibt bereits fertige Font Icon Sets im Web hier zwei der bekanntesten Beispiele:

Wie sie die entsprechenden Schriftarten per CSS einbinden erfahren Sie auf den jeweiligen Seiten. Sie können aber anhand von SVG Dateien auch eigene Icon Fonts erstellen, hierzu gibt es im Web entsprechende Generatoren:

https://www.google.de/#q=icon+font+generator

Beachten Sie das Sie auf den meisten Seiten ihre Icons automatisch für andere freigeben, um den Service nutzen zu können. Sie können also auch auf diesen Seiten weitere Icon Fonts herunterladen.

Nutzen Sie allerdings nicht zu viele verschiedene Webfonts auf einmal, da sonst wieder ihre Ladezeiten steigen. Der Vorteil dieser Methode liegt nämlich darin, dass Sie statt vieler kleiner Dateien nur eine laden was eleganter und schneller ist, hinzu kommen die oben genannten Vorteile.  weiterlesen