Haben Sie jemals die perfekte Schriftart für Ihre Website auf einer anderen Website, einem anderen Bild oder einem anderen Blog gefunden, wussten aber nicht, wie Sie den Namen finden sollen? Sie sind an der richtigen Stelle. In diesem Leitfaden zeigen wir Ihnen, wie Sie Schriftarten auf einer Website identifizieren, um die perfekte Typografie für Ihr Unternehmen zu finden.

Warum ist es sinnvoll zu sehen, welche Schriftarten eine Website verwendet?

Wenn Sie an der Erstellung Ihrer Website oder der Gestaltung Ihrer Online-Inhalte arbeiten, sind Sie immer auf der Suche nach Möglichkeiten, diese zu verbessern. Sie können das auf viele Arten tun. Die offensichtlichsten sind die Verwendung eines anderen Themas, das Hinzufügen von Funktionen und das Bereitstellen besserer Inhalte. Aber es gibt andere nicht so offensichtliche Dinge, die Sie tun können, um einen Vorteil gegenüber Ihren Mitbewerbern zu haben und Ihre Website einzigartig zu machen. Die Schriftart ist eine davon.

Die Schriftart, die Sie verwenden, ist überall auf Ihrer Website und kann nicht nur die Lesbarkeit, sondern auch die allgemeine Navigation verbessern. Wenn Ihre Typografie professionell aussieht und leicht zu lesen ist, bleiben Ihre Besucher eher auf Ihrer Website. Schriften werden oft übersehen, können aber große Auswirkungen haben.

Obwohl Sie Ihrer Website Schriftarten hinzufügen können, möchten Sie möglicherweise Typografie verwenden, die Sie auf herkömmliche Weise nicht finden. Das Internet ist voll von Websites mit schöner Typografie, die Sie auf Ihrer Website verwenden möchten. Der schwierige Teil besteht jedoch darin, die Schriftarten zu identifizieren, die diese Websites verwenden. Es gibt keine einfache Möglichkeit, eine Schriftart zu finden, und selbst wenn Sie ein Experte sind, gibt es in jeder Schriftart unzählige winzige Unterschiede. Darüber hinaus können diese Unterschiede durch Schriftstile und CSS-Änderungen verstärkt werden.

Deshalb zeigen wir Ihnen in diesem Beitrag, wie Sie mit verschiedenen Tools herausfinden, welche Schriftarten eine Website verwendet.

So identifizieren Sie Schriftarten von einer Website

Es gibt mehrere Möglichkeiten, Schriftarten auf einer Website zu identifizieren:

1. Verwenden des Inspect-Tools
2. Mit Plugins
   1. FFFFallback
   2. Fount
   3. Fontanello
   4. Welche Schriftart

Einige davon sind schwieriger zu verwenden als andere und einige erfordern möglicherweise externe Tools und Erweiterungen. Schauen wir uns all diese verschiedenen Methoden genauer an.

1) Identifizieren Sie Schriftarten mit dem Inspect-Tool

Die einfachste Möglichkeit, Schriftarten auf einer Website zu identifizieren, besteht darin, das Inspect-Tool des Browsers zu verwenden. Dazu müssen Sie die Entwicklertools Ihres Browsers öffnen. Normalerweise können Sie dies auf verschiedene Arten tun:

• Drücken von F12 oder Strg + Umschalt + I in Ihrem Browser
• Öffnen Sie das Menü des Browsers mit der rechten Maustaste und gehen Sie dann zu Inspect
• Öffnen Sie die Entwicklertooloptionen im Menü des Browsers und gehen Sie zu Web Developer

Wenn Sie eine Schriftart gefunden haben, die Ihnen gefällt, klicken Sie mit der rechten Maustaste auf den Text, der die Schriftart enthält, die Sie identifizieren möchten, und klicken Sie auf Element prüfen.

Dieses Element wird im Inspektor-Tool hervorgehoben, und Sie sehen die Stile und Layouts in den Feldern neben dem Inspektor.

Klicken Sie dann auf die Registerkarte Berechnet und scrollen Sie nach unten, um das Feld Schriftfamilie zu überprüfen. Dieses Feld sollte die Schriftart der Website auflisten. In diesem Beispiel ist die Schriftart beispielsweise Roboto oder SF-Pro Display.

Auf diese Weise können Sie Schriftarten auf jeder Website mithilfe des Inspector-Tools identifizieren. Möglicherweise finden Sie jedoch Websites, auf denen Sie nicht mit der rechten Maustaste klicken oder auf das Inspektor-Tool zugreifen können, da sie dies nicht zulassen. Wenn das der Fall ist, gibt es eine andere Alternative. Sie können auch sehen, welche Schriftart die Website mit einem speziellen Tool verwendet.

Schauen wir uns einige der besten Plugins an, mit denen Sie Schriftarten auf einer Website identifizieren können.

2) Identifizieren Sie Schriftarten mithilfe von Tools und Plugins

Wenn Sie das Inspector-Tool auf einer Website nicht verwenden können, identifizieren Sie Schriftarten mithilfe spezieller Tools und Plugins. Um Ihnen das Leben zu erleichtern, listen wir die besten auf und zeigen Ihnen, wie Sie damit Schriftarten finden und erkennen können, die auf verschiedenen Websites verwendet werden.

2.1) FFFFallBack

FFFFallback ist ein einfaches Bookmarklet-Tool, mit dem Sie Schriftarten auf jeder Website identifizieren können. Und das Beste daran ist, dass Sie nichts installieren müssen. Sie müssen lediglich das Bookmarklet auf Ihrer Registerkarte Lesezeichen speichern und auf das Lesezeichen auf einer beliebigen Site klicken, um die Schriftarten zu überprüfen. Das Tool verwendet Javascript, um das CSS zu scannen und die Typografie sowie den Schriftstil zu identifizieren.

Um dieses Tool zu verwenden, müssen Sie diese Seite öffnen. Klicken Sie dann auf die Schaltfläche FFFFALLBACK und ziehen Sie sie wie unten gezeigt in Ihre Lesezeichenleiste. Wenn die Lesezeichenleiste in Ihrem Browser nicht angezeigt wird, drücken Sie Strg + Umschalt + B, um sie zu aktivieren.

Öffnen Sie nun eine Website, auf der Sie Schriftarten identifizieren möchten, und klicken Sie auf das Lesezeichen, das Sie gerade in Ihrer Lesezeichenleiste gespeichert haben. Es sollte Ihnen die Schriftfamilie und den Stil der Website in einer neuen Spalte anzeigen, wie unten gezeigt. Stellen Sie sicher, dass Sie Web Font als Option oben auswählen.

2.2) Fount

Fount ähnelt FFFFALLBACK, aber Sie können auch Schriftarten bestimmter Texte überprüfen. Auf diese Weise können Sie festlegen, für welche Texte Sie die Schriftarten überprüfen möchten.

Um Fount zu verwenden, rufen Sie diese Site auf und speichern Sie das Bookmarklet von der Website, indem Sie es auf die Registerkarte Lesezeichen ziehen.

Öffnen Sie dann eine beliebige Website, für die Sie die Schriftarten überprüfen möchten, und klicken Sie auf das Fount-Lesezeichen. Dadurch wird Ihr Cursor in ein Plus geändert. Klicken Sie einfach auf einen beliebigen Text, und es wird Ihnen die identifizierte Schriftart oben rechts auf Ihrem Bildschirm angezeigt.

Nachdem Sie die Schriftart für diesen Text kennen, können Sie erneut auf das Schriftfeld klicken, um den Cursor zu deaktivieren und Ihre Seite wie gewohnt zu durchsuchen.

2.3) Fontanello

Wenn Sie Browsererweiterungen verwenden möchten, ist Fontanello das perfekte Werkzeug, um Schriftarten auf jeder Website zu identifizieren. Installieren Sie einfach die Fontanello-Erweiterung in Chrome oder Firefox und aktivieren Sie sie.

Um Schriftarten auf einer Website zu identifizieren, klicken Sie einfach mit der rechten Maustaste auf einen beliebigen Text und wählen Sie die Option Fontanello. Das Dropdown-Menü zeigt Ihnen die Schriftfamilie sowie deren Stil und Varianten.

2.4) Welche Schriftart

Alternativ können Sie die WhatFont-Erweiterung auf ähnliche Weise verwenden. Installieren Sie zuerst die Erweiterung in Chrome oder Firefox. Klicken Sie dann auf das WhatFont-Toolsymbol in der Symbolleiste Ihres Browsers und klicken Sie auf einen beliebigen Text, um die Schriftart zu überprüfen. Das Gute ist, dass Sie verschiedene Texte auswählen und sehen können, welche Typografie sie gleichzeitig verwenden.

Wenn Sie fertig sind, drücken Sie WhatFont beenden, um die Schriftarten-Popups zu schließen und die Webseite wie gewohnt zu verwenden.

Nachdem wir nun gesehen haben, wie Schriftarten aus Text identifiziert werden, fragen Sie sich vielleicht, ob es möglich ist, dasselbe aus Bildern zu tun. Die Antwort ist ja! Mal sehen, wie das geht.

So identifizieren Sie Schriftarten aus einem Bild

Neben der Erkennung von Schriftarten aus Text können Sie auch Schriftarten aus einer Website anhand der Bilder identifizieren. Dazu verwenden wir ein Online-Tool namens WhatTheFont.

What The Font

Mit diesem Online-Tool können Sie ein beliebiges Bild hochladen, den Text des Bildes analysieren und Ihnen mitteilen, welche Schriftart verwendet wird.

Gehen Sie dazu auf diese Seite und ziehen oder laden Sie das Bild auf das Werkzeug hoch (stellen Sie sicher, dass es im JPG- oder PNG-Format vorliegt.) Definieren Sie dann das Zuschneidefeld für den Text, und das Werkzeug zeigt Ihnen die richtige Schriftart des Textes an. Darüber hinaus bietet WhatTheFont Ihnen auch Websites, auf denen Sie die Schriftarten kaufen und sogar die Schriftarten mit Ihrem benutzerdefinierten Text testen können.

Auf diese Weise können Sie Schriftarten aus Bildern oder Screenshots überprüfen. Darüber hinaus verfügt es über eine mobile App, mit der Sie Schriftarten auch von Ihrem Handy aus identifizieren können.

Fazit

Alles in allem kann die von Ihnen verwendete Schriftart einen großen Einfluss auf Ihre Website haben. Es kann Ihnen helfen, die Lesbarkeit und die allgemeine Navigation zu verbessern und Ihre Besucher länger dort zu halten. Klarheit und Lesbarkeit sind wichtige Aspekte jeder Website, und je mehr Aufwand Sie betreiben, desto besser sind die Ergebnisse.

In diesem Handbuch haben wir verschiedene Möglichkeiten gesehen, Schriftarten von einer Website zu identifizieren:

• Verwenden des Browser-Inspect-Tools
• Verwenden der Bookmarklet-Tools
• Über Browsererweiterungen
• Verwenden spezieller Online-Tools zum Identifizieren von Schriftarten aus Bildern

Sobald Sie die richtigen Schriftarten gefunden haben, müssen Sie entscheiden, wie Sie sie Ihrer Website hinzufügen möchten. Sobald Sie die Typografie ausgewählt haben, die Sie verwenden möchten, empfehlen wir Ihnen, sich unsere Anleitung zum Ändern der Schriftart in WordPress anzusehen, um in kürzester Zeit zu Ihrer neuen Schriftart zu wechseln.

Wenn Sie nach weiteren Möglichkeiten suchen, die Lesbarkeit und Navigation auf Ihrer WordPress-Site zu verbessern, können Sie sich auch diese Artikel ansehen:

• So fügen Sie Breadcrumbs in WordPress hinzu
• Organisieren Sie WooCommerce-Produkte nach Marke
• So fügen Sie ein WordPress-Mega-Menü hinzu