BRANDING + WEB-SOLUTIONS
Ihre Website-Besucherinnen und -Besucher achten kaum bewusst auf die Schrift. Trotzdem prägt sie den Eindruck, den Ihre Website hinterlässt. Hier lesen Sie, wie Sie die passende Schriftart für Ihre Website auswählen und worauf Sie bei der Lesbarkeit achten sollten. Am Ende finden Sie drei fertige Kombinationen zum Übernehmen und erfahren, wo Sie kostenlose Schriften bekommen.
Der größte Teil Ihrer Website besteht aus Text. Jede Überschrift und jeder Absatz erscheint in einer Schrift, die irgendwann einmal ausgewählt wurde. Bei vielen passiert das nebenbei, weil die Vorlage (Template) schon eine Schrift mitbringt.
Genau hier entsteht der Unterschied: Eine Schrift, die Ihre Werte widerspiegelt, gibt Ihrer Website eine Haltung.
Bleibt die Voreinstellung aus der Vorlage stehen, sieht Ihr Auftritt schnell aus wie viele andere. Benennen können Ihre Website-Besucherinnen und -Besucher das nicht. Sie spüren es aber in den ersten Sekunden.
Bevor Sie sich für eine Schrift entscheiden, beantworten Sie eine Frage. Welches Gefühl soll Ihre Besucherin und Ihr Besucher haben, wenn sie oder er auf Ihrer Website ankommt? Ruhe und Qualität führen zu anderen Schriften als Klarheit und Leichtigkeit. Ist diese Frage einmal geklärt, fällt die Auswahl fast von allein.
Serifen sind die kleinen Füßchen an den Buchstaben, so wie in einem gedruckten Buch. Sie wirken ruhig und bringen etwas Handwerkliches mit. Serifenlose Schriften wie Montserrat oder Open Sans wirken dagegen klar und modern.
Für kreative Arbeit hat sich diese Aufteilung bewährt:
In die Übeschriften kommt eine Serifenschrift und in den Fließtext eine serifenlose.
Ihre Überschrift bekommt dadurch mehr Ausdruckskraft und Ihr Text bleibt auch in kleiner Größe gut lesbar. Serifenlose Schriften sind für den Fließtext einer Website besonders gut geeignet, da sie auf allen Bildschirmgrößen gut lesbar sind.
Auf manchen Websites sind zu viele Schriften im Einsatz. Das passiert leicht, weil die einzelnen Bausteine einer Vorlage ihre eigenen mitbringen. Unruhig wirkt die Website dadurch in jedem Fall.
Mit zwei Schriften sind Sie auf der sicheren Seite. Eine für Ihre Überschriften und eine für den Fließtext. Eine dritte kommt nur als Akzent für wenige Wörter dazu, etwa für ein Zitat oder einen kurzen Leitsatz.
Wichtig ist, dass sich die beiden Schriften deutlich voneinander unterscheiden. Zwei ähnliche Schriften nebeneinander wirken wie ein Versehen. Je deutlicher sich Überschrift und Fließtext unterscheiden, desto ruhiger wird das Gesamtbild.
Die schönste Schrift nützt Ihnen wenig, wenn Ihre Besucherinnen und Besucher am Handy den Text kaum lesen können.
Vier Werte bringen Sie hier weiter:
Praxistipp: Öffnen Sie Ihre Startseite am Handy und halten Sie es ca. 30 Zentimeter von sich weg. Wenn Sie jetzt die Augen zusammenkneifen, ist Ihre Schrift zu klein.
Cormorant Garamont, eine feine Serifenschrift für die Überschriften,
Didot setzt die Akzente und
Poppins Light übernimmt den Fließtext.
Das passt zu einem Online-Auftrittt, der für Qualität und Wertigkeit steht. Die Kombination hält sich zurück und hat trotzdem Haltung.
Lustria für die Überschriften und
Montserrat Light für den Fließtext.
PT Script Zephyr kommt als handschriftlicher Akzent dazu, sparsam eingesetzt.
So sieht Ihre Website auch in ein paar Jahren noch frisch aus. Diese drei Schriften nutze ich selbst für meine Marke.
Zwei Klassiker, die auf nahezu jedem Gerät vorhanden sind und entsprechend schnell laden.
Georgia wirkt seriös und warm zugleich.
Open Sans bleibt in jeder Größe gut lesbar.
Eine gute Wahl, wenn Ihre Website vor allem Vertrauen aufbauen soll.
Bei Frau Dolnicek von raumimpulse haben wir genau diesen Wechsel gemacht. Ihre Website lief technisch sauber und fühlte sich für sie trotzdem fremd an. Stimmig war das Gesamtbild nicht.
Zuerst haben wir uns ihre Unternehmens-Werte und die Gesamtstimmung für ihre Website angeschaut. Mit diesem Wissen haben wir die Überschriften auf Georgia umgestellt und den Fließtext auf Open Sans. Zusammen mit den angepassten Farben und dem Bildstil hat sich die Stimmung der gesamten Website in die Richtung gedreht, die ihr vorschwebte. Seitdem erkennt sie ihre eigenen Werte darin wieder und sie fühlt sich auch nach ihr an.
Kostenlose Schriften für Ihre Website finden Sie direkt in Ihrem Baukasten und zusätzlich bei Google Fonts, einer großen Sammlung kostenfreier Schriften zum freien Einsatz im Internet. Die meisten Baukasten-Systeme bringen eine Auswahl mit, die Sie direkt im Bearbeitungsmodus anklicken. Bei Wix und Squarespace gehören die Google Fonts dazu. Jimdo arbeitet mit einer kleineren Auswahl.
Bei Google Fonts gibt es einen Haken, den viele übersehen. Bindet Ihr Baukasten die Schriften direkt von den Servern von Google ein, wird dabei die IP-Adresse Ihrer Besucherinnen und Besucher übertragen.
Das ist in der DSGVO geregelt und Sie müssen es abdecken.
Dafür haben Sie zwei Wege:
Welcher Weg für Sie passt, hängt von Ihrem Baukasten ab. Wenn Sie rechtlich unsicher sind, lassen Sie Ihre Datenschutzerklärung einmal fachkundig prüfen.
Fehlt Ihre Wunschschrift, können Sie sie in vielen Systemen selbst hochladen. In Wix laden Sie Ihre eigene Schrift direkt im Bearbeitungsmodus hoch. Squarespace hat den Platz dafür in den Website Styles. Jimdo lässt das nur eingeschränkt zu und es hängt zusätzlich vom gebuchten Tarif ab. Dort brauchen Sie außerdem Kenntnisse in CSS, also in der Sprache, die das Aussehen einer Website steuert.
Wenn Sie eine Schrift kaufen, prüfen Sie vorher die Lizenz. Eine Schrift, die Sie einmal für ein gedrucktes Logo gekauft haben, darf nicht automatisch auch auf Ihrer Website laufen. Dafür brauchen Sie eine eigene Lizenz für die Nutzung im Internet.
Die Schrift ist einer von fünf Punkten, die Ihre Website hochwertig wirken lassen. Alle fünf habe ich in dem Leitfaden „Hochwertige Website“ für Sie zusammengefasst, den Sie sich außerdem kostenfrei herunterladen können.
Zum Leifaden "Hochwertige Website"
Bildrechte: Ina Weißflog, mit Unterstützung von ChatGPT
Auf meinem Blog teile ich praxisnahes Wissen zu Website Planung, Branding und modernen Homepage-Baukästen. Bei Beratungen und Workshops zeige ich, wie aus einer Idee ein hochwertiger Online-Auftritt entsteht, der Vertrauen schafft und Kund*innen gewinnt.
Gern unterstütze ich Sie auch bei der Umsetzung oder Weiterentwicklung Ihres Webprojekts.
Erfahren Sie mehr "Über Mich", buchen Sie ein kostenfreies Erstgespräch oder vernetzen Sie sich mit mir auf LinkedIn, Instagram, Facebook oder Pinterest für weitere Tipps rund um Branding und Ihren hochwertigen Online Auftritt.
Ich freue mich darauf, Sie auf Ihrer Reise zu begleiten.
Herzlichst,