Schriftarten-Familie - Die Grundlagen

Das erste, was den Ton unserer Typografie bestimmt, ist die Schriftart. Im Allgemeinen gibt es zwei Arten von Schriftarten - Serifen und Sans-Serifen. Der Unterschied? Die Serifenschriften haben Füße und die serifenlose Schrift nicht. Hier ist ein Beispiel

<p style="font-family:serif;">This is your browsers default serif font</p>
<p style="font-family:sans-serif;">This is your browsers default sans-serif font</p>

Es gab eine Menge Unklarheiten darüber, ob beim Entwerfen für das Web eine Serife oder eine serifenlose verwendet werden sollte, da möglicherweise Probleme mit der Lesbarkeit aufgetreten sind. Untersuchungen haben jedoch gezeigt, dass dies bei modernen Bildschirmen kein Problem ist und Sie können die Schriftart wählen die Sie tatsächlich bevorzugen.

Websichere Schriftarten - Mehr als nur Serife oder serifenlose Schrift

Wie Sie wahrscheinlich wissen, gibt es weit mehr als nur zwei Arten von Schriftarten, und alle Webdesigner haben ihre Favoriten - ich habe ein Faible für Georgia und Century Gothic, wo Sie vielleicht andere Schriftarten bevorzugen. Unter CSSfontstack.com finden Sie eine übersichtliche Liste aller Web-sichere Schriftarten und ich habe ein paar davon hier aufgenommen - oh, und sie funktionieren sowohl auf Windows als auch auf Mac!

<p style="font-family: Impact, Charcoal, sans-serif; ">Impact - a bold font</p>
<p style="font-family: Century Gothic, sans-serif; ">Century Gothic, a personal favorite</p>
<p style="font-family: Times New Roman, Times, serif; ">Times New Roman - the classic choice</p>

Festlegen der Schriftfamilie für die gesamte Seite

Um die Schriftfamilie für die gesamte Seite festzulegen, müssen Sie sie für den Hauptteil des Dokuments festlegen. Auf diese Weise wird der gesamte Text auf Ihrer Webseite in dieser Schriftart gerendert.

body {
font-family: Times New Roman, Times, serif;
}

Hier ist eine Erklärung, was dieses CSS-Snippet bedeutet: Diese Deklaration weist den Browser an, nach der Schriftart 'Times New Roman' zu suchen. Wenn dies nicht installiert ist, verwenden Sie Times. Wenn keiner der Browser eine generische Serifenschrift verwendet, die er hat.

Wie Sie sehen, haben einige der Eigenschaften mehr als einen Wert - in diesem Beispiel haben wir drei Werte verwendet. Dies liegt daran, dass der Browser einen Fallback benötigt, sollte die angegebene Schriftart nicht auf unserem Computer installiert sein. Die von Ihnen bevorzugte Schriftart ist also der erste Wert, und die Liste endet mit einem generischen Schriftartnamen, wie in diesem Fall 'serif'. Oh und bitte beachten Sie, dass alle Werte durch ein Komma getrennt sind.

Was Sie gelernt haben:

• Im Allgemeinen gibt es zwei Arten von Schriftarten: Serifen und serifenlose Schriftarten
• Einige Schriftarten gelten als websicher, und Sie sollten sich zunächst für sie entscheiden.
• Geben Sie bei der Definition von Schriftfamilien immer einen generischen Schriftnamen an, da Ihr Benutzer möglicherweise nicht die gewünschte Schrift auf seinem Gerät installiert hat.