Kategorien
Best-of HTML/CSS/PSD-Ressourcen Essentials Icons & Fonts

Best of 2016: 100 kostenlose Iconsets

Von Icons muss ich wohl niemanden mehr grundsätzlich überzeugen. Es ist völlig klar, dass an den kleinen, vereinfachten Funktionsdarstellungen in modernen Benutzeroberflächen kein Weg vorbei geht. Es ist ein Gebot der Bedienerfreundlichkeit, möglichst sprechende Piktogramme einzusetzen, die die Nutzer unterstützen. Und das ist genau der Punkt, an dem es bisweilen schwierig wird. Denn längst nicht jedes Iconset verschreibt sich auch diesem Prinzip. Schnörkelige Ausdrücke des Selbstbildes des Erstellers als Künstler kannst du indes nicht gebrauchen.

Ich bin daher losgezogen und habe mir das Symbolangebot des Jahres 2016 angesehen. Rausgefiltert habe ich die 100 besten kostenlosen Iconsets des vergangenen Jahres. Viel Spaß damit!

Titel: The Iconify Collection of 650+ Icons


Erstellt von/für: VectorIcons
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: Free UI and E–commerce thin line icons


Erstellt von/für: Rajesh Kumar
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Special Free Pack of Interface Icons


Erstellt von/für: Darius Dan
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: 200 Free Icons


Erstellt von/für: Jack Wassiliauskas
Lizenz: nicht für die kommerzielle Nutzung zu verwenden, Urheber muss genannt werden, Abwandlungen nicht erlaubt

Titel: 1000+ Free blobs flat icons with two styles


Erstellt von/für: Baianat ­
Lizenz: nicht für die kommerzielle Nutzung zu verwenden, Urheber muss genannt werden, Abwandlungen nicht erlaubt

Titel: Color Line Icons


Erstellt von/für: iconshock
Lizenz: frei für die persönliche, nicht kommerzielle Nutzung

Titel: Filled Activities Freebie


Erstellt von/für: Darius Dan
Lizenz: beigefügte Lizenz beachten

Titel: 5000 Free File Type / Extension Icons


Erstellt von/für: onedollargraphics
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: 400 Assorted Icons


Erstellt von/für: Smashicons.com
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Krispicons Flat Modern Icons – Free PSD


Erstellt von/für: Nitish Kumar
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Set Of Material design avatars 


Erstellt von/für: Oxygenna
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Filling Icons


Erstellt von/für: Max Kalik
Lizenz: Creative Commons.

Titel: Individual Version


Erstellt von/für: Max Kalik
Lizenz: Creative Commons.

Titel: Users Icons Free PSD


Erstellt von/für: Anas Ali
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Sweets Pack


Erstellt von/für: Paula Jenda
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: UI icon pack


Erstellt von/für: Pau Frischke
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: Trending Icon Bundle


Erstellt von/für: Designer Yash
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Icalicons


Erstellt von/für: Noe Araujo
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: 60+ Travel Color Icons


Erstellt von/für: Icons8
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen.

Titel: Free Technology Icons


Erstellt von/für: James George
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: 8bit Remix – character-Set


Erstellt von/für: Gregory Gasser
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Jordan Icons Dribbbleshot


Erstellt von/für: Fernando Gonzalez
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: UI Icons Free pack – for Sketch in vector shapes


Erstellt von/für: Marco Lopes
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Supermarket Icons


Erstellt von/für: The Eyecons
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Cyber Security Icons – Part 2


Erstellt von/für: The Eyecons
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: 25 Free Icons


Erstellt von/für: The Eyecons
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: SEO Icon Set – Elegant Style


Erstellt von/für: GraphicBoat
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Space Icon Set


Erstellt von/für: Elena de Pomar
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Aurora Icon Pack


Erstellt von/für: Samuele Bandini
Lizenz: frei bei Urhebernennung

Titel: Free Food Icons


Erstellt von/für: Ahmed Hassan
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Landmark Icons


Erstellt von/für: Wassim
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Birthday Cake Icons


Erstellt von/für: designer bundle
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: 100 Free Social Media Icons


Erstellt von/für: uiconstock
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: 50 Company Icons


Erstellt von/für: Yunjung Seo
License: nicht für die kommerzielle Nutzung zu verwenden, Urheber muss genannt werden, Abwandlungen nicht erlaubt

Titel: 70 Free All Purpose Line Icons


Erstellt von/für: Paolo Ertreo
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: 54 Business Icons


Erstellt von/für: graphic google
Lizenz: auch für die kommerzielle Nutzung zu verwenden, aber Urheber muss genannt werden

Titel: Cargo Icon Set


Erstellt von/für: Rena Xiao
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Free Basic UI Icon Set


Erstellt von/für: Angela Angelini
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: Camping – Free Icon Set


Erstellt von/für: Yana Bereziner
Lizenz: Attribution-NonCommercial.

Titel: 25 Bicycle Line Vector Icons


Erstellt von/für: graphicpear
Lizenz: frei für die persönliche, nicht kommerzielle Nutzung

Titel: London Icons – Cityset


Erstellt von/für: Bryn Taylor
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: 48 Free Linear Icons


Erstellt von/für: Honcharov Maxim
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Simple Line Icon Set Vector PSD


Erstellt von/für: TushiT
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Free Flat Line Fashion Icons Pack


Erstellt von/für: Rafi
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: 60 Free Icons


Erstellt von/für: Vincent Le Moign
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Free Icons


Erstellt von/für: Tetiana Donska
License: Free for commercial and frei für die persönliche, nicht kommerzielle Nutzung

Titel: Davi Icons


Erstellt von/für: Vlad Cristea
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: Hexagon Icon Set


Erstellt von/für: Bulent Keles
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Camping Line Icons Set2 


Erstellt von/für: memed nur
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: Strategy Icons Set


Erstellt von/für: Peecheey
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: 30 e-Commerce Flat Icons


Erstellt von/für: Graphiqa Stock
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Online Business And Finance Icons Free PSD


Erstellt von/für: PSD Freebies
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Futuristic Space and Astronomy Flat Line Icon Set


Erstellt von/für: ecomm.design
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: The Web Interface Icon Set (70 Icons, SVG & PNG)


Erstellt von/für: Freepik.com
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: 100 Colored Food & Drink Icons


Erstellt von/für: Icons8.com
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: The Flat & Stroke eCommerce Icon Set


Erstellt von/für: Freepik
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: LineKing Icons


Erstellt von/für: Pixel Bazaar
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: 160 Icons


Erstellt von/für: VectorIcons
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: Cartoon Characters vol.


Erstellt von/für: Netguru
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Flat Line UX And E-Commerce Icon Sets


Erstellt von/für: Ecommerce Website Design
Lizenz: Creative Commons Attribution 3.0 Unported l.

Titel: Summer Icon Set


Erstellt von/für: Printerinks.com
Lizenz: Creative Commons Attribution 3.0 Unported.

Titel: Months And Seasons Set


Erstellt von/für: GraphicMama
Lizenz: Creative Commons Attribution 3.0 Unported.

Titel: Essential Free Icons


Erstellt von/für: Igor Babariko
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: 50 Free Icofactory Line Icons


Erstellt von/für: iconfactory
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: Social Icons – Free PSD


Erstellt von/für: Sohail Shahid
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Free Construction Icons


Erstellt von/für: graphic google
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen, solange ein Link zum Urheber gesetzt wird.

Titel: Camcons


Erstellt von/für: geticonjar
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: 440 BigMug Icons


Erstellt von/für: Catalin Fertu
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: 132 Line Icons


Erstellt von/für: doonnn
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: 60 Free iOS icons – Space


Erstellt von/für: PixelLove
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Free flags of all the countries in the world


Erstellt von/für: Daftcode
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Luminance, A Black Pixel Icon Set


Erstellt von/für:  Black Pixel
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Free Ecommerce Icon Pack + PSD / AI Freebie


Erstellt von/für: Intuz
Lizenz: CC0.

Titel: 20 Halloween Flat Icons 


Erstellt von/für: Ramy Wafaa
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Virtual Reality Icons


Erstellt von/für: Manuela Langella
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: Diwali


Erstellt von/für: Iconscout
Lizenz: eigene Lizenz beachten

Titel: Kitchen Tools & Appliances Icons


Erstellt von/für: Brook Wells
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: Yoga Icons


Erstellt von/für: Juan Sarmiento
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: Houses & Buildings Icons (AI, PDF, SVG, PNG)


Erstellt von/für: Manuela Langella
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: 25 Line Contact Icons Vector Format


Erstellt von/für: graphicpear
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Color Vector Characters


Erstellt von/für: Vincent Le Moign
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: Medical Icons Set


Erstellt von/für: Roll’n’Code
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: 130 Icons


Erstellt von/für: Han Wang
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Marine Icon Set


Erstellt von/für: Florent Lenormand
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Beauty and Spa Icons


Erstellt von/für: graphicpear
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Line icon set random stuff 


Erstellt von/für: MajorYom
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Free icons Set


Erstellt von/für: José Polanco
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Docto Icons


Erstellt von/für: Doctolib
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Few Basic Icons


Erstellt von/für: Laura Reen
Lizenz: Creative Commons (Attribution 3.0 Unported).

Titel: 100 Pixelicons Free Pack


Erstellt von/für: pixelicons
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Charticons


Erstellt von/für: Rudd Fawcett
Lizenz: Creative Commons Attribution 4.0 International License.

Titel: Ecology Green Line Icons


Erstellt von/für: Peecheey
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: Spanish Language Free icons


Erstellt von/für: icons8
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Work Icon Set


Erstellt von/für: Agung Krisna Wijaya
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: BIGU – Icon Set


Erstellt von/für: Damien Legendre
Lizenz: frei für die persönliche und kommerzielle Nutzung, etwa in Kundenprojekten

Titel: 50 Free Icons


Erstellt von/für: Cort McGinty
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: New Year’s Free Mascots 


Erstellt von/für: Yulya
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Christmas Stickers


Erstellt von/für: Kara Sotskaya
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Titel: Circus Icon Set


Erstellt von/für: NamLy
Lizenz: als „Free“ bezeichnet, aber keine genaue Lizenz angegeben

Titel: Free Icon Set


Erstellt von/für: Robert Karnovski
Lizenz: Frei nutzbar für private, aber auch kommerzielle Projekte, etwa in Kundenaufträgen

Kategorien
Essentials Icons & Fonts

Verkauft! 20 kostenlose E-Commerce-Iconsets

Im E-Commerce geht es zumeist zu wie im stationären Einzelhandel. Man beschäftigt sich mit Dingen wie dem Auffüllen leerer Bestände oder der Darstellung der Produkte im besten Licht. Dabei vergisst man gerne den wichtigsten Aspekt des Verkaufens in digitalen Umgebungen, nämlich das Design der Prozesse an sich. Hier geht es nicht nur um die Optik, sondern vor allem um kauf-entscheidende Faktoren, wie der Benutzerführung oder den Mikro-Interaktionen, zu denen auch eine gut gewählte Ikonografie zählt.

Kategorien
Essentials Freebies, Tools und Templates Icons & Fonts

Freebie: 430 kostenlose Icons rund um die Gestensteuerung

Dieses Iconpaket ist anders als die anderen. Hier findest du nicht die tausendste Variante des Wifi-Symbols. Stattdessen befassen sich sämtliche der 430 Piktogramme mit der Gestensteuerung moderner Benutzeroberflächen.

Kategorien
Design Freebies, Tools und Templates Icons & Fonts Webdesign

Fontastisch: So findest du kostenlose und hochwertige Schriften

Die richtige Schrift für eine Gestaltung beziehungsweise ein Projekt zu finden, ist nicht immer einfach – trotz der Vielzahl kostenloser Schriften, die im Internet kursieren. Denn häufig ist die Qualität der Schriften, sowohl ästhetisch als auch bezüglich des Zeichensatzes und der OpenType-Features, eher bescheiden. Aber es gibt eine Reihe hochwertiger, gut ausgebauter, ästhetisch ansprechender und zudem kostenloser Schriften im Internet – und das jenseits von Google Fonts.

Ungewöhnliche Schriften bei Behance

Das Kreativnetzwerk Behance ist nicht nur eine gute Anlaufstelle, um sich inspirieren zu lassen. Viele Schriftdesigner nutzen Behance nicht bloß, um ihre Schriften zu präsentieren. Ganz häufig werden diese auch kostenlos zum Herunterladen angeboten.

Wer dort einfach mal nach Schriften sucht, wird schnell feststellen, dass Behance eine reichhaltige Vielfalt an Schriften hat. Da dort allerdings auch viele Entwürfe präsentiert sind, die es als „echte“ Schrift gar nicht gibt, muss man gegebenenfalls etwas mehr Zeit in die Suche investieren.

Kostenlose Schriften
„Mosk“

Dafür findest du dort aber auch viele unverbrauchte Schriften wie beispielsweise die „Mosk“, eine schicke serifenlose Schrift in neun Schnitten, die unter anderem auch deutsche Umlaute und Eszett enthält. Wer doch lieber etwas mit Serifen sucht, findet vielleicht Gefallen an der „Butler“, die eher an klassizistische Schriften erinnert. Sie gibt es in 14 Schnitten, darunter sieben Schablonenschnitte.

Kostenlose Schriften
„Butler“

Da Behance kein Schriftenportal ist, ist die Suche nicht sehr komfortabel. Anzahl der Schnitte und der Umfang des Zeichensatzes variieren sehr. Hier musst du also etwas Geduld mitbringen. Aber es lohnt sich.

So viel zahlen, wie man will, bei Lost Type

Lost Type gehört zu den eher kleinen Schrift-Foundrys. Daher sind die Schriften, die dort vertrieben werden, meist weniger bekannt. Wer also Wert legt auf unverbrauchte Typografie, wird dort fündig. Neben zahlreichen Schriften, die für Fließtexte geeignet sind wie die „Mission Gothic“, gibt es interessante Schriften für plakative Überschriften wie die Versalschrift „Liberator“.

Mission Gothic
„Mission Gothic“

Das Besondere an Lost Type ist, dass dort jeder einfach so viel bezahlt, wie er möchte – zumindest für den persönlichen Gebrauch. Nur wer eine Schrift kommerziell nutzen will, muss auch zwingend bezahlen. Alle anderen zahlen einen beliebigen Betrag – gegebenenfalls sogar gar nichts.

Liberator
„Liberator“

Nicht einmal eine Registrierung ist nötig. Gibst du schlicht eine Null ins Bezahlfeld ein, wird die Schrift ohne Umwege heruntergeladen.

Kostenlose Schriften bei MyFonts

MyFonts gehört zu den größten Anbietern von Schriften und hat zahlreiche Foundrys im Repertoire. Dazu zählen viele kleine und relativ unbekannte Foundrys, aber auch so große wie FontFont.

Miso
„Miso“

Zwar zahlst du bei MyFonts in der Regel, um Schriften zu erwerben. Es gibt aber eine Vielzahl von Schriftfamilien, die du teilweise kostenlos bekommst. So gibt es vier der sechs Schnitte der runden Grotestschrift „Miso“ für lau.

Auch in der beliebten „Museo“-Familie gibt es vereinzelt Schnitte, die kostenlos sind. So sind zwei der zehn Schnitte der „Museo Sans“ kostenlos erhältlich. Im Übrigen sind nicht nur die Desktopschriften kostenlos, sondern auch die Webfonts.

Museo Sans
„Museo Sans“

Du musst lediglich ein Konto bei MyFonts besitzen und den normalen Kaufprozess durchlaufen: Also Schriften in den Warenkorb legen und „bezahlen“. Hast du ausschließlich kostenlose Schriften im Warenkorb, bezahlst du natürlich nichts. Die Schriften werden dennoch wie alle anderen Einkäufe in deiner Bestellhistorie aufgelistet.

Alles kostenlos bei Font Squirrel

Zu guter Letzt darf natürlich auch Font Squirrel nicht fehlen. Dort findest du eine Vielzahl an Schriften für unterschiedliche Einsatzzwecke – und alle kostenlos. Viele Schriften, die dort angeboten werden, findest du auch bei Google Fonts. Der Unterschied ist der, dass du die Schriften bei Font Squirrel selbst hosten kannst.

Open Sans und Losbter
„Open Sans“ und „Losbter“

Mit dem eigenen Webfont-Generator erstellst du dir zudem die Webfonts aus den dort angebotenen Schriften selbst.

Zum Angebot von Font Squirrel gehören eher bekannte Schriften wie beispielsweise die „Open Sans“ oder die allseits beliebte „Lobster“.

(dpe)

Kategorien
Design Icons & Fonts Webdesign

Online-Webfont-Generatoren: Welche gibt es und was können sie?

Webfonts sind mittlerweile ein fester Bestandteil im Webdesign. Neben zahlreichen kommerziellen Schriften gibt es dank Google Fonts auch viele Schriften, die du kostenlos in deine Webprojekte einbinden kannst. Wer grundsätzlich lieber selber hostet, findet im Internet einige Online-Webfont-Generatoren, die Desktopschriften in Webfonts umwandeln.

Webschriften optimieren

Umfangreicher Webfont-Generator von FontSquirrel

FontSquirrel gehört sicher zu den bekanntesten Anbietern kostenloser Schriften. Eine Vielzahl der bei Google Fonts angebotenen Webfonts findest du dort als Desktopschrift. Mit dem eigenen Webfont-Generator von FontSquirrel erstellst du im Handumdrehen Webfonts in allen gängigen Formaten. Auch das noch recht neue WOFF2-Format ist mit dabei.

fontsquirrel_webfont-generator
Webfont-Generator mit vielen Einstellungsmöglichkeiten

Dazu lädst du einfach TrueType- oder OpenType-Schriften hoch – auch direkt mehrere, zum Beispiel eine komplette Schriftfamilie. Beim Generieren der Webfonts entscheidest du zwischen „Basic“, „Optimal“ und „Expert“.

Während bei „Basic“ alles bleibt, wie es ist – zum Beispiel das Hinting und Kerning –, werden bei „Optimal“ von FontSquirrel einige Anpassungen vorgenommen, die für eine möglichst optimale schnelle Darstellung sorgen. Mit der „Expert“-Einstellung entscheidest du ganz individuell, wie der Webfont generiert werden soll.

So gibt es ein spezielles für das Web optimierte FontSquirrel-Hinting, welches anstelle des existierenden Hintings oder einen automatischen Hintings verwendet werden kann. Auch das Rendering der Schriften beeinflusst du, indem du beispielsweise Kerninginformationen entfernst oder die GASP-Tabelle bearbeiten lässt. Über die GASP-Tabelle wird entschieden, wie Schriften auf monochromen Bildschirmen dargestellt wird.

fontsquirrel_webfont-generator_subsetting
Individuelles Subsetting

Wer sich mit Hinting und Kerning nicht auskennt, sollte die Standardeinstellungen von FontSquirrel verwenden. Interessant für alle ist jedoch die Möglichkeit, das Subsetting der Schrift anzupassen. Darüber entscheidest du, welche Zeichensätze in den Webfont aufgenommen werden sollen. So bindest du beliebige sprachspezifische Zeichen ein. Ist deine Website beispielsweise zweisprachig – deutsch und französisch – bindest du zusätzlich die im Deutschen und Französischen verwendeten Sonderzeichen wie Umlaute, Eszett und Vokale mit Zirkumflex, Grave und Akut ein.

Verwendest du lediglich Groß- oder Kleinbuchstaben, kannst du über das Subsetting auch ausschließlich die gebrauchten Buchstabenarten einbetten. Wer es ganz individuell braucht, berücksichtigt einzelne Zeichen oder Unicode-Bereiche. Auf diese Weise baust du dir einen Webfont zusammen, der nur die tatsächlich gebrauchten Zeichen beinhaltet und somit sehr platzsparend ist.

Wenn du soweit alles eingestellt hast, wird ein Webfont-Kit erstellt und heruntergeladen. Bei Bedarf werden deine Einstellungen in einer Textdatei gespeichert, so dass du weitere Schriften mit genau diesen Einstellungen erstellst.

Fontie mit einfacher Oberfläche und Unicode-Subsetting

Der Webfont-Generator Fontie funktioniert ganz ähnlich wie der von FontSquirrel. Du lädst eine Desktop-Schrift hoch und wählst Subsetting, Hinting und Ausgabeformate aus. Beim Subsetting wählst du zwischen einfachen und erweiterten Optionen. Bei den einfachen Optionen fügst du lateinische, griechische, kyrillische und arabische Buchstaben sowie OpenType-Features hinzu, während du bei den erweiterten Optionen die jeweiligen Unicode-Unterbereiche auswählst.

fontie_webfont-generator
Übersichtlicher Webfont-Generator

Beim Hinting stehen dir verschiedene Methoden zur Auswahl. Neben Windows GDI, DirectWrite und Grayscale hast du die Möglichkeit, das bestehende Hinting der Schrift beizubehalten oder das Hinting gänzlich zu entfernen.

Beim Ausgabeformat stehen dir die gängigen Formate zur Auswahl mit Ausnahme des noch recht neuen WOFF2.

Schnelles Generieren mit Transfonter

Ebenfalls einfach zu bedienen ist Transfonter. Du lädst eine oder mehrere Schriften hoch und wählst auf Wunsch Autohinting sowie ein Subsetting aus. Beim Subsetting steht dir allerdings nur jeweils ein Alphabet zur Verfügung – unter anderem Lateinisch, Griechisch und Kyrillisch. Eine Kombination mehrerer Alphabete ist nicht möglich. Dafür ergänzt du aber einzelne Zeichen zu deinem Webfont.

transfonter_webfont-generator
Einfach zu bedienender Webfont-Generator

Interessant ist die Vorschau auf deinen Webfont, den Transfonter dir erstellt. So prüfst du noch vor dem Download, wie die generierte Schrift im Browser aussieht. Unterstützt werden im Übrigen alle gängigen Formate einschließlich WOFF2.

Auch bei diesem Generator kannst du die Einstellungen speichern. Anders als bei FontSquirrel werden die Einstellungen jedoch im Browser gespeichert.

Fazit

Jeder der drei Generatoren hat seine Vor- und Nachteile. Wer sich auskennt und möglichst individuell anpassen möchte, ist bei FontSquirrel gut aufgehoben. Für alle anderen sind Fontie und Transfonter gute Alternativen.

In jedem Fall gilt, dass natürlich nur jene Schriften in Webfonts konvertiert werden dürfen, bei denen die jeweilige Lizenz das erlaubt. Kommerzielle Anbieter wie MyFonts und FontFont verfügen in der Regel über eigene Generatoren, die auch nur für dort erworbene Schriften zur Verfügung stehen.

(dpe)

Kategorien
Design Icons & Fonts

Aktuelle Trends in der Typografie

Was ist typografisch gerade gefragt? Extensis – Anbieter von Anwendungslösungen zur Schriftverwaltung – hat sich in einer Umfrage einmal in der Kreativszene umgehört und ist zu interessanten Ergebnissen gekommen. Die kompletten Ergebnisse der Umfrage, bei der knapp 2.000 Kreative aus verschiedenen Branchen befragt wurden, gibt es kostenlos als PDF-Datei zum Herunterladen.

extensis_trend-typografie

Schriften nach wie vor für den Druck eingesetzt

Die Teilnehmer der Umfrage hat Jim Kidwell, der sie für Extensis erstellt hat, über die Kundendatenbank des Unternehmens eingeladen. Schließlich sind sie es, die täglich mit Schrift und Typografie umgehen. Da überrascht es auch wenig, dass etwa 40 Prozent der Teilnehmer aus dem Grafikdesign kommen, gefolgt von Druck, Werbung und Publishing.

Interessant ist, dass über 90 Prozent der Befragten Schriften für den Druck nutzen, etwa 80 Prozent für die Gestaltung von Logos und Zweidrittel zur Einbettung in PDF-Dateien. Die Nutzung von Schriften auf Websites liegt bei nur etwa 55 Prozent – und das, obwohl Webfonts seit einigen Jahren von allen Browsern unterstützt werden und das Angebot an kostenlosen und -pflichtigen Webschriften ja durchaus groß ist.

extensis_trend-typografie_branche

Ob der Grund im weit verbreiteten Abomodell liegt, welches vor allem bei kommerziellen Schriften üblich ist, bleibt offen.

Serifenbetonte Schriften sehr beliebt, Serifenlose in Zukunft gern gesehen

Aber welche Schriften sind den Grafikdesignern und Werbern denn gerade angesagt? Hier sind es vor allem serifenbetonte Schriften, die bei über 90 Prozent der Befragten derzeit sehr beliebt sind. Das entspricht ja durchaus dem Trend, den man im Grafik- und Webdesign feststellen kann. Dort, wo Design besonders trendig sein soll, werden häufig serifenbetonte Schriften eingesetzt.

extensis_trend-typografie_trends

Besonder schlecht kommen Jugendstilschriften weg sowie Schriften, die mit doppelten beziehungsweise zusätzlichen Strichen versehen wurden. Hier ist es wohl vor allem die fehlende Lesbarkeit solcher Schriften, die zu einer eher negativen Bewertung führte.

extensis_trend-typografie_kreide

Da jeder Trend einmal ausläuft, hat Kidwell auch gefragt, welche Schriften denn derzeit überstrapaziert werden. Ganz vorne dabei sind Schriften im „Chalkboard“-Stil – also Schriften, die Kreide an einer Tafel simulieren.

Und wenn es darum geht, welche Schriften die Kreativszene in Zukunft gerne öfter sehen möchte, dann sind serifenlose Schriften ganz vorne dabei – also das Kontrastprogramm zu den derzeit noch sehr beliebten serifenbetonten Schriften.

Typografie: eine sehr emotionale Angelegenheit

Bei der Umfrage hatten die Teilnehmer nicht nur die Möglichkeit, per Multiple Choice zu antworten. Sie konnten auch ihre ganz eigenen Gedanken zu den vorgestellten Schriftstilen kundtun. Eine Auswahl dieser Gedanken beziehungsweise Kommentare hat Kidwell ebenfalls veröffentlicht.

Zu jeder der 14 Schriften, die stellvertretend für einen Stil in der Umfrage herhalten mussten, hat Kidwell zehn Meinungen der Teilnehmer veröffentlicht. Darunter sind sehr interessante Ansichten, warum jemand eine Schrift besonders mag oder auch nicht leiden kann. Hier wird vor allem deutlich, dass Typografie gerade unter Designern eine hoch emotionale Angelegenheit ist.

Ein Teilnehmer lässt sich bei „Chalkboard“-Schriften gar dazu hinreißen, „… bitte zerstören Sie all diese Schriften.“ zu kommentieren. So leidenschaftlich dürften viele Kreative mit Schriften umgehen – vor allem, wenn es um Schriften geht, die einem besonders unbeliebt sind.

Schriften vor allem bei den Großen erwerben

Ein ebenfalls sehr interessanter Abschnitt in der Umfrage befasst sich damit, wo und wie die Teilnehmer ihre Schriften erwerben. Hier wird deutlich, dass es vor allem drei große Anbieter sind, die hier die Nase vorn haben. MyFonts, Fonts.com und Adobe sind hier mit riesigem Abstand die beliebtesten Anbieter. Wenn man berücksichtigt, dass MyFonts und Fonts.com beide zum Monotype-Konzern gehören, teilen sich letztendlich zu Großunternehmen den Schriftenmarkt unter sich auf.

extensis_trend-typografie_quellen

Kleinere Anbieter haben hier nur sehr geringe Anteile, die meist unter fünf Prozent liegen.

Die meisten lizenzieren übrigens komplette Familie – und zwar dann, wenn sie gebraucht werden. Eher selten werden ganze Bibliotheken lizenziert oder ausschließlich Open-Source-Schriften verwendet. Wie man die Tatsache bewerten soll, dass etwa 6 Prozent der Befragten keine Schriften lizenzieren, bleibt offen.

Fazit

Auf insgesamt 31 Seiten gibt es weitere interessante Ergebnisse zu Schriften und wie sie derzeit genutzt werden. Auch die Frage, welcher Schriftgestalter unter den Teilnehmern ganz weit vorne steht, wird beantwortet. Zu haben sind die Ergebnisse der Umfrage auf der Website von Extensis (in deutscher Übersetzung). Um die Datei herunterladen zu können, musst du lediglich deine E-Mail-Adresse angeben.

(dpe)

Kategorien
Design Essentials Freebies, Tools und Templates Icons & Fonts UI/UX

Schriften kombinieren leicht gemacht (kostenloses E-Book)

Spätestens mit der Einführung der Webfonts steht auch Webdesignern die ganze Vielfalt der Typografie für ihre Projekte zur Verfügung. Richtige Schriften kombinieren fällt jedoch nicht allen leicht. Das kostenlose E-Book „Combining Typefaces“ hilft dir, passende und zueinander passende Schriften zu finden. Also, welche Schriften passen zu meinem Weblayout und welche Schriften harmonisieren gut miteinander? Das E-Book beantwortet diese und weitere Fragen auf über 60 Seiten.

Schriften kombinieren

Einführung in Grundlagen der Typografie

Alle, die sich zunächst einmal ein Grundlagenwissen anlesen wollen, finden im ersten Kapital von „Combining Typefaces“ viele allgemeine Informationen rund um Schrift und Typografie. So gibt das Kapitel einen Überblick über die Anatomie der Buchstaben, erklärt also unter anderem, was es mit Oberlängen, Unterlängen und Serifen auf sich hat. Wer diese Begrifflichkeiten bereits kennt, kann sich hier mit den englischen Bezeichnungen vertraut machen. Denn das E-Book ist in englischer Sprache verfasst.

Schriften kombinieren
Anatomie der Buchstaben

Überall dort, wo es sehr spezifisch wird, verweist das Buch auf Websites und Fachbücher, mit denen du dein Wissen weiter vertiefst. Auch die Klassifikation von Schriften – also die stilistische und historische Einordnung von Schriften – wird nur oberflächlich behandelt. Aber auch hier gibt es Verweise zu weiterer Literatur.

Schriften auswählen und kombinieren

In den übrigen Kapiteln geht es dann ums eigentliche Thema. Nach welchen Kriterien sollte man eine oder mehrere Schriftarten aussuchen? Was soll mit der Typografie erreicht werden? Es gibt viele Faktoren, die bei der Auswahl einer Schrift eine wichtige Rolle spielen. Da ist zum einen die Lesbarkeit. Aber Schrift kann auch so ausgewählt und angewendet werden, dass sie in erster Linie die Aufmerksamkeit der Lesers erregt.

Der eigentliche Schwerpunkt des Buches – nämlich die Kombination von Schriften – wird sehr ausführlich bearbeitet. Letztendlich ist die Kombination passender und harmonisch wirkender Schriften nicht immer einfach. Wer auf der sicheren Seite sein will, bleibt innerhalb einer Schriftfamilie und kombiniert zum Beispiel eine serifenlose Schrift mit einer Serifenschrift aus derselben Familie.

Das E-Book gibt aber auch viele nützliche Tipps, wie man außerhalb einer Schriftfamilie geeignete Schriften findet, die zueinander passen. So ist es beispielsweise hilfreich, sich zunächst für eine „Ankerschrift“ zu entscheiden – also eine Basisschrift, die du für Fließtexte verwendest und mit der somit der Großteil deiner Texte gesetzt ist.

Schriften kombinieren
Vergleich von Schriften

Zu dieser Ankerschrift solltest du dann eine passende Schrift auswählen, die beispielsweise für Überschriften in Frage kommt. Hier stellt „Combining Typefaces“ einige Kriterien vor, auf die du bei der Auswahl achten solltest. So hilft es zum Beispiel, die Proportionen der Schriften miteinander zu vergleichen. Vergleiche das Verhältnis der Großbuchstaben zu den Kleinbuchstaben, sowie die Buchstabenweite. Auf diese Weise findest du Schriften mit ähnlichen Proportionen, die somit gut mit deiner Ankerschrift harmonieren.

Schriften kombinieren: Gelungene Beispiele

Im letzten Kapitel werden noch einige gelungene Beispiele für gute Kombinationen von Schriften im Webdesign vorgestellt. Anhand konkreter Situationen wird erläutert, warum die Schriften zueinander passen und was sie auszeichnet beziehungsweise besonders macht.

Schriften kombinieren
Beispiel für kombinierte Schriften auf einer Website

Dabei gibt es zu allen vorgestellten Schriften Verweise zu den jeweiligen Foundrys. Auf diese Weise findest du womöglich noch die oder andere neue Schrift zur Inspiration und eventuell ja auch einen Schriftenanbieter, den du bislang noch nicht kanntest.

Insgesamt ist „Combining Typefaces“ ein umfangreiches und für typografische Anfänger sowie Fortgeschrittene interessantes und hilfreiches Buch. Wer des Englischen mächtig ist und einen fundierten Einstieg ins Thema Typografie und Kombinieren von Schriften sucht, wird hier sicher fündig.

Das gut 60 Seiten lange und zehn Megabyte große E-Book steht kostenlos als PDF-Datei bei Adobes Schriftendienst Typekit zum Download bereit.

(dpe)

Kategorien
Essentials Icons & Fonts

Mach was draus: 43 kostenlose Serifen-Fonts

Schriftarten kann ein Designer nie genug haben. Gerade Serifen-Fonts werden gerne in Druck-Projekten eingesetzt. Also kann es nicht schaden, auf einen großen Schatz dieser Schriften zurückgreifen zu können. Daher habe ich einige tolle Fonts ausgewählt. Ich habe dazu geschrieben, ob es die Fonts mit deutschen Umlauten gibt, und welche Lizenz genutzt wird. Trotzdem solltest du die Nutzungsbedingungen noch einmal überprüfen, bevor du die Schriftart in einem kommerziellen Projekt verwendest.

Mach was draus: 43 kostenlose Serifen-Fonts

1 – Butler

Butler Font

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Ja

2 – Fakedes

fakedes

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Ja

3 – Forum

Forum

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Ja

4 – Athene

Athene

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Ja

5 – Poly

Poly

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Ja

6 – Barbaro

Barbaro

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Ja

7 – Le Super Serif

Le-Super-Serif

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Nein

8 – Firefly 2015

Firefly

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Ja

9 – Fénix

Fenix

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Ja

10 – Akura Popo

Akura-Popo

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Nein

11 – Rancho

Rancho

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Ja

12 – Bariol Serif

Bariol-Serif

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Ja

13 – Lovato Light

Lovato-Light

Lizenz: »Frei«
Format: OTF
Deutsche Umlaute: Ja

14 – Yeseva One

yeseva-one

Lizenz: Private und kommerzielle Nutzung
Format: TTF
Deutsche Umlaute: Ja

15 – Luthier

Luthier

Lizenz: »Frei«
Format: OTF
Deutsche Umlaute: Ja

16 – Cormorant

Cormorant

Lizenz: »Frei«
Format: OTF
Deutsche Umlaute: Ja

17 – Ledger

Ledger

Lizenz: Private und kommerzielle Nutzung
Format: TTF
Deutsche Umlaute: Ja

18 – Marta

Marta

Lizenz: »Frei«
Format: OTF
Deutsche Umlaute: Ja

19 – The Tryst

Tryst

Lizenz: »Frei«
Format: OTF
Deutsche Umlaute: Nein

20 – Blnc Round

Blnc

Lizenz: »Frei«
Format: OTF
Deutsche Umlaute: Nein

21 – Hagin

Hagin

Lizenz: »Frei«
Format: OTF
Deutsche Umlaute: Nein

22 – Brela Regular

Brela

Lizenz: »Frei«
Format: OTF
Deutsche Umlaute: Ja

23 – Modum Regular

Modum

Lizenz: »Frei«
Format: OTF
Deutsche Umlaute: Nein

24 – Zorus Serif

Zorus Serif

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Ja

25 – Seriffic

seriffic-font

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Ja

26 – Atletico

Atletico

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Nein

27 – Foglighten

Foglighten

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Ja

28 – Artifika

Artifika

Lizenz: Private und kommerzielle Nutzung
Format: TTF
Deutsche Umlaute: Ja

29 – Arctic

Arctic

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Ja

30 – Bobber

Bobber

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Ja

31 – Superlative

Superlative

Lizenz: »Frei«
Format: TTF – Nur Uppercase
Deutsche Umlaute: Nein

32 – Musket

Musket

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Nein

33 – Ponsi

Ponsi

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Ja

34 – Silverfake

Silverfake

Lizenz: »Frei«
Format: OTF
Deutsche Umlaute: Nein

35 – Corduroy Slab

Corduroy-Slab

Lizenz: »Frei«
Format: OTF
Deutsche Umlaute: Nein

36 – Weston

Weston

Lizenz: »Frei«
Format: OTF
Deutsche Umlaute: Nein

37 – Korneuburg Slab

Korneuburg-Slab

Lizenz: Private Nutzung
Format: OTF + TTF
Deutsche Umlaute: Ja

38 – Corki V.02

Corki V.02

Lizenz: »Frei«
Format: OTF
Deutsche Umlaute: Nein

39 – Aleo

Aleo

Lizenz: Private und kommerzielle Nutzung
Format: OTF
Deutsche Umlaute: Ja

40 – Dirty Slab

Dirty-Slab

Lizenz: Private Nutzung
Format: TTF
Deutsche Umlaute: Nein

41 – Bree

Bree Serif

Lizenz: Private und kommerzielle Nutzung
Format: TTF
Deutsche Umlaute: Ja

42 – Sreda

Sreda

Lizenz: Private und kommerzielle Nutzung
Format: TTF + OTF
Deutsche Umlaute: Ja

43 – Unna

Unna

Lizenz: Private und kommerzielle Nutzung
Format: TTF + OTF
Deutsche Umlaute: Nein

Mehr kostenlose Fonts bei Dr. Web entdecken:

(dpe)

Kategorien
Design Icons & Fonts

Vergleich: Schriften-Abos (nicht nur) fürs Web

Bei digitalen Inhalten und Anwendungen werden Abomodelle immer beliebter. Ob Musik, Software oder Schriften: Statt einmal kaufen, beziehungsweise lizenzieren, werden Angebote quasi als eine Art monatliche Flatrate bereitgestellt. Bei Webschriften haben Anbieter von Anfang an auf ein solches Abomodell gesetzt – vor allem, damit Schriftdateien nicht auf fremden Servern landen. Mittlerweile weiten immer mehr Schriftanbieter ihr Abomodell auch auf klassische Desktopschriften aus. Für wen lohnen sich solche Abodienste? Und wo liegen die Unterschiede der Angebote?

Vergleich: Schriften-Abos (nicht nur) fürs Web

Der erste seiner Art: Typekit

Typekit gehört zu den ersten und größten seiner Art. Von Anfang an als Abodienst gedacht, beschränkte man sich zunächst auf Webschriften. Erst mit der Übernahme von Typekit durch Adobe und die Verzahnung mit der Creative Cloud wurden auch Desktop-Schriften ein Teil des Angebotes von Typekit.

ss
Typekit

Als Abonnent der Creative Cloud hast du automatisch Zugriff auf den Portfolio-Plan von Typekit, der normalerweise 49,99 US-Dollar im Jahr kostet. Darin enthalten sind knapp 2.500 Desktop-Schriften sowie über 5.000 Webschriften. Die Installation von Desktop-Schriften erfolgt nicht wie gewöhnlich, sondern über die Creative-Cloud-Anwendung. Schließlich sollen die Schriften nur so lange zur Verfügung stehen, wie ein Abonnement vorhanden ist.

Allerdings stehen die installierten Schriften nicht nur in Adobe-Anwendungen zur Verfügung, sondern auch in allen anderen Programmen – zum Beispiel Office-Anwendungen. Im Portfolio-Plan synchronisierst du bis zu 100 Schriften gleichzeitig.

Bei den Webschriften ist die Sache etwas komplizierter. So legst du für jede Domain ein sogenanntes Kit an. Diesem Kit fügst du alle Schriften hinzu, die du auf der Domain nutzen willst. Anschließend bindest du ein JavaScript ein und verwendest die Schrift ganz normal über die Stylesheets einer Schrift.

Der größte seiner Art: Monotype

Monotype gehört zu den größten Schriftenanbietern überhaupt. So zählt zu dem Unternehmen auch das Portal MyFonts, das Desktop- sowie Web-Schriften anbietet. Im Gegensatz zu Typekit werden sowohl klassische Schriften als auch Webfonts nicht nur als Abo angeboten. Alle Webschriften von MyFonts erhältst du als Dateien, um diese selber hosten zu können.

abovergleich_myfonts
MyFonts

Während Desktop-Schriften in der Regel nach Anzahl der Installationen auf verschiedenen Rechnern lizenziert werden, erfolgt die Lizenzierung von Webfonts meist nach geschätzten Seitenaufrufen einer Website.

Bei einigen Foundries verpflichtest du dich daher, die Seitenaufrufe automatisiert an MyFonts zu übermitteln. So wird nachgehalten, ob die vereinbarten Pageviews eingehalten werden. Viele Foundries verzichten allerdings auf diese Kontrolle.

Neben MyFonts betreibt Monotype das Portal fonts.com speziell für Webschriften. Im Basis-Plan erhältst du für 60 US-Dollar im Jahr Zugriff auf 3.000 Schriften, also etwa 500 mehr als bei Typekit. Dafür kostet der Dienst etwa 10 Dollar mehr. Du kannst den Dienst allerdings nur für zwei Webprojekte nutzen.

Wer als Webdesigner für seine Kunden die Webfonts verwaltet, sollte den Standard-Plan für 120 US-Dollar im Jahr nutzen. Hier sind dann wie bei Typekit beliebig viele Webprojekte möglich. Dafür erhält man Zugriff auf über 40.000 Schriften. Die Einbindung der Schriften ist nicht mehr auf JavaScript angewiesen. Alternativ kannst du die Schriften selbst hosten.

abovergleich_monotype-library-subscription
Einige Schriften der „Monotype Library Subscription“

Mit der „Monotype Library Subscription“ gibt es seit neustem auch für Desktop-Schriften ein Abo-Angebot. Für 119,99 Euro im Jahr gibt es bis zu 9.000 Schriften aus 2.200 Familien für den Deskop. Wie bei Typekit erfolgt die Installation der Schriften nicht direkt, sondern über eine Anwendung. Im Falle von Monotype ist das SkyFonts.

Zum Angebot des Abos gehören moderne Klassiker wie die „DIN Next“, „Avenir Nex“, „Neue Helvetica“, „Univers“ und „Gill Sans“. Der Dienst ist im Vergleich zu Typekit recht teuer. Aber wer auf diese Klassiker nicht verzichten möchte, ist mit der „Monotype Library Subscription“ gut bedient. Denn bei Typekit suchst du diese Schriften vergeblich.

Schriften-Abos: Welcher Dienst lohnt sich für wen?

Neben Typekit und den anderen vorgestellten Diensten gibt es natürlich noch eine ganze Reihe anderer Anbieter. Aber aufgrund des immer größer werdenden Marktes soll es an dieser Stelle beim Vergleich zwischen den beiden großen Anbietern bleiben. Denn bei den genannten Diensten besteht nicht die Gefahr, dass einer von beiden in absehbarer Zeit eingestellt wird. Dies war beispielsweise bei dem von Extensis betriebenen Dienst WebINK der Fall.

Grundsätzlich lässt sich sagen, dass Typekit sich für alle anbietet, die eine große Auswahl an Schriften wünschen, aber auf Klassiker verzichten können. Außerdem ist Typekit als Teil der Creative Cloud bei vielen Web- und Grafikdesignern vermutlich eh gesetzt.

Die „Monotype Library Subscription“ bietet sich für alle an, die Zugriff auf viele moderne und auch ältere Schriftklassiker haben wollen. In vielen Fällen sind gerade sehr häufig genutzte Schriften bei Typekit nicht vorhanden, so dass diese entweder doch einzeln lizenziert werden müssen oder eben per „Monotype Library Subscription“ hinzugefügt werden können.

Häufig dürfte das Lizenzieren einzelner Schriften günstiger sein als das Vorhalten eines großen Angebotes per Abo. Daher sollte man sich gut überlegen, ob man bis zu 120 Euro im Jahr für ein Abo zahlen möchte, wenn man für 20 bis 60 Euro pro Schrift diese dauerhaft zur Verfügung stehen hat. Außerdem verschwinden nach Kündigung des Abos alle Schriften wieder vom Rechner.

(dpe)

Kategorien
Bilder & Vektorgrafiken bearbeiten Design Freebies, Tools und Templates Icons & Fonts

TheHungryJPEG – alles, was das Designerherz begehrt

Hochwertige Schriften, anspruchsvolle Icons, aussagekräftige Fotos – als Grafik- und Webdesigner ist man immer wieder auf der Suche danach. Eine große Auswahl unterschiedlicher kreativer Assets zu Preisen, die zwischen anständig und fast geschenkt liegen, bietet die Seite mit den ungewöhnlichen Namen: TheHungryJPEG. Dabei steigt das Angebot des Ende 2014 gegründeten Portals stetig. Dank zahlreicher Freebies und monatlich wechselnder 1-Dollar-Deals lohnt sich ein regelmäßiger Besuch.

thehungryjpeg

Hochwertige Gestaltung zu günstigen Preisen

Das Ziel von TheHungryJPEG war von Anfang an, hochwertig gestaltete Ressourcen zu erschwinglichen Preisen anzubieten. Offenbar haben die Macher großen Erfolg – und sie zeigen, dass es in der Kreativbranche zwischen Kostenlosmentalität und überteuerten Angeboten eine recht große Nische für TheHungryJPEG gibt.

Freilich machen den großen Erfolg der Website vor allem die Gestalter aus, die ihre kreativen Arbeiten – unter anderem Schriften, Themes und Templates – dort verkaufen oder kostenlos anbieten. Daher räumen die Macher von TheHungryJPEG diesen auch entsprechend Raum ein, um sie zu präsentieren. Als registrierter Nutzer kannst du Designer direkt über das Portal kontaktieren oder ihnen folgen.

Vielseitiges Angebot an Add-ons und Schriften

Dass sich TheHungryJPEG als Komplettversorger für Kreativschaffende versteht, wird klar, wenn man sich die Bandbreite des Angebotes anschaut. Unter „Add-ons“ findest du beispielsweise Pinselvorgaben für Photoshop sowie Presets für Lightroom, mit denen du deine Fotos in ganz bestimmte Stimmungen tauchst. Oder du malst für sieben Dollar in Photoshop wie mit Wasserfarbe.

thehungryjpeg_pinsel
Watercolour Brushes & Backgrounds“

Allein das Angebot an Schriften kann sich sehen lassen. Mittlerweile ist dieses auf mehrere Hundert angestiegen. Neben gut ausgebauten Schriften für den Alltagsgebrauch – von modern bis klassisch serifenbetont – findest du auch zahlreiche außergewöhnliche Schriften, mit denen du Plakate, Logos und andere Schriftzüge markant in Szene setzt.

thehungryjpeg_schrift
Humble Rought“

Dank guter Kategorisierung findest du schnell eine passende Auswahl. Es lohnt sich aber auch, einfach mal so durch die Seiten zu stöbern und sich hier und da inspirieren und anregen zu lassen. Mit der „Humble Rought“ findest du für 15 Dollar eine modern wirkende Vintage-Schrift mit unverwechselbarem Look.

Nicht alles selber machen: Icons, Mock-ups und UI-Elemente

Als kreativer Mensch neigt man oft dazu, einfach alles selber machen zu wollen. Aber das ist weder immer nötig noch sinnvoll. Gerade wenn es um Icons geht, gibt es mittlerweile großartig ausgebaute Sets zu verschiedenen Themen in unterschiedlichen Stilen. Auch hier wirst du bei TheHungryJPEG schnell fündig.

thehungryjpeg_icons
1005 Vector Icons Pack“

Über 1.000 Icons für 7 Dollar? Die Flaggen der Welt für 5 Dollar? Wer selbst kreativ ist, weiß um die Arbeit, die in solchen Projekten liegt. Daher sind solche Angebote mehr als günstig.

thehungryjpeg_mockup
Display Screen Mockup Pack“

Neben Icons sind Mock-ups von elektronischen Geräten oder Arbeitsplätzen ebenfalls oft eingesetzte und äußerst beliebte Ressourcen. Gleiches gilt für gängige Elemente für Bedienoberflächen. Auch hier gibt es zahlreiche Angebote für wenig Geld. So bekommst du für 10 Dollar hochwertige Apple-Geräte – zumindest als Photoshop-Datei. Diese kannst du beispielsweise nutzen, um eigene Screendesigns in angemessener Apple-Umgebung zu präsentieren.

TheHungryJPEG – Fotodienst inklusive

Um das Angebot von TheHungryJPEG komplett zu machen, gibt es selbstredend auch JPEGs. Somit hat die Website quasi ihren eigenen kleinen Stockdienst mit dabei. Hochauflösende und hochwertige Fotos zu und aus allen Lebenslagen findest du dort.

thehungryjpeg_foto
Horse – Close up“

Ernährung, Business, Freizeit und Leute – das sind einige der Kategorien, in denen die Fotos organisiert sind. Das Angebot ist bei weitem nicht so groß, wie du es von Fotolia und deren Mitbewerbern kennst. Dafür kannst du sicher sein, dass die Urheber deutlich mehr an den Verkäufen verdienen.

Wenn es mal „von der Stange“ sein soll

Auch komplett fertig gestaltete Designs gehören zum Angebot von TheHungryJPEG. Dazu gehören Faltblätter und Broschüren, die beispielsweise als InDesign-Datei zur Verfügung gestellt werden.

thehungryjpeg_flyer
Modern Trifold Brochure“

Natürlich gehören ebenso Logos dazu. Wer also mal auf die Schnelle ein fertiges Logo braucht, findet dort mehr als eines – zum Beispiel als Illustrator-Datei zum Bearbeiten.

Auch fertige Vorlagen für Websites findest du im Repertoire. So gibt es unter anderem eine Rubrik mit WordPress-Themes. Für Preise zwischen 15 und 60 Dollar steht dir eine feine Auswahl an Themes, die für zurückhaltend gestaltete Portfolio-Websites ebenso geeignet sind wie für andere stilvolle Weblayouts, zur Verfügung.

TheHungryJPEG: faire Preise, faire Beteiligung

Neben dem umfangreichen und qualitativ hochwertigen Angebot und den erschwinglichen Preisen gibt es einen weiteren großen Vorteil, den TheHungryJPEG im Gegensatz zu anderen, vor allem größeren Anbietern hat. Das ist die Beteiligung der Urheber an den Verkäufen. Bei TheHungryJPEG bekommen diese 70 Prozent der Verkaufserlöse.

Und im Gegensatz zu Fotolia und Co. entscheiden die Verkäufer selbst über die Preise. Daher sind diese auch nicht einheitlich, sondern teils sehr unterschiedlich. Das hat also nicht zwingend etwas mit objektiven Qualitätskriterien zu tun, sondern durchaus mit subjektiver Wertschätzung der eigenen Arbeit des jeweiligen Fotografen oder Gestalters.

thehungryjpeg_shop
Shop von „Favete Art“

Im Übrigen verlangt TheHungryJPEG von seinen Verkäufern nicht, dass diese ihre Angebote exklusiv zur Verfügung stellen. Auch das macht die Leute aus Cirencester in der Nähe von London, von wo aus das Portal betrieben wird, sehr sympathisch.

Aussagekräftige Beschreibungen und einfach gehaltene Lizenz

Zu jedem Angebot gibt es eine meist sehr aussagekräftige Beschreibung. Da diese jeder selbst erstellt, fallen diese vom Umfang manchmal recht unterschiedlich aus. Dennoch erfährt man alles Wissenwerte und Wichtige auf einen Blick. Bei Schriften sind es die Anzahl der Schnitte sowie Infos zum Zeichenvorrat.

Außerdem gibt es zu jedem Angebot die nötigen Angaben zu Dateiformat und anderen technischen Daten. Das ist bei Bildern etwa die Auflösung.

Zu guter Letzt punktet TheHungryJPEG mit einer einfachen und sehr übersichtlichen Lizenz. Diese räumt dir grundsätzlich möglichst großen Freiraum ein. Du hast also das Recht, alle dort erworbenen Ressourcen sowohl privat als auch kommerziell zu nutzen. Nicht erlaubt ist der erneute Verkauf sowie die Sublizenzierung. Das überrascht nicht und ist nachvollziehbar.

Freebies und Deals bei TheHungryJPEG

Wem das Angebot von TheHungryJPEG an sich nicht schon Schnäppchen genug ist, dürfte bei den Deals und vor allem bei den Freebies fündig werden. Neben kostenlosen Angeboten – dazu zählen vor allem Schriften, aber auch Mockups und Bilder – gibt es immer wieder wechselnde 1-Dollar-Deals.

thehungryjpeg_deals
Aktuelles Deals

Diese sind immer für einen Monat erhältlich. Und hier kannst du wirklich sparen. Diese Deals haben dieselben Lizenzbedinungen wie alle anderen Angebote. Das heißt, auch für ganz kleines Geld steht einer kommerziellen Nutzung nichts im Wege.

Fazit

TheHungryJPEG ist ein durch und durch sympathischer Anbieter. Das Angebot ist groß, durchweg anspruchsvoll und erschwinglich. Zwar schwanken die Preise, da sie von den Gestaltern selbst festgelegt wird. Aber alles in allem gibt es nichts zu meckern.

Dank der Deals und Freebies lohnt sich ein Besuch immer wieder – auch wenn man mal nichts kaufen möchte. Die Bezahlung erfolgt übrigens per Kreditkarte oder PayPal. Und wenn du deine Designs selbst dort anbieten möchtest, eröffnest du einfach deinen eigenen Shop.

(dpe)

Kategorien
Essentials Icons & Fonts

1.000 freie Icons für Webdesigner

Sonntag. Ich weiß gar nicht so recht wieso, aber an Sonntagen bin ich stets auf der Suche nach den schönen und nützlichen Dingen. Knochentrockene Skripte und Tools, mögen sie noch so hilfreich sein, können mich da nicht begeistern. Ganz im Gegenteil zu dem riesigen Icon-Set, über das ich heute stolperte und das ich dir dringend ans Herz legen möchte. Die Jungs und Mädels von TheSquidInk bieten 1.000 prägnant gezeichnete freie Icons in den unterschiedlichsten Dateiformaten. Der Haken? Es gibt keinen.

1.000 freie Icons für Webdesigner

1.000 freie Icons decken alle Bereiche des UI-Design ab

Icons gibt es natürlich mehr als du benutzen kannst. Dennoch ist dieses Set hier etwas besonderes. Denn es kommt nicht nur mit der massiven Zahl von 1.000 einzelnen Piktogrammen daher, sondern deckt damit auch noch strukturiert die wichtigsten Anwendungskategorien, die du in deinen Designs jemals haben könntest ab. Was nützen dir etwa 100 Social-Media-Icons, wenn sie nicht zur übrigen Symbolsprache deines Layouts passen?

Der Wert eines Iconsets ist dementsprechend umso höher, je breiter das Spektrum ist, das es abdeckt. Und hier glänzt das “Free Mini Icons Pack” aus dem Hause TheSquidInk wie mit Hartwachs poliert. Wenn geradlinige, einfarbige Piktogramme in dein Konzept passen, brauchst du nicht weiter zu suchen. Diese Symbole sind, was du brauchst.

1.000 freie Icons für Webdesigner

Die Lizenz zur Verwendung ist liberal. Du darfst persönliche, aber auch kommerzielle Projekte damit bestücken. Was nicht erlaubt ist, ist, die Piktogramme zum Kern eines Produkts zu machen. Also sie entweder direkt als solche zu verteilen oder etwa eine App damit zu bestücken, die es den Verwendern erlaubt, aus den Icons z.B. Bilder zu bauen. Um es einfach zu machen: Du darfst dieses Set zu allem verwenden, zu dem man üblicherweise einen Satz Icons innerhalb eines Layouts benötigt, also als Teil der UI.

1.000 freie Icons gegen eine E-Mail-Adresse: fairer Deal

Um an den Bestand zu kommen, ist nicht viel Aktion deinerseits erforderlich. Die Abwicklung des Downloads lassen TheSquidInk über Gumroad laufen, über die wir bei Dr. Web schon vor Jahren berichteten. Im entsprechenden Dialogfenster, das sich nach Klick auf “Download now” öffnet, gibst du als Zahlbetrag die 0 ein und klickst auf “Ich möchte das haben”. Darauf folgt ein Formularfeld, in welches du eine E-Mail-Adresse eingeben musst. Danach klickst du auf “Kaufen”.

Da der Download nicht etwa über einen Link gestartet wird, den du per Mail zugesendet bekommst, könntest du eine Adresse angeben, die nicht wirklich funktioniert. Der Fairness halber solltest du das nicht tun, denn eine gelegentliche Mail für 1.000 kostenlose Icons ist nicht zu teuer als Bezahlung.

Nochmal einen Schritt zurück. Natürlich kannst du im Downloadvorgang anstelle der 0 auch einen Betrag angeben, den du zu zahlen bereit bist. Das wäre auch keine schlechte Vorgehensweise. Die Symbole für lau zu erhalten, ist aber ebenso in Ordnung, denn TheSquidInk bezeichnet sie ja ausdrücklich selber als “Free”. Die Abwicklung über Gumroad stellt lediglich das Standardprozedere dar, nicht etwa einen versteckten Versuch, Umsatz zu generieren.

Freie Icons: Formate, die dein Herz begehrt

Hast du den 13 MB schweren Download erstmal auf deine Festplatte gezogen und entpackt, siehst du, dass TheSquidInk zum schieren Umfang des Sets zusätzlichen Aufwand betrieben haben, um dir den Umgang mit den Piktogrammen weitestgehend zu vereinfachen.

Das gesamte Paket wird in den Formaten Adobe Illustrator, EPS, Photoshop, SVG und PNG geliefert. PNGs stehen vom Start weg in den Auflösungen 16 und 32 Pixel bereit. Aber natürlich kannst du aus einem der sonstigen Formate jede beliebige Auflösung generieren. Die Verfügbarkeit der Vektordaten ermöglicht ebenso eine einfache Farbanpassung und natürlich, bei entsprechenden Fähigkeiten, die Erweiterung und Modifikation bestehender Formen.

1.000 freie Icons für Webdesigner

Um die Handhabung der großen Zahl an Symbolen bequem zu machen, sind die Icons in Unterordner sortiert, die ihrem Anwendungszweck entsprechen. So findest du alle Piktogramme, die sich mit Interaktion befassen im Ordner “Actions” und so weiter. Solltest du den direkten Zugrii auf alle Symbole in einer Datei bevorzugen, so wirst du dich freuen, dass TheSquidInk diesen Fall ebenfalls vorgedacht hat. Schau einfach in den Ordner “All”.

Schlussendlich kann ich dir die “1.000 Free Mini Icons” von TheSquidInk nicht nur für den heutigen Sonntag als Zeitvertreib, sondern auch für deine ernsthaften UI-Designs wärmstens empfehlen.

Kategorien
Design Icons & Fonts Inspiration Showcases

TheHungryJPEG: Ungewöhnliche und anspruchsvolle Schriften für wenig Geld

Schriften spielen für Grafik- und Webdesigner eine wichtige Rolle. Neben klassischen Schriften und den großen Foundrys wie Monotype, Adobe und FontFont gibt es aber auch zahlreiche kleine Anbieter und viele hochwertige Schriften, die es für wenig Geld gibt. Einer dieser kleineren Anbieter ist das relativ neue TheHungryJPEG gibt. Zwischen einem und 65 Dollar zahlst du hier für komplette Schriftfamilien.

Ungewöhnliche und anspruchsvolle Schriften für wenig Geld

TheHungryJPEG bietet Designern die Möglichkeit, dort neben Schriften auch Themes, Templates, Fotos und Grafiken zu verkaufen. Hier können also Schriftgestalter, die nicht bei einem der großen Foundrys unter Vertrag sind, ihre Schriften anbieten. Auch wenn einige Schriftenfamilien für über 100 Dollar verkauft werden, ist der Großteil für deutlich weniger Geld zu haben. Eine Auswahl besonderer Fonts, die sich für plakative, dekorative und Fließtexte eignen, soll dir einen Eindruck des Angebotes aus den über 900 Typefaces geben, die bei TheHungryJPEG zu finden sind.

Dekorative und handgeschriebene Schriften

Ob mit feiner Feder gezeichnet oder mit fettem Pinsel gemalt – handgeschriebene Schriften werden immer gerne eingesetzt. Gut ausgebaute Schreib- und Handschriften haben oft alternative Zeichen und zusätzliche Ornamente. So entstehen eindrucksvolle und individuelle Überschriften.

Die „Maestro“ ist eine sehr verspielte Pinselschrift mit sehr unterschiedlicher Strichstärke und gewollt ungleichmäßiger Linienführung. Die Schrift gibt es für 13 Dollar. Sie enthält einen zusätzlichen Schnitt mit schwungvollen Linien und Ornamenten zur Verzierung. Die Schrift ist als OpenType sowie Webschrift vorhanden.

thehungryjpeg_maestro
„Maestro“

Wer es eher kalligraphischer mag, sollte sich die „Amelia“ ansehen. Sie besticht durch feine und schwungvolle Linien und besitzt zahlreiche zusätzliche Schwünge, die am Anfang oder Ende eines Wortes für das besondere Flair sorgen. Diese Schwünge sind nicht als eigener Schnitt vorhanden, sondern als alternative Zeichen, die per OpenType-Features angewendet werden.

Neben der „Fine Version“ gibt es die „Amelia“ als „Draft Version“, bei der die Linien nicht ganz so filigran gezeichnet sind. Die Schriften sind für 16 beziehungsweise 18 Dollar zu haben und enthalten sowohl OpenType- als auch Webschriften. Jede der beiden Schriften besitzt über 1.400 Zeichen.

thehungryjpeg_amelia
„Amelia“

Handgeschrieben, aber alles andere als kalligraphisch ist die „Immogen Agnes“. Die Schrift erinnert an ausdrucksstarke Unterschriften mit ausladenden Großbuchstaben und ist bestens geeignet, um Namen mit besonderer Note eindrucksvoll darzustellen. Die Schrift kostet 16 Dollar und ist nur als OpenType- und TrueType-Schrift vorhanden.

thehungryjpeg_imogen-agnes
„Immogen Agnes“

Plakative und auffällige Schriften

Wenn es mal alles andere als dezent sein soll, muss es häufig mehr sein, als eine massive Schrift in auffälliger Farbe zu setzen. Die „Vidiz Pro Typeface“ ist eine sehr serifenbetonte Schrift, die dank verspielter Schwünge gleichzeitig etwas filigranes mitbringt, wodurch die Schrift an sich schon sehr auffällt.

Dank zahlreicher Ligaturen und Alternativzeichen ergeben sich sehr individuelle Schriftbilder. Die Schrift ist als OpenType-, TrueType- und Webschrift vorhanden und kostet 14 Dollar.

thehungryjpeg_vidiz-pro-typeface
„Vidiz Pro Typeface“

Ebenfalls speziell für Überschriften und plakative Texte gedacht, ist die „Stampbor Typeface“, die ausschließlich Versalien besitzt. Dafür sind vier Schnitte enthalten, welche die Schrift unterschiedlich darstellen. Neben „Clean“ und „Rounded“ mit abgerundeten Ecken gibt es den Schnitt „Grunge“, der für einen Stempeleffekt sorgt. Außerdem gibt es den Schnitt „Lines“, bei der die Flächen liniert statt flächig ausgefüllt sind, sowie „Dotted“ mit gepunkteter Füllung.

Die komplette Familie als OpenType- und Webfont gibt es für 14 Dollar.

thehungryjpeg_stampbor-typeface
„Stampbor Typeface“

Ebenfalls nur aus Versalien besteht die Schrift „Sovereign Typeface“. Die massiven Buchstaben eignen sich prima für plakative und klare Überschriften. Die abgerundeten Ecken der Schrift federn die Massivität der Buchstaben etwas ab und sorgen für ein nicht allzu hartes Schriftbild.

Die Schrift gibt es als OpenType- und TrueType-Schrift. Sie ist für 10 Dollar zu haben.

thehungryjpeg_sovereign-typeface
„Sovereign Typeface“

Hochwertige Schriften für Fließtexte

Die bisher vorgestellten Schriften sind wenn, dann nur bedingt für Fließtexte zu gebrauchen. Aber auch hierfür hat TheHungryJPEG Einiges zu bieten, zum Beispiel die „Quincy CF font family“.

Diese Schrift ist eine klassische Serifenschrift. Sie besitzt Ligaturen, unterstützt neben dem lateinischen auch das kyrillische Alphabet und ist in zehn Schnitten vorrätig – fünf verschiedene Stärken mit je einer passenden Kursiven dabei. Die komplette Schrift, die als OpenType- und TrueType-Schrift vorhanden ist, gibt es für 15 Dollar.

thehungryjpeg_quincy-cf-font-family
„Quincy CF font family“

Wesentlich moderner ist die „Albory Sans-Serif“, die ebenfalls das lateinische und kyrillische Alphabet unterstützt. Die Schrift gibt es als OpenType- und Webschrift und kostet 10 Dollar.

Dafür erhältst du drei Schnitte – einen regulären Schnitt, sowie einen „Light“- und „Thin“-Schnitt.

thehungryjpeg_albory-sans-serif
„Albory Sans-Serif“

Ebenfalls serifenlos ist die dritte Schrift im Bunde der Fließtextschriften. Die „Pontiac“ ist eine geometrische Serifenlose, die an die „Akzidenz Grotesk“ erinnert, aber wesentlich moderner ist. Insgesamt sind acht Schnitte vorhanden – von „Light“ bis „Black“ mit je passendem Kursivschnitt.

Die Schrift ist nur als OpenType-Schrift vorhanden und kostet 39 Dollar für alle Schnitte zusammen.

thehungryjpeg_pontiac
„Pontiac“

Stilvolle Vintage-Schriften

Vintage-Stil wird immer wieder gern verwendet. So gibt es bei TheHungyJpeg mit der „West End“ eine sehr verschnörkelte Schrift, wie man sie zu Beginn des 20. Jahrhunderts kannte. Die Schrift steht in drei Schnitten bereit: einfach, mit Dekor sowie mit Dekor und Schatten.

Zusätzlich gibt es die dezentere „Stout Roughen“ als Bonus dazu. Beide Schriften lassen sich gut miteinander kombinieren. Die Schriften sind als OpenType vorhanden und kosten zusammen 15 Dollar.

thehungryjpeg_west-end
„West End“

Die „Celestial Vintage“ geht noch einmal 100 Jahre weiter zurück in der Geschichte – und zwar in die viktorianische Zeit und die dort entstandenen Schriften. Die Schrift ist sehr verspielt und eignet sich ebenfalls für schicke Vintage-Designs.

Für 15 Dollar gibt es die Schrift als OpenType- und TrueType-Format.

thehungryjpeg_celestial-vintage
„Celestial Vintage“

Als letzte Schrift sei noch die „Absinthe label typeface“ erwähnt. In Anlehnung an das verbotene Getränk ist diese floral wirkende Schrift entstanden. Es sind sechs Schnitte vorhanden, die sich übereinander legen lassen, um Schatten und einen zusätzlichen Schein in verschiedenen Farben darstellen zu können.

Die komplette Familie ist als OpenType- und Webschrift vorhanden und kostet 15 Dollar.

thehungryjpeg_absinthe-label-typeface
„Absinthe label typeface“

Die hier vorgestellten Schriften stellen nur einen kleinen Ausschnitt dessen dar, was TheHungryJPEG zu bieten hat. Es lohnt sich auf jeden Fall, durch die Seiten zu stöbern, neues zu entdecken und auch das ein oder andere Angebot mitzunehmen.

Ähnlich ausgesprochener Schnäppchenplattformen bietet TheHungyJPEG ebenfalls Deals mit massivem Sparpotenzial an. Beispielhaft sei auf den Deal des Monats März hingewiesen, der sich vor seinen Wettbewerbern aus dem Schnäppchenlager nicht zu verstecken braucht.

(pot/dpe)

Kategorien
Essentials Icons & Fonts

Best of 2015: 100 kostenlose Schriften für Designer

In einer Zeit immer uniformer werdenden Designs können Schriften nach wie vor den Unterschied machen. Eine beeindruckende Schrift verändert den Look völlig, ist dabei aber ganz simpel zu verwenden. Die schwierigste Aufgabe ist es, eine passende Schrift zu finden. Zwar sollte man meinen, dass es haufenweise Schriftschmieden und Marktplätze gibt, und das stimmt auch. Aber gerade diese Fülle im Angebot erschwert das Suchen und Finden deutlich. Von dieser schweren Aufgabe wollen wir dich heute entbinden.

Best of 2015: 100 kostenlose Schriften

Die folgenden 100 Schriften sind unsere Favoriten des letzten Jahres. Alle sind kostenlos nutzbar, manche aber nicht zu jedem Zweck. Achtet also genau auf die jeweilige Lizenz. Viel Spaß beim Stöbern!

Titel: Moon – Free Font

moon font
Erstellt von: Jack Harvatt
Lizenz: CC BY-NC 4.0

Titel: Coves – Free Font

coves typeface
Erstellt von: Jack Harvatt
Lizenz: keine kommerzielle Nutzung, Urhebernennung und keine Abwandlungen des Ursprungswerks erlaubt (zur Distribution)

Titel: Exodus – Free Typeface

exodus typeface
Erstellt von: Andrew Herndon
Lizenz: nur zur privaten Nutzung

Titel: One Day – Free Font

slim typeface
Erstellt von: Nawras Moneer
Lizenz: CC BY-ND 4.0

Titel: Fester

semi-condensend typeface
Erstellt von: Nawras Moneer
Lizenz: CC BY-ND 4.0

Titel: Elixia

elexia typeface
Erstellt von: Kimmy Lee
Lizenz: nur zur privaten Nutzung

Titel: Cornerstone – Free Font

cornerstone - font
Erstellt von: Zac Freeland
Lizenz: CC BY-NC 4.0

Titel: Pacha

pacha
Erstellt von: sumotype foundry
Lizenz: frei für jeden legalen Zweck

Titel: Rissa Typeface

bold typeface
Erstellt von: The Hungry JPEG
Lizenz: frei für jeden legalen Zweck

Titel: Maxwell Font Family

maxwell typeface
Erstellt von: The Hungry JPEG
Lizenz: Urhebernennung, keine Abwandlungen des Ursprungswerks erlaubt (zur Distribution)

Titel: Waterlily

waterlily font
Erstellt von: The Hungry JPEG
Lizenz: private und kommerzielle Nutzung erlaubt

Titel: Caja

caja font
Erstellt von: Geovanny Gavilanes
Lizenz: keine kommerzielle Nutzung, Urhebernennung und keine Abwandlungen des Ursprungswerks erlaubt (zur Distribution)

Titel: September

september - display font
Erstellt von: Borja Fernández
Lizenz: Creative Commons, nicht näher spezifiziert

Titel: Balans

balans - typeface
Erstellt von: Thomas Breure
Lizenz: Urhebernennung, Weitergabe zu gleichen Bedingungen

Titel: Len‘ Typeface

len'
Erstellt von: Ilya Vydysh
Lizenz: keine kommerzielle Nutzung, Urhebernennung und keine Abwandlungen des Ursprungswerks erlaubt (zur Distribution)

Titel: Pactim Font

pactim - font
Erstellt von: Marco Invernizzi
Lizenz: keine Nutzungsbeschränkungen

Titel: Tubed Font Family

tubed family
Erstellt von: Marco Invernizzi
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Ruffle Beauty Free Font

ruffle beauty font
Erstellt von: Agga Swist’blnk
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Monthoers Free Font

vintage font
Erstellt von: Agga Swist’blnk
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Neament Free Font

neaments - font
Erstellt von: Agga Swist’blnk
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Stoked

stoked - font
Erstellt von: Marie-Michelle Dupuis
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Edirne

edirne font
Erstellt von: iordanis passas
Lizenz: keine kommerzielle Nutzung, Urhebernennung und keine Abwandlungen des Ursprungswerks erlaubt (zur Distribution)

Titel: Baston

baston font
Erstellt von: iordanis passas
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Parabola

brush script
Erstellt von: Marcelo Reis Melo
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: BRUX BOLD BRUSH FONT

brux font
Erstellt von: Marcelo Reis Melo
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: HIPSTER FREE FONT BELLABOO

bellaboo font
Erstellt von: Marcelo Reis Melo
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: BAVRO FREE FRESH FONT

bavro font
Erstellt von: Marcelo Reis Melo
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: GEOM Display Typeface

geom typeface
Erstellt von: Danilo Gusmão Silveira
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Intro Rust: Vintage Font Family

intro rust font
Erstellt von: Fontfabric
Lizenz: CC BY-NC 4.0

Titel: REEF

rounded font
Erstellt von: Gatis Vilaks and Evita Vilaka
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Fantaisie

retro bold font
Erstellt von: lev berry
Lizenz: Urhebernennung, Weitergabe zu gleichen Bedingungen

Titel: Besom – FREE Brush font

besom font
Erstellt von: KRISIJANIS MEZULIS and Gatis Vilaks
Lizenz: Urhebernennung

Titel: ETNA

etna font
Erstellt von: KRISIJANIS MEZULIS
Lizenz: nur zur privaten Nutzung

Titel: Hallo Sans Free font

hallo sans
Erstellt von: Fredrik Staurland
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Sant’Elia font

santelia font
Erstellt von: fontfabric
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Tresdias – Free Font

tresdias font
Erstellt von: Asclê de Oliveira
Lizenz: Urhebernennung und kein kommerzieller Einsatz

Titel: Blogger Sans (Free Typeface)

blogger typeface
Erstellt von: Sergiy Tkachenko
Lizenz: Namensnennung – Keine Bearbeitungen 4.0, kommerzielle Nutzung erlaubt

Titel: Blackentina (Free Typeface)

blackentina font
Erstellt von: Sergiy Tkachenko
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Marske

marske font
Erstellt von: Sergiy Tkachenko and Kash Singh
Lizenz: CC BY-NC 4.0

Titel: Enila

enila font
Erstellt von: Asclê de Oliveira
Lizenz: Urhebernennung und kein kommerzieller Einsatz

Titel: Perfograma Free Font

perfograma font
Erstellt von: Asen Petrov and Fontfabric
Lizenz: CC BY-NC 4.0

Titel: Comok

comok font
Erstellt von: Oleg Tischenkov
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Balqis Font

balqis font
Erstellt von: heydesign
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Silici Font

silici font
Erstellt von: Ferdie Balderas
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: One Day

one day font
Erstellt von: Nawras Moneer
Lizenz: Urhebernennung, keine Abwandlungen des Ursprungswerks erlaubt (zur Distribution)

Titel: Asfalto Font

asfalto typeface
Erstellt von: Fernando Forero
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Anders Font

anders font
Erstellt von: Tom Anders Watkins
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Handletter Typeface

handletter typeface
Erstellt von: Sasha Koggio
Lizenz: nur zur privaten Nutzung

Titel: Gogoia Typeface

gogoia typeface
Erstellt von: Alan de Sousa
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Tostada Font

tostada font
Erstellt von: Iván Nuñez
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Break Fill | Free Font

break fill type
Erstellt von: Rajesh Kumar
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Numb3rs – Free Font

numbers font
Erstellt von: Tommi Jäkkö
Lizenz: keine kommerzielle Nutzung, Urhebernennung und keine Abwandlungen des Ursprungswerks erlaubt (zur Distribution)

Titel: Break

break typeface
Erstellt von: Rajesh Rajput
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Chemin

chemin font
Erstellt von: Rajesh Rajput and Raina Agarwal
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Morracle Font

morracle font
Erstellt von: Maulana Creative
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Carosello Font

carosello typeface
Erstellt von: Unio | Creative Solutions
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Devious Typeface

devious type
Erstellt von: Graptail
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Bellico Typeface + Bonus Vectors

bellico typeface
Erstellt von: Seventh Imperium
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Gardenia Script

gardenia font
Erstellt von: Emily Spadoni
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: El Capitan: Hand-Drawn Font

elcapitan font
Erstellt von: Petr Knoll
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Slash: Bad Ass Display Font

slash typeface
Erstellt von: Ronald Vermeijs
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Serendipity Script Free Font

hand-darwn font
Erstellt von: TheHungryJPEG
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Badhead Typeface

badhead typeface
Erstellt von: ianmikraz studio
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Metrica Font Typeface

metrica font
Erstellt von: Oliver James
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Nickainley Script

elegant font
Erstellt von: Seniors Studio
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Arka – Free Set

arka font
Erstellt von: Bruno
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Metro 2.0

metro 2
Erstellt von: Filipa Amado
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Cast Iron (Free Font)

massive typeface
Erstellt von: Jeremy Vessey
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Mecha 08 – Free Font

futuristic font
Erstellt von: Mehmet Reha Tugcu
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Phage – Free Font

phage font
Erstellt von: Mehmet Reha Tugcu
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Nexa Script

nexa script
Erstellt von: fontfabric
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Michelle – Free Handmade Script Font

michelle font
Erstellt von: Noe Araujo and Mats-Peter Forss
Lizenz: frei für die persönliche und kommerzielle Nutzung.

Titel: Mightype Script – Free Handlettered Font

mighttype font
Erstellt von: Mats-Peter Forss and Adam Fathony
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Airpena Free Font 

airpen font
Erstellt von: Ardian Radityo
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Free – Stellar Typeface

stellar typeface
Erstellt von: Mathieu Desjardins
Lizenz: frei für die persönliche Nutzung

Titel: Secca Soft Free Fonts

funny fonts
Erstellt von:  Andreas Seide
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: New Font on VTF : Combat

combat social font
Erstellt von: jérémy Terres Couvent
Lizenz: SIL Open Font License, Version 1.1.

Titel: Arte

arte font
Erstellt von: saptarshi nath
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Block Letters

block letters
Erstellt von: Chris Fernandez
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Melo

melo font
Erstellt von: Free goodies for designers
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Julep

julep font
Erstellt von: Jeremy Ross
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Hidden Cinema – Free Font

hidden cinema font
Erstellt von: Edwin Servaas
Lizenz: CC BY-NC 4.0

Titel: Sun – Free Automated Text Effect Vintage (Illustrator)

sun font
Erstellt von: PiDiEffE
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Free Font – Phelix Boomgartner

distorted font
Erstellt von: Michal Slovák
Lizenz: keine kommerzielle Nutzung, Urhebernennung und keine Abwandlungen des Ursprungswerks erlaubt (zur Distribution)

Titel: Meedori Sans

medori sans font
Erstellt von: Meedori Studio und Danilo De Marco
Lizenz: CC BY-NC 4.0

Titel: Curely

curely typeface
Erstellt von: Konstantine Studio
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Free Font: Rollerblade

rellorblade font
Erstellt von: Nathan Metzler
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Royals Font

royals font
Erstellt von: Paul Reis
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Material Design Image Font

material design font
Erstellt von: Dimitrios Pantazis
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Ovalo Display Free Font 

ovalo font
Erstellt von: BUONO
Lizenz: frei für die persönliche Nutzung

Titel: Gone Typeface

gone typeface
Erstellt von: Nathan Metzler
Lizenz: Urhebernennung

Titel: Freebie Handwrite Font

handwritten font
Erstellt von: Eight Black Dots
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

Titel: Barry Typeface

barry typeface
Erstellt von: TheHungryJPEG
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Ailerons Typeface

ultrathin font
Erstellt von: Adilson Gonzales de Oliveira Junior
Lizenz: frei für die persönliche Nutzung

Titel: Slim

slim typeface 2
Erstellt von: sophie rousseau
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: One

bold geometric font
Erstellt von: sophie rousseau
Lizenz: frei für die persönliche und kommerzielle Nutzung

Titel: Brush

brush font
Erstellt von: sophie rousseau
Lizenz: Urhebernennung, keine Abwandlungen des Ursprungswerks erlaubt (zur Distribution)

Titel: Aroly Font

aroly typeface
Erstellt von: Arvind Kumar
Lizenz: frei für die persönliche Nutzung

Titel: Marziona Free Font

brush script 2
Erstellt von: Tharique Azeez
Lizenz: Urhebernennung, keine Abwandlungen des Ursprungswerks erlaubt (zur Distribution)

Titel: Phantasm – Free Typeface

phantasm font
Erstellt von: Adil Siddiqui
Lizenz: Vom Ersteller als „kostenlos“ bezeichnet, aber nicht mit einer echten Lizenz versehen

(dpe)

Kategorien
Design HTML/CSS Icons & Fonts Webdesign

Die schönsten Layer-Fonts und wie man sie im Webdesign verwendet

Dass eine Schrift auch mal mehrfarbig gesetzt sein kann, ist keine Erfindung der digitalen Typografie. Bereits im 19. Jahrhundert gab es Schriften, die in zwei oder mehr Schnitte aufgeteilt waren, sodass man sie mehrfarbig übereinander drucken konnte. Mit dem OpenType-Format gibt es solche sogenannten Layer-Fonts auch für den digitalen Einsatz. Gerade für 3D- und Schatteneffekte sind mittlerweile zahlreiche Schriften auf dem Markt, welche eine mehrfarbige Darstellung ermöglichen. Und dank der Webschriften kannst du solche mehrfarbigen Texte sogar im Webdesign verwenden.

Layer-Fonts im Webdesign

Was genau sind Layer-Fonts?

Layer-Fonts sind spezielle Schriftfamilien, bei denen einzelne Schnitte so gestaltet sind, dass sie übereinander gelegt werden können. Häufig sind es dekorative Elemente wie Schlagschatten, Konturen oder dreidimensional gestaltete Seiten, die auf diese Weise kombiniert werden. Wenn du jeder dieser Schriftebenen eine eigene Farbe zuweist, ergeben sich auffällige Überschriften und plakative Texte.

In Zeichen- und Satzprogrammen wie Illustrator und InDesign gibt es einfache Möglichkeiten, solche Layer-Fonts einzusetzen. Wie du mit CSS3 Layer-Fonts im Webdesign verwendest, erkläre ich dir später. Zunächst gibt es einige der schönsten und interessantesten mehrfarbigen Schriften, die alle als Webfont erhältlich sind.

Dreidimensionale Schriften

Gerade bei Schriften mit dreidimensionaler Optik bietet sich eine mehrfarbige Darstellung an. Die „Core Circus“ gehört daher sicher zu den interessantesten Layer-Fonts. Es gibt 20 verschiedene Schnitte, die sich unterschiedlich miteinander kombinieren lassen. So gibt es solche, die Dreidimensionalität simulieren. Diese kombinierst du zum Beispiel mit einem der zahlreichen flächigen Schnitte, welcher dann etwa die Vorderseite der 3D-Schrift darstellen kann. Neben Linien und Schraffuren gibt es ebenso gepunktete Schnitte. Zu guter Letzt sind da noch Schatten, die du hinzufügen kannst.

layer-fonts_core-circus

Noch einige Schnitte mehr – insgesamt 38 – hat die „Mrs Onion“, die prinzipiell ähnlich aufgebaut ist, wie die „Core Circus“. Hierbei hast du allerdings die Möglichkeit, die einzelnen Seiten der dreidimensionalen Schrift unterschiedlich farbig darzustellen. So gibt es separate Schnitte für die unteren und die rechten Seiten. Zusätzlich sind für die Vorderseite schraffierte und gepunktete Schnitte vorhanden.

Bis zu sechs Schnitte kombinierst du problemlos und erhältst dadurch sehr detailreiche und mehrfarbige Texte, die sich ideal für großzügig gestaltete Überschriften eignen.

layer-fonts_mrs-onion

Eine etwas andere 3D-Optik bringt die „Epilepsja“ mit sich. Die Schrift spielt mit der Illusion der Dreidimensionalität. So entsteht hier und da zwar der Eindruck eines 3D-Effektes. An anderer Stelle erscheint die Schrift jedoch wieder zweidimensional.

Es gibt drei Schnitte, welche Kontur, Füllung und Hintergrund darstellen. Die „Epilepsja“ fällt in jedem Fall auf und sorgt sicher hier und da für etwas optische Verwirrung.

layer-fonts_epilepsja

Historische Schriften

Neben interessanten 3D-Effekten bieten sich Layer-Fonts immer wieder an, um historische Schriften nachzuempfinden. Gerade in Zeiten vor der digitalen Typografie wurden viele typografische Effekte mit großem manuellen Aufwand realisiert. Dank Layer-Fonts gelingen einem solche Effekte nun im Handumdrehen.

So gibt es mit der „Brim Narrow“ eine Schrift, welche sich an klassischen Schriften aus dem 18. Jahrhundert orientiert. Sie erinnert an die detailreichen und filigran gezeichneten Schriften, wie man sie von Geldscheinen und anderen wertigen Dokumenten kennt.

layer-fonts_brim-narrow

An die Schriften des Art Déko erinnert die „Core Deco“. Die Schrift weist die großen Rundungen und die teils strenge geometrische Ausrichtung aus, wie sie für die Typografie dieses Stils typisch war. Schraffuren, Schatten und 3D-Effekte sind hier als eigene Schnitte vorhanden, um diese farblich abzusetzen.

layer-fonts_core-deco

Dass man auch gebrochene Schriften durchaus zeitgemäß interpretieren und einsetzen kann, zeigt die „Whisky“. Es gibt unterschiedlich fette Flächenschnitte, die du mit unterschiedlich starken Konturenschnitten kombinierst. So ergeben sich für eine gebrochene Schrift ungewöhnliche Effekte, mit denen du sehr schön die klassische Wahrnehmung gebrochener Schriften auf den Kopf stellen kannst.

layer-fonts_whisky

Handschriften

Von Hand geschriebene oder gezeichnete Texte sind immer wieder sehr beliebt – sowohl für verspielte als auch für elegant anmutende Typografie. Hier habe ich einige Layer-Fonts für dich, die mit besonderen Effekten glänzen.

Die „Festivo Letters“ simuliert eine mit dem Stift gezeichnete Schrift. Buchstaben sind teils ausschraffiert, teils mit Punkten umrandet und ausgemalt. Dank der Kombination verschiedener Schnitte lässt sich Farbe mit einbringen, was den verspielten Charakter der Schrift unterstützt.

layer-fonts_festivo-letters

Auch „Le Havre Hand“ simuliert eine per Hand gezeichnete Schrift – hier sogar mit 3D-Optik. Verschieden starke Schraffuren werden mit Konturenzeichnungen kombiniert und ergeben trotz der massiven Buchstaben eine verspielte Optik.

layer-fonts_le-havre-hand

Wer es gerne etwas filigraner mag, findet möglicherweise Gefallen an der „Weingut“. Die elegante Schreibschrift ist mit floralen Elementen verziert und wirkt recht edel und dennoch verspielt. Für den besonderen Look gibt es einen speziellen Dekoschnitt, mit dem du einzelne florale Elemente in anderer Farbe hinzufügst.

layer-fonts_weingut

Layer-Fonts im Webdesign verwenden

Willst du Layer-Fonts auf der eigenen Website einsetzen, müssen die entsprechenden Schnitte der Schrift erst einmal als Webfont her. Jetzt hast du natürlich die Möglichkeit, mehrere Elemente mit demselben Text und den verschiedenen Layer-Schnitten auszuzeichnen und übereinander zu legen. Semantisch ist von dieser Variante abzuraten, da derselbe Texte dann mehrfach vorhanden ist. Daher ist die Kombination der Pseudoelemente „::before“ und „::after“ mit einem Data-Attribut vorzuziehen.

Dazu wird der Text, der im Layer-Font gesetzt wird, nur mit einem Element ausgezeichnet. Dieses Element bekommt ein HTML5-Data-Attribut, welches den Text noch einmal enthält.

<p data-text="Dr. Web Magazin">Dr. Web Magazin</p>

Der Wert im Attribut „data-text“ spielt semantisch keine Rolle. Er wird nur gebraucht, weil du per CSS Zugriff auf den Inhalt dieses Attributes hast. Und alles weitere erfolgt nun ebenfalls per CSS. Dem „<p>“-Element weist du per CSS den Schnitt zu, der im Hintergrund dargestellt werden soll.

p {
  font-family: "LayerFont 1";
  color: blue;
}

Mit dem Pseudoelement „::after“ sorgst du nun dafür, dass dieses den Inhalt des Data-Attributes ausgibt. Es wird dabei absolut platziert, so dass es über dem eigentlichen „<p>“-Element liegt. Außerdem weist du „::after“ die Schrift für den Vordergrund und eine andere Farbe hinzu.

p::after {
  font-family: "LayerFont 2";
  color: red;
  content: attr(data-text);
  position: absolute;
  top: 0;
  left: 0;
}

Willst du einen dritten Schnitt ergänzen, setzt du zusätzlich noch „::before“ ein und verfährst ähnlich wie bei „::after“. Fertig ist die beeindruckende Web-Schrift!

(dpe)

Kategorien
Design Essentials HTML/CSS Icons & Fonts

Simunity Icon Maker: Schicke Piktogramme in Sekundenschnelle selbst erstellt

Auf der Basis der für Bootstrap verwendeten Font Awesome Icons erstellten die Erfinder des Homepagebaukastens Simbla einen Icon Maker, der es dir ermöglicht, in Sekundenschnelle zu individuellen Piktogrammen zu gelangen. Dazu genügen zwei Farbwähler, ein paar Schieberegler und zwei Kollektionen mit Schatten und Rahmen.

Simunity Icon Maker:

Font Awesome als Designbasis

Für ihren kostenlosen Icon-Generator entschieden sich die Macher von Simbla für Font Awesome, weil es unter der sehr liberalen Open Font-Lizenz steht, sehr umfangreich ist und seit jüngstem nicht einmal mehr eine Attributionspflicht besteht. Das sind beste Voraussetzungen für höchsten Nutzwert.

Unter Simunity.net steht der Generator zur unkomplizierten Verwendung bereit. Keine Registrierung oder sonstige Anmeldung wird verlangt. Du wählst einfach das Basis-Piktogramm aus dem Font Awesome-Fundus aus und veränderst es im Handumdrehen. Dabei ist der Funktionsumfang natürlich nicht mit Illustrator zu vergleichen. Die Ergebnisse sind dafür weit schneller greifbar.

Simunity Icon Maker

Simunity Icon Maker: Wenige Schritte zum Erfolg

Der Simunity Icon Maker stellt die Wahl des zu editierenden Icons sinnvollerweise an den Anfang des Prozesses. Dabei wird ein Grid aller in Font Awesome enthaltenen Piktogramme gezeigt. Dieses Grid kann über eine oberhalb erreichbare Liste eingeschränkt werden. So könnte man das Grid direkt auf zum Beispiel Zahlanbieter-Icons reduzieren, um nicht jedes Mal erneut durch alle Symbole scrollen zu müssen.

Simunity Icon Maker

Das ausgewählte Icon wird in einem Vorschaurahmen unterhalb des Grid angezeigt. Links neben dem Vorschaurahmen finden sich die Bearbeitungswerkzeuge. So kannst du etwa die Größe des Icons, sowie die des umgebenden Hintergrunds in Pixeln per Schieberegler oder durch direkte Werteingabe festlegen. Die Farben sowohl des Piktogrammes, wie die des Hintergrunds lassen sich als Hex-Codes separat voneinander definieren. Wer den Code nicht kennt, kann die gewünschte Farbe per Palette auswählen.

iconmakerwerkzeugefarbe

Die stärksten Manipulationen erreichst du allerdings durch die Veränderung des Rahmens und des Schattens. 20 verschiedene Rahmen und acht verschiedene Schattendesigns lassen dich das jeweilige Piktogramm zu deinem eigenen machen. Unter den Schattenstilen finden sich unter anderem die beliebten Long Shadows, die aus dem Flat Design nicht wegzudenken sind. Aber auch Konturweichzeichner und harte Konturen stehen zur Verfügung.

iconmakerschatten

Wenn du mit dem Ergebnis zufrieden bist, kopierst du den unterhalb des Bearbeitungsbereichs angezeigten HTML-Code aus und in dein Webprojekt wieder ein. Der Simunity Icon Maker kann kostenlos sowohl für private, wie auch kommerzielle Projekte, ebenso in Auftragsarbeiten für Kunden verwendet werden. Nicht erlaubt ist es, das Tool als solches zur kostenpflichtigen Nutzung, etwa durch den Einbau in eigene Angebote, bereit zu stellen. Aber, mal im Ernst, darauf muss man erstmal kommen…

Simunity Icon Maker: für die Akzente im Projekt

Etwas umständlich gerät das Ganze, wenn man viele Icons im gleichen Stil erstellen möchte. Das geht nur eins nach dem anderen und die individuellen Änderungen müssen jeweils einzeln erneut vorgenommen werden. Ebenfalls nicht möglich, ist die Veränderung der Piktogramme an sich. Daher bleibt das Tool auf Akzente beschränkt und eignet sich eher nicht für die Entwicklung eines durchgängigen Iconkonzepts für ein komplettes Projekt, wenn man mal vom Prototyping absieht.

Schlussendlich kann ich dir nur empfehlen, dir Simunitys Icon Maker selber mal anzusehen. Hier ist er.

Kategorien
Design Icons & Fonts

Acumin: Universelle Grotesk-Schrift in 90 Schnitten

Die Wahl einer passenden Schrift hängt immer von vielen Faktoren ab. Es gibt sehr prägnante Schriften, die eine eigene Aussage mit in die Gestaltung bringen und aufgrund ihrer Formensprache nur für bestimmte Zwecke geeignet sind. Häufig sind jedoch eher zurückhaltende, nüchterne Schriften gefragt. Gerade wenn sehr unterschiedliche Texte in derselben Schrift gesetzt werden – wie bei E-Books zum Beispiel –, muss eine Schrift her, die universell eingesetzt werden kann. Die „Acumin“ erfüllt diese Voraussetzung. Sie ist neutral und kann dank 90 Schnitten nahezu überall verwendet werden.

Acumin

Eine humanistische Neogroteske

Entwickelt wurde die „Acumin“ vom US-amerikanischen Schriftgestalter Robert Slimbach, der auch Leiter der Schriftentwicklung bei Adobe ist. Ihm verdanken wir unter anderem die „Minion“ und die „Myriad“. Sein Ziel war es, eine Schrift zu gestalten, die in ganz unterschiedlichen Anwendungsgebieten eingesetzt werden kann und daher keine dominierenden Charakteristika besitzen sollte. Ähnlich wie die Helvetcia und die Univers sollte sie durch einen essenziellen neutralen Stil glänzen.

acumin

Vorbild für die „Acumin“ war unter anderem die Akzidenz-Grotesk aus dem Jahr 1898, die von der deutschen Schriftgießerei H. Berthold AG herausgebracht wurde. Die Akzidenz-Grotesk wird nach wie vor gerne als Vorlage für Groteskschriften verwendet. Aufgrund ihrer Zeitlosigkeit bietet sie sich nach wie vor sehr gut als Vorlage für zeitgemäße Schriftgestaltung an.

acumin_akzidenzgrotesk
Akzidenz-Grotesk als Vorbild

Neben des neutralen Charakters war es Slimbach jedoch auch wichtig, dass seine „Acumin“ Eigenschaften humanistischer Schriften besitzt. Entstanden ist eine Schrift, die geometrische Strenge und humanistische Wärme gut vereint. Damit ist der Font ideal geeignet für E-Reader, auf denen sehr häufig humanistische Schriften zum Einsatz kommen. Die „Acumin“ stellt eine sehr schöne Alternative dazu dar, ohne gleich die Nüchternheit einer Helvetica oder Univers auszustrahlen.

90 Schnitte für vielfältigen Einsatz

Slimbach war es wichtig, dass seine Schrift sehr variabel bleibt. Entsprechend viele Schnitte hat er seiner „Acumin“ gegönnt. Die komplette Familie besteht aus 90 verschiedene Schnitten. Dabei gibt es die Schrift in verschiedenen Stärken, Breiten und Lagen. Insgesamt gibt es neun verschiedene Schriftstärken – von „Light“ über „Regular“ bis „Ultra Black“. Jede Stärke ist wiederum in fünf Schriftbreiten vorhanden – von „Extra Condensed“ über „Condensed“ bis „Wide“. Die sich daraus ergebenen 45 Schnitte sind wiederum als Normal- und Kursivschnitt vorhanden.

acumin_schnitte
Verschiedene Stärken, Breiten und Lagen

Aufgrund der 90 Schnitte gibt es kaum Bereiche, in denen die „Arcumin“ nicht verwendet werden kann. So kannst du die Schrift für sehr platzsparende und filigran anmutende Schriftbilder verwenden, aber auch für sehr plakativ und massiv gesetzte Texte. Sie ist für Überschriften und Fließtexte gleichgermaßen geeignet. Die Kombination von Schnitten erlaubt zudem ein sehr abwechslungsreiches Schriftbild, das dennoch aus einem Guss erscheint.

Gerade wenn es darum geht, einen vorgegebenen Text auf einer vorgegebenen Fläche unterzubringen, hast du mit der „Acumin“ eine extrem anpassbare Schrift. Die Vielzahl der Schnitte ermöglicht es, einen Text optimal flächig zu verteilen.

„Acumin“ im Detail

Auch wenn die 90 Schnitte der „Acumin“ eine einheitliche Gestaltung besitzen, gibt es viele Unterschiede im Detail. Diese sorgen dafür, dass die Schnitte für sich alleine und auch in Kombination miteinander gut harmonieren. So haben die schmalen Schnitte zum Beispiel größere Oberlängen als die breiten Schnitte. Je fetter ein Schnitt also ist, desto geringer ist die Oberlänge. Gerade bei Kombinationen von fetten und schmalen Schnitten sorgen die verringerten Oberlängen der fetten Schnitte dafür, dass das Schriftbild nicht zu kontrastreich wird.

acumin_oberlaengen
Variierende Oberlängen

Ebenfalls besonders sind die reduzierten Oberlängen bei Ziffern. Gerade längere Zahlen wie Telefonnummern besitzen im Fließtext häufig eine große Präsenz – ähnlich wie es Wörter in Buchstaben aufweisen. Durch die verringerten Oberlängen in den Ziffern wird dieser in der Regel nicht gewollten Präsenz entgegengewirkt.

Darüber hinaus gibt es bei einigen Zeichen im Detail kleine Besonderheiten, welche der Schrift Individualität verleihen, ohne dass diese hervor sticht.

acumin_besonderheiten
Besonderheiten im Detail

Zeichenvorrat und Sprachunterstützung

Wie es zeitgemäße Schriften in der Regel an sich haben, ist auch die „Acumin“ für den internationalen Einsatz geeignet. So werden 128 Sprachen unterstützt. Allerdings beschränkt sich die Unterstützung auf Sprachen, die auf dem lateinischen Alphabet beruhen. Das griechische und kyrillische Alphabet bleiben unberücksichtigt.

Neben zahlreichen sprachspezifischen Buchstaben sind auch zusätzliche Ziffernformate – zum Beispiel tabellarische und proportionale Ziffern – vorhanden.

Bezug über Typekit oder Fontspring

Wer Abonnent der Creative Cloud von Adobe ist, kann die „Acumin“ bei Adobes Schriftdienst Typekit beziehen. Dort sind alle Schnitte als Desktop- und Webschrift vorrätig. Wer lieber kaufen statt mieten möchte, kann die Schrift bei Fontspring erwerben.

Die komplette Schriftfamilie kostet 780 US-Dollar. Ein Einzelschnitt kostet 35 US-Dollar.

(dpe)