Marketing auf der Überholspur

24 Juli 2017

So finden Sie die perfekte Schriftkombination für Ihre Website: 7 kostenlose Tools

Verfasst von | @

So finden Sie die perfekte Schriftkombination für Ihre Website: 7 kostenlose Tools

Ganz gleich, ob Sie Ihrer ganzen Website einen neuen Anstrich verpassen oder einfach nur eine simple Infografik erstellen möchten, die gewählte Schriftkombination sollte schön und professionell aussehen und wenn möglich nicht vom eigentlichen Inhalt ablenken.

Allerdings gibt es heutzutage eine geradezu unendliche Vielfalt an individuellen Schriftarten, die kostenlos zum Download verfügbar stehen. Wer sich auf die Suche nach der perfekten Schrift für sein nächstes Projekt macht, muss oftmals einsehen, dass diese Auswahl weitaus zeitaufwendiger ist als erwartet. Wie soll man sich bei so vielen möglichen Kombinationen für die richtige entscheiden?

In diesem Beitrag stellen wir Ihnen ein paar nützliche Tools vor, die von Designern entwickelt wurden, die Ihre Hilferufe erhört haben, und es sich zur Mission gemacht haben, anderen das Erstellen perfekter Schriftkombinationen zu erleichtern. Denn dieser Prozess muss keineswegs ein langwieriges Rätselraten sein – mit den richtigen Tools kann das Ganze durchaus schnell und effizient ablaufen. 

CTA sind Dreh- und Angelpunkt für Konversionen auf Ihrer Website. Steigern Sie  Ihre Konversionsrate jetzt mit diesen 50 kostenlosen und frei anpassbaren  CTA-Vorlagen.

7 kostenlose Tools für die perfekte Schriftkombination

1) Google Fonts

Sie haben Google Fonts vielleicht schon mal verwendet, um eine Schriftart für ein Webprojekt zu finden. Aber wussten Sie schon, dass das Tool Ihnen auch Schriftkombinationen vorschlagen kann?

Fahren Sie in der Liste der verfügbaren Schriftarten mit der Maus über eine Schriftart Ihrer Wahl. Klicken Sie links unten im Vorschaubereich der jeweiligen Schriftart auf See Specimen (Exemplar anzeigen).

Eine Schriftart bei Google Fonts

Es öffnet sich eine Seite mit einer Vorschau der Schriftart. Hier können Sie Text eingeben, um zu sehen, wie das Ganze in Aktion aussieht, die Hintergrundfarbe der Seite anpassen (mithilfe des Farbeimer-Symbols oben rechts) und Hintergrundinformationen zur Schriftart einsehen. Weiter unten auf der Seite sehen Sie einen Abschnitt mit dem Titel „Popular Pairings with X“ (Beliebte Kombinationen mit X.)

Google Fonts bietet eine Liste von Schriftarten, die sich mit ausgewählten Fonts gut kombinieren lassen.

Hier können Sie sich eine Reihe von beliebten Kombinationen mit der ausgewählten Schriftart ansehen. Kostenlose Schriftarten lassen sich im Handumdrehen zu Ihrer Google-Fonts-Bibliothek hinzufügen, indem Sie auf das „+“-Symbol neben einer empfohlenen Kombination klicken. Wenn Sie eine Kombination anklicken, können Sie mithilfe der Pfeilsymbole neben den Schriftnamen auswählen, welche Schriftart in der Vorschau für die Überschrift und welche für den Haupttext verwendet wird. 

2) Typ.io

In dieser professionell zusammengestellten Datenbank finden Sie Beispiele von trendigen Schriftkombinationen, die auf anderen Websites verwendet werden. Außerdem können Sie einen Blick in die CSS-Designer werfen, mit deren Hilfe diese Kombinationen gestaltet und formatiert wurden. Nehmen Sie sich ein paar Minuten Zeit und scrollen Sie durch die beeindruckenden Archive oder nach Kategorien geordneten Listen von Typ.io. Wenn Ihnen eine Website ins Auge sticht, klicken Sie einfach auf „Get Under the Hood“ (Hinter die Kulissen blicken).

Dadurch können Sie ganz genau sehen, welche Schriftarten auf der Website verwendet werden, wo im Netz diese heruntergeladen oder erworben werden können, und wie sie von Designern auf Websites verwendet werden können. Selbst, wenn CSS nicht wirklich Ihr Fachgebiet ist, ist Typ.io ein nützliches Tool, wenn Sie Schriftkombinationen in Aktion erleben möchten.

Die Detailansicht eines Website-Beispiels bei typ.io.

Typ.io verfügt darüber hinaus über eine äußerst hilfreiche Suchfunktion, mit der Sie Websites nach der verwendeten Hauptschriftart, gewünschten Schriftart oder Schriftverfügbarkeit filtern können. Und nicht nur das: Sie haben sogar die Möglichkeit, zu erfahren, welche Schriftkombinationen auf unterschiedlichen Arten von Websites am gängigsten sind (z. B. auf Blogs, Portfolios usw.)

3) Web Font Blender

Web Font Blender bietet eine schnelle, unkomplizierte Möglichkeit, Schriftkombinationen in einer simplen, minimalistischen Umgebung zu testen. Das Tool erinnert an gängige Textbearbeitungsprogramme, erlaubt es jedoch, verschiedene Webfonts miteinander zu kombinieren, den Textkörper, Überschriften sowie Zwischenüberschriften zu bearbeiten, und das Aussehen des Vorschautexts nach Belieben anzupassen.

Die Oberfläche von Web Font Blender

Wählen Sie beliebige Webfonts aus einer Vielzahl an verfügbaren Optionen und probieren Sie verschiedene Einstellungen aus, um genau die richtige Kombination für Ihr Projekt zu finden. Wenn Sie mit Ihrer Schriftart zufrieden sind, können Sie unter „Grab Code“ (Code kopieren) sogar den CSS-Code herunterladen. 

4) Fonts In Use

Fonts In Use ist ein unabhängiges Archiv, das entwickelt wurde, um Designern aus aller Welt die Möglichkeit zu bieten, ihre Schriftarten mit einer breiteren Öffentlichkeit zu teilen. Das Team von Fonts In Use hat es sich zur Mission gemacht, interessante Schriftkombinationen aus allen möglichen Quellen ausfindig zu machen – von Websites über Printkampagnen bis hin zu Paketdesigns ist hier alles vertreten.

Fonts in Use gibt einen guten Einblick in die Schriftarten, die in verschiedenen Medien und Formaten verwendet werden.

Durchstöbern Sie die umfangreichen Archive, um Inspiration zu sammeln, oder sehen Sie sich Beispiele beliebter Typografien in Ihrer Branche an, indem Sie aus dem Dropdown-Menü oben auf der Seite die Option „Industries“ (Branchen) auswählen. Wenn Ihnen eine bestimmte Schriftart besonders gut gefällt, Sie aber nicht wissen, womit diese sich gut kombinieren lässt, können Sie die Ergebnisse auch nach Schriftbildern filtern.

Beispiel der Verwendung einer Schriftart bei Fonts in Use.

5) Canva Font Combinations

Mit diesem intuitiven Tool von Canva können Sie ganz einfach eine Schriftart auswählen und im Handumdrehen passende Kombinationsmöglichkeiten entdecken sowie ausgewählte Schriftarten in Aktion sehen. Wählen Sie einfach eine beliebige Schriftart aus dem Dropdown-Menü aus und das Tool erstellt automatisch schöne Kombinationen für Sie.

Wenn Sie mit dem Ergebnis zufrieden sind, können Sie den Vorschautext bearbeiten, um einen Eindruck davon zu bekommen, ob die Schriftart sich auch wirklich für Ihr Projekt eignet.

Ein Vorschlag von Canva Font Combinations

6) Font Combinator

Font Combinator ist ein schickes Typografie-Tool von Typotheque, ein Font Foundry und Designstudio mit Sitz in Den Haag, Niederlande. Wenn Sie auf der Suche nach einer Möglichkeit sind, Schriftkombinationen individuell anzupassen und zu testen, sind Sie hier an der richtigen Adresse.

Der Font Combinator von Typotheque.

Sie können im Dropdown-Menü oben links ein vorgefertigtes, vom Typotheque-Team designtes Schriftbild auswählen oder mithilfe der Einstellungen Ihre eigenen Kombinationen erstellen und ihren Vorstellungen entsprechend anpassen. Mithilfe des Schiebereglers über jedem Abschnitt lässt sich die Größe jeder beliebigen Textgruppe ändern. Falls Sie mit Ihrer aktuellen Kombination nicht zufrieden sind, können Sie einfach eine neue Schriftart ins Spiel bringen, indem Sie eine der verfügbaren Optionen aus der entsprechenden Liste links in die Bildschirmmitte ziehen.

7) Font Pair

Hayden Mills, Design-Student auf der Indiana University, hat dieses hilfreiche Tool ins Leben gerufen, um es Designern weltweit zu erleichtern, mithilfe von Google Fonts schnell und einfach bewährte Schriftkombinationen zu finden.

Die kategorisch geordneten Kombinationen auf Font Pair werden von Mills selbst ausgewählt. Nutzer haben jedoch die Möglichkeit, über ein auf der Seite verfügbares Google-Formular eigene Empfehlungen einzureichen. Falls Sie Ihren eigenen Text einfügen möchten, klicken Sie einfach auf eine beliebige Stelle des Beispieltexts, um diesen nach Belieben zu ändern.

Eine Schriftartenkombination auf Font Pair

Gibt es eine Schriftkombination, die es Ihnen besonders angetan hat? Hinterlassen Sie uns einen Kommentar!

Jetzt kostenlos 50 CTA-Vorlagen in PowerPoint herunterladen!

Dieser Artikel ist ursprünglich auf dem HubSpot.com-Blog erschienen und wurde aus dem Englischen übersetzt.

Themen: Marketing Agency Design Website Design

Abonnieren

Kommentare

Leider ist es nicht mehr möglich, Kommentare für diesen Beitrag zu hinterlassen, da die Kommentar-Funktion für ältere Beiträge deaktiviert wird. Natürlich ist uns Ihre Meinung dennoch wichtig! Schicken Sie uns einfach einen Tweet @HubSpot, um uns zu kontaktieren!

Kommentare
X

Ihre Konkurrenz beliest sich auch.

Bleiben Sie am Ball mit unseren Tipps unserer Marketing-Experten und sichern Sie sich Ihren Wissensvorsprung. Abonnieren Sie jetzt den HubSpot Marketing-Blog.