Oster-Aktion: 20% Cashback auf Neubestellungen!

Bis 06. April 2026

Promocode
Ostern2026
Status

/

/

Webfonts: Tipps und Tricks für die perfekte Auswahl

Webfonts: Tipps und Tricks für die perfekte Auswahl

Veröffentlicht am 18. März 2022
  5 Min. Lesezeit
  Aktualisiert am 16. Oktober 2024

Das Zentrum einer Website ist die Typografie. Mittels Wörtern, Absätzen und Zahlen informierst du die Leserschaft über die neusten Nachrichten, zeigst, wie man den perfekten Zopf bäckt oder welche Dienstleistungen dein Unternehmen anbietet. Damit du deinen Websiteinhalt perfekt in Szene setzen kannst, zeigen wir dir, wie du die passende Webfont für deine Website auswählst.

Webfonts: Tipps und Tricks für die perfekte Auswahl

Inhalt

Was ist ein Schriftschnitt und wofür wird er verwendet?

Viele Schriftarten im Web (auch «Webfonts» genannt) sind in verschiedenen Schriftschnitten und Stilen erhältlich. Unter einem Schriftschnitt versteht man die Variation einer Schrift. Damit kannst du deinen Text fett oder kursiv darstellen, ohne dass du zu einer zweiten Schrift greifen musst.

Damit du bei Schriftschnitten den Überblick behältst, zeigen wir dir nachfolgend auf, was du unter Bezeichnungen wie «Thin» und «Extra Bold» erwarten kannst:

Die Zahl in Klammern haben dieselbe Bedeutung wie die Begriffe davor, einfach in Form von Zahlen. Diese Zahlen werden hauptsächlich von Schriftdesignern und Webentwicklern verwendet.

Es kann auch vorkommen, dass deine Lieblingsschriftart nur in einem Schriftschnitt existiert. Dann benötigst du eine weitere Schriftart. Das bringt uns zum nächsten Punkt.

Wie viele Webfonts soll ich auf meiner Website verwenden?

Mehrere Schriftarten auf der gleichen Website zu verwenden ist keineswegs verboten, im Gegenteil! Um deine Leserschaft angenehm durch deine Website zu navigieren, solltest du dir unbedingt überlegen, welche Textarten du in welcher Form benötigst. Aber Achtung: Die Verwendung zu vieler Schriftarten endet im Chaos.

Beachte folgende Regel, damit es auf deiner Website harmonisch aussieht:

  • 1 Schriftart: gut – wenn viele Schriftschnitte verfügbar sind
  • 2 Schriftarten: gut – wenn die beiden Schriften harmonieren (siehe weiter unten)
  • 3 Schriftarten: nur, wenn zwingend nötig
  • Mehr als 3 Schriftarten: nicht zu empfehlen

Doch wie entscheidest du dich für eine zweite Schriftart, damit sie mit der Ersten harmoniert?

Beachte dafür folgende Tipps:

  • Kombiniere eine Serifen-Schrift mit einer Serifenlosen-Schrift
  • Vermeide zu ähnliche Schriftkombinationen (z.B.)
  • Achte darauf, dass die Webfonts auch in Kombination mit verschiedenen Farbkontrasten gut lesbar sind
  • Kombiniere eine verspielte Schriftart mit einer neutralen Schriftart
  • Verwende eine Schrift für Headlines und die andere für Fließtext

Falls du dir nicht sicher bist, ob deine gewählten Webfonts auf Desktop und auf Mobile wirklich gut lesbar sind, dann beachte unsere nachfolgenden Tipps zur perfekten Auswahl deiner Schrift.

Welche Schriftart passt zu meiner Website?

Jede Schriftart ist auf ihre Weise einzigartig. Daher solltest du neben Schriftschnitten und Schriftkombinationen besonders darauf achten, dass die Schrift grundlegend für deine Website geeignet ist.

Dabei ist es entscheidend, dass deine Schrift in jeder Situation für den Leser angenehm lesbar ist und dabei den Inhalt verständlich vermittelt.

Fun Fact: Die Innenflächen eines Buchstaben nennt man «Punze».
Diese Punze wird unterschieden in:

  • geschlossene Punzen, wie z. B. bei Buchstaben wie b, d, p oder q
  • offene Punzen, wie z. B. bei Buchstaben wie h, m, n oder u

Die Checkliste für deine Auswahl:

  • Bleib deinem Webdesign treu. Bei einer Website für eine Anwalts-Kanzlei solltest du beispielsweise auf unpassende Schriften verzichten und dich eher auf klassische Schriftarten konzentrieren.
  • Achte auf gute Lesbarkeit – auch bei kleiner Schriftgröße. Besonders wichtig sind dabei Buchstaben mit kleinen Punzen, die bei kleiner Schriftgröße nicht mehr gut lesbar sind. Beispiele dafür sind Buchstaben wie a, c, e, g oder s.
  • Die Buchstaben «i/I» und «l/L» müssen sich in ihrer Groß- und Kleinschreibung genügend unterscheiden. Teste dies, indem du ein großes «i» und zwei kleine «L» aneinander stellst, so dass «Ill» entsteht.
  • Stelle sicher, dass deine Schriftart alle gewünschten Zeichen enthält. Beispiel: #, ( ), ?, !, ä, ö, ü, %

Wenn du Webfonts aus dem Internet herunterlädst, ist es empfehlenswert den folgenden Abschnitt zum Thema Lizenzen anzusehen.

Wo finde ich die passende Schriftart?

Es gibt viele Plattformen, bei welchen du deine passende Schrift herunterladen kannst. Wichtig dabei ist es, dass du dich an die Lizenzregeln hältst. Wenn du Schriften bei Google Fonts herunterlädst, musst du dich nicht weiter um Lizenzen kümmern. Diese Webfonts sind Open Source und dürfen für den privaten und kommerziellen Zweck frei eingesetzt werden.

Schwieriger wird es, wenn du eine Schriftart bei Plattformen wie Adobe Fonts, MyFonts oder DaFont herunterlädst. Da musst du aufpassen, wie du die Webfont verwenden darfst. Lies dazu die entsprechenden Lizenzbestimmungen genau durch und halte dich daran.

Hier zum Thema Lizenzen eine kleine Übersicht:

  • Beachte immer die Lizenz und deren Bedingungen (privater oder kommerzieller Zweck, Anzahl erlaubter Zugriffe etc.)
  • Google Fonts sind Open Source und frei zur Verwendung
  • Kostenpflichtige Dienste: Adobe Fonts, MyFonts

Wenn du dir keine Gedanken zum Webfonts-Download und deren Lizenzen machen möchtest, empfehlen wir die Verwendung eines Homepage Baukastens. Da sind viele Schriftarten bereits vorinstalliert.

Tipp: Hast du eine tolle Schrift auf einer Website gesehen und möchtest sie auch für deine Website verwenden? Mit dem Plugin Fonts Ninja findest du schnell und einfach heraus, um welche Schrift es sich handelt.

Welche Vorteile bietet ein Homepage Baukasten?

Ein Homepage Baukasten wie unser selbst entwickelter Website Creator kommt mit einer großen Anzahl an Schriftarten daher und deckt ein breites Spektrum an Geschmäckern ab.

Im Website Creator wurden alle erhältlichen Schriften von uns ausführlich geprüft und mit Bedacht ausgewählt. Dazu haben wir die Schriften auf verschiedensten Endgeräten wie Desktop, Tablet oder Mobile getestet, damit deine Texte immer gut aussehen.

Der große Vorteil: Sämtliche Schriften sind frei verwendbar. Du musst dich um keine Lizenzen kümmern!

Außerdem werden laufend neue Schriftarten von uns geprüft und im Website Creator zur Verfügung gestellt. Damit sind deiner Kreativität auch in Zukunft keine Grenzen gesetzt.

Teste den Website Creator jetzt kostenlos!

Fazit

90 % im Web besteht aus Typografie – deswegen ist die Auswahl deiner Webfont entscheidend. Eine gut optimierte, stark bei Google positionierte und wunderschön gestaltete Website nützt letztlich nichts, wenn der Inhalt kaum lesbar ist.

Der Gesamteindruck der Website und des Unternehmens verändert sich massiv, wenn eine unpassende Schrift gewählt wird.

Jede Schrift ändert den Gesamteindruck der Website
Ohne Typografie, wäre das Web ziemlich leer

Neben genügend Schriftschnitten, Sonderzeichen und harmonischen Kombinationen, ist es auch entscheidend, seinem Webdesign treu zu bleiben.

Hier geht’s zum ultimativen Webdesign-Guide.

Hier findest du alles zu den Webdesign-Trends 2022.

Inhalt

Artikel teilen

Link kopieren

Artikel teilen

Link kopieren
Bild von Cédric Juan

Developer & UX    17 Artikel

530
Kategorie
Illustration zur NIS2-Richtlinie EU, zeigt Schild mit Schloss-Symbol vor EU-Flagge. Zur Cybersicherheit für Domains und Registrare in der DACH-Region

Cyberangriffe auf Unternehmen, Behörden und kritische Infrastrukturen nehmen weltweit zu. Die Europäische Union reagierte darauf mit einem umfassenden Regelwerk: der NIS-2-Richtlinie. Was zunächst wie ein rein technisches Thema für große Konzerne klingt, hat auch handfeste Konsequenzen für Domaininhaber und Registrare in Deutschland, Österreich und der Schweiz. Dieser Beitrag gibt einen Überblick.

Aufnahme aus dem unterirdischen Datacenter DATAROCK von hosttech. Ein langer Gang mit verschlossenen Server-Racks auf beiden Seiten.

AWS und Azure dominieren den Cloud-Markt. Doch wer seine Daten einem US-amerikanischen Hyperscaler anvertraut, geht ein oft unterschätztes Risiko ein. Echte Datensouveränität lässt sich aufgrund des CLOUD Acts nicht garantieren. Zum Glück hat sich in den letzten Jahren ein starkes europäisches Cloud-Ökosystem entwickelt, das den Vergleich mit den großen Hyperscalern nicht scheuen muss. Wir zeigen, worauf es bei der Wahl eines Cloud-Providers wirklich ankommt, und stellen die überzeugendsten europäischen Alternativen zu AWS und Azure vor.

Nahaufnahme eines Rootservers

Heute ist internationaler Recycling Day und wir finden, auch Server-Hardware verdient eine zweite Chance! Denn auch für Rootserver gilt: Neuer ist nicht automatisch gleich besser. Bei unseren Restpostenservern findest du hochwertige Server-Hardware etwas älterer Generationen zu günstigen Preisen. Reinschauen lohnt sich!

Achtung: Zurzeit werden Phishing E-Mails mit gefälschtem hosttech-Absender versendet. Bitte komme keiner Forderung nach und lösche diese E-Mails.

Screenshot der hosttech-Website mit SSL-Zertifikate-Seite auf einem Laptop, daneben ein 3D-Kalender mit den Zahlen 47 und 398 Tage, symbolisiert die künftig kürzeren Laufzeiten von SSL/TLS-Zertifikaten.

Seit Jahren sind SSL/TLS-Zertifikate das Rückgrat des verschlüsselten Webs. Jetzt wird ihre maximale Laufzeit drastisch verkürzt – von 398 auf künftig nur noch 47 Tage. Was steckt hinter diesem Entscheid, und was ändert sich konkret für dich als hosttech-Kunde?

Headerbild zum Blogbeitrag über neue Begriffe wie GEO, AEO und LLMO. Titel in weißer Schrift: SEO vs. GEO Darunter ist eine Suchmaske zu sehen, in der steht "Suchbegriff eingeben" Unterhalb der Suchmaske ist links eine menschliche Hand zu sehen und rechts eine Roboterhand. Die beiden Hände strecken die Fingerspitzen zueinander aus.

In der digitalen Welt verändert sich die Suche gerade grundlegend. In den letzten Jahren gewinnen neue Konzepte und Begriffe an Bedeutung, die weit über klassische SEO hinausgehen. Für dich als Website-Betreiber, KMU oder Marketer ist es wichtig zu verstehen, was diese neuen Begriffe bedeuten, wie sie sich voneinander unterscheiden und wie du deine Inhalte 2026 sichtbar machst – sowohl für Menschen als auch für KI-gestützte Systeme.

Alexander M. Hefele, CEO von AMZ Racing, sitzt in der AMZ Werkstatt und erklärt, weshalb sein Team auf die Cloud-Lösung von hosttech setzt. Hinter ihm sind zwei Renn-Boliden von AMZ zu sehen. Rechts im Bild die Logos von hosttech und AMZ.

AMZ Racing ist das Formula Student Team der ETH Zürich. Aktuell steht das Team an der Spitze der Weltrangliste. Zudem hält es seit 2023 den Weltrekord für die schnellste Beschleunigung von 0 auf 100 km/h mit einem Elektrofahrzeug. hosttech unterstützt AMZ Racing seit einigen Jahren mit Cloud-Computing-Ressourcen im virtual Datacenter. In einer dreiteiligen Video-Serie gibt das AMZ-Team Einblick in seine Arbeit und zeigt, wie es unsere Cloud-Lösung einsetzt, um seine Fahrzeuge laufend zu optimieren.

myhosttech Kundencenter