So kombinierst du Schriften
auf deiner Website
und in Social Media

Schriften spielen viel zu oft eine untergeordnete Rolle auf Website und Social Media. Dabei komplettieren sie den Look, den Du mit Farben und Bildern herstellst und machen Dein Branding einzigartig. Erfahre hier, welche Schriftpaare auf Website und in Social Media zeitlos und schwer angesagt sind.

Es war noch nie so leicht, aus einem schier unendlichen Fundus an Fonts die passende Schrift für die eigene Website auszuwählen. Doch gerade diese Auswahl macht es so schwierig. Es gibt allein über 2.000 Google Fonts, die kostenlos heruntergeladen werden und sofort genutzt werden können.

Hast Du bei einer einzelnen Schrift schon einmal ganz nach unten gescrollt? Neben den Infos zum Designer und der Wirkung der Schrift findest Du hier passende weitere Schriften, die Du als Überschrift und Fließtext ausprobieren kannst.

Auch 2020 kannst Du eine Serifen-Schrift mit einer klaren Sans Serifen-Schrift kombinieren. Du musst es aber nicht. Auch in Sachen Schriften gilt: Es gibt (fast) keine Regeln.

Hier findest Du die Schrift für deine Website

Schriften für deine Website - so kombinierst du Playfair Display

Playfair Display und Source Sans Pro.

Dies war 2019 die Top-Kombination auf Websites. Mit ihrem traditionellen Stil ist Playfair Display sowohl elegant als auch zeitlos. Die Schrift von Claus Eggers Sorense kann mit einer Vielzahl serifen-loser Schriften kombiniert werden. Source Sans Pro stellt mit ihren klaren Linie einen schönen Kontrast zur stylischen Playfair her.

Schriftkombination Miso und Open Sans

Miso und Open Sans.

Ohne Ecken und Kanten kommt die klare Miso daher und gleichzeitig setzt die architektonische Schrift von Mårten Nettelbladt ein eindeutiges Statement. Um die Schrift als Webfont zu nutzen, brauchst Du eine Lizenz www.fontspring.com. Hierzu passt die clean und neutrale Open Sans von Steve Matteson bestens.

Plane, erstelle und gestalte deine Business-Website so, dass du online sichtbar wirst und direkt deine WunschkundInnen anziehst!

Website Academy
Website Academy
So kombinierst du Roboto mit einer starken Font für deine Headlines

Elsie und Roboto

Elsie ist mit ihren sanften Serifen und fließenden Lettern eine bezaubernde Schrift. Sie ist modern, weiblich und ein absolutes Business-Statement. Zusammen mit der leichtgewichtigen Roboto spielt Elsie die Hauptrolle, ohne sich in den Vordergrund zu drängen.

Schriften für deine Website

Lora und Montserrat

Einen Hauch Hollywood-Glamour bringt die Serifen-Schrift Lora mit sich. Die Schrift hat ihre Wurzeln in der Kaligraphie und kann sowohl als Überschrift als auch als Fließtext genutzt werden. Perfekt zur Lora passt die beliebte Schrift Montserrat im urbanen Style.

Setze mit deinen Fonts ein Statement auf deiner Website

Merriweather und Quicksand

Die Merriweather wurde speziell für die Darstellung auf Monitoren entwickelt. Sie bringt viele verschiedene Schriftschnitte mit und ist so auch allein universell einsetzbar. Als Schriftpaar zusammen mit der Quicksand kommt das Kantige sehr gut zum Vorschein. Die Quicksand setzt mit ihren Rundungen einen starken Kontrast.

Klassische Fonts für deine Website

Vollkorn und DIN Alternate

Die 2005 von Friedrich Althausen entwickelte Schrift ruhige und bescheidene Schrift Vollkorn ist mit ihren hüpfenden Serifen zeitlos in der Tradition der Brotschrift. Als Schriftpaar sind Vollkorn und DIN Alternate nahezu unschlagbar.

So kombinierst du Roboto und Poppins

Roboto und Poppins

Das mechanische Skelett und die großen geometrischen Formen der Roboto machen die Schrift zu einem freundlich geschwungenen Erlebnis. Die ebenfalls geometrische Poppins  mit ihren fast monolinearen Formen ist die perfekte Ergänzung zur Roboto.

Fonts kombinieren auf deiner Website

Saira und Maven Pro

Mit der Saira setzt Du ein starkes Statement auf deiner Website und in deinen Social Media-Posts. Als serifenlosen Schrift wirkt sie modern und kann in allen Medien sowohl als Headline als auch als Fließtext genutzt werden. Die klare Maven Pro bringt die versteckten Stärken der Saira zum Vorschein.

Typographie: So kombinierst du Fonts

Philosopher und PT Sans

Die universell einsetzbare Philosopher von Jovanny Lemonad ist schwer in Worte zu fassen. Die Buchstaben scheinen zu tanzen und sind zugleich klassisch. Die PT Sans basiert auf russischen serifenlosen Schriften und rückt mit ihrem Stil nahe an zeitgenössisches, humanistisches Design.

Typographie: So kombinierst du Fonts

Anton und Oswald

Diese Schriften hat Vernon Adams entwickelt. Die Webfont Anton basiert auf traditionellen Werbeschriften und wurde speziell für die Darstellung im Internet geformt. Mit der Oswald schuf er eine klassisch-historische Schrift im Sinne der „Alternate Gothic“. Als Schriftpaar sind Anton und Oswald „partner in crime“, Freunde fürs Leben.

Typographie: So kombinierst du Fonts aus einer Schriftfamilie

Noto Serif und Noto Sans

Die Schriftfamilie Noto wurde von Google entwickelt, um Darstellungsfehler von Schrift im Web zu eliminieren. Serifen und serifenlosen Schriften aus der Noto-Familie lassen sich in nahezu allen Sprachen zu außergewöhnlichen Looks kombinieren.

Typographie: So kombinierst du Fonts

Rokkitt und Ubuntu

Rokkitt steht in der Tradition unverwechselbarer Slab-Serifen, die im späten 19. Jahrhundert populär waren. Die ultramoderne Ubuntu setzt einen logischen Kontrast zur starken Rokkitt und holt das Schrift-Design damit ins Hier und Jetzt.

Typographie: So kombinierst du Fonts

Fira Code und Heebo

Eigentlich als Programmier-Schrift entwickelt, macht sich Fira Code in Kombination mit der cleanen Heebo aus, das Netz auch im sichtbaren Bereich zu erobern. 

Wie du siehst:

Mit Schriften kannst du dein gesamtes Webdesign abrunden, dein Thema untermauern und deine Zielgruppe begeistern.

Weitere tolle Schriftpaare findest du auf fontpair.co.

Hast du eine wundervolle Schrift gesehen und weißt nicht, welche Schrift es ist: Auf WhatTheFont kannst du es herausfinden.

Übrigens brauchst Du keine zwei Schriften:

du kannst mit einer Schrift mit unterschiedlichen Schriftschnitten für den Wow-Effekt sorgen.

2 Antworten

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Diese Beiträge könnten dir auch gefallen: