Welche Schrift ist das? …. Hast du dir beim Surfen auf einer Website schon mal gedacht: „Was ist das für eine schöne Schriftart? Die will ich auch!“? Auch ich höre oft von meinen Kunden, „ich möchte so eine Schriftart wie auf Seite … “ Kein Problem! Denn die Schriftart, Schriftgröße und Schriftfarbe lassen sich mit wenigen Handgriffen ganz leicht herausfinden. Ich zeige dir wie.
Hinweis: Dieses Video wird über Youtube gehostet. Wenn du das Video ansiehst, werden möglicherweise Daten von dir via Youtube erfasst. Mehr Infos in meiner Datenschutzerklärung.
YouTube

Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von YouTube.
Mehr erfahren

Video laden

Schritt für Schritt Anleitung:

So findest du die Schriftarten, Schriftgrößen und Schriftfarben von anderen Webseiten heraus:

Wenn du die Website in Chrome oder Firefox geöffnet hast, klicke auf die rechte Maustaste und gehe auf „Untersuchen“ oder „Element untersuchen.
Klicke auf den linken Pfeil mit dem Quadrat.

schrift anderer websites herausfinden

Und dann klicke gleich auf die Textstelle, dessen Schrift du wissen möchtest.

schnellstarter homepage selbst erstellen welche schrift

Es ist wichtig, dass du weißt, ob es ich um einen Fließtext (=body) oder um eine Überschrift (= h1-h6 handelt)

In der markierten Text-Ziele  liest du den Hinweis h3. (am oberen Bild, links oben im schwarzen Kasten)
In WordPress heißt das folgendes: Es gibt 6 verschiedene Überschriftengrößen…. h1 ist die größte und h6 die kleinste. Hier wird also eine mittelgroße Überschrift (h3) verwendet.

Im unteren Kasten in der rechten Spalte suchst du nach font-family = Schriftart. Da wir wissen, dass es sich um eine Überschrift handelt, müssen wir darauf achten, die Schriftart / font-family von h3 zu finden. Die erste Schriftart ist die, die verwendet wurde. die anderen sind nur Alternativen, falls die eigentliche Schriftart nicht ausgewählt wurde.

Die Schriftart lautet also: Open Sans   (font-family von h1-h6)

Im nächsten Feld siehst, du die Schriftgröße = font size von unserer h3 großen Überschrift lautet 29px.

Scrollst du noch etwas weiter runter, siehst du auch, welche Farbe die Schrift hat. Schriftfarbe = color

schriftfarbe herausfinden website

Auch die Zeilenhöhe und Abstand der Buchstaben können interessant für dich sein.
letter-spacing = Abstand zwischen den Buchstaben
line-height = Zeilenhöhe

Mit diesen Angaben (Schriftart, Schriftgröße, Schriftfarbe) hast du alles was du brauchst, wenn du eine Schrift übernehmen möchtest. Du kannst die Typographie (=Schrift) auf deiner Website mit diesen Angaben genauso einstellen.

Alternativ kannst du die Schriften in Chrome mit der Zusatz-App Whatfont herausfinden.

(erhältlich im Chrome Web Store)

Nachdem du die App bei dir in Chrome hinzugefügt hast, findest du in deiner oberen Leiste ein neues Zeichen: “ f? “ Klicke es an und fahre über die Textpassage, über die du die Infos haben möchtest. Klicke auf den Text und es öffnet sich ein schwarzes Fenster. Darin findest du alle Infos zur verwendeten Schriftart. Das sieht dann so aus:

Family: Schriftart
Style: Stil
Weight: Stärke der Buchstaben
Size: Schriftgröße
Line Height: Zeilenhöhe
Color: Schriftfarbe

Um wieder auf den normalen Cursor umzusteigen klicke wieder auf den Icon von Whatfont in der oberen Leiste. Exit ..

Wenn es dich nicht stört, eine extra App dafür zu installieren, ist das der schnellste Weg die Infos über Schriften fremder Webseiten zu bekommen.

Welches Tool verwendest du? Ich bin gespannt auf dein Kommentar!

Hol dir deine Website Checkliste

Die Checkliste enthält 16 wichtige Schritte, sowie Tool- und Anbieter-Empfehlungen. Der Fahrplan für dein Webprojekt.
Abonniere meinen Newsletter für Website Tipps für Anfänger, inkl. Checkliste, direkt in dein E-Mail-Postfach. 

Du kannst dich jederzeit vom Newsletter wieder abmelden. Infos zum Datenschutz findest du hier.

Hi, ich bin Birgit.
Bei mir geht’s um deine Website. Ich zeige dir, wie du mit WordPress, dem Divi Theme und strategischem Webdesign mehr aus deiner Website herausholst und die Technik meisterst. Damit dein Online Business durch deine Website als Dienstleister, Berater, Trainer oder Coach wächst.

Diese Beiträge könnten dich auch interessieren

"Das Wichtigste an Deiner Webseite sind die Inhalte!"   Deine Webseite lebt und gewinnt an Wert durch immer wieder neue, Weiterlesen

Hol dir den kostenlosen Website Minikurs und lerne, wie du deine Website einrichtest, wie ein Profi.   MEHR INFO Du Weiterlesen

  Anleitung "Neue Homepage erstellen" - Teil 2 Im ersten Teil dieser Blogreihe ging es darum, eine Bestandsaufnahme zu machen, Weiterlesen

So schreibst du Texte für deine Website, die deine Besucher lesen wollen.   Inhalte sind das Wichtigste an Deiner Internetseite! Weiterlesen

Teile diese Seite mit einem Klick auf: