Sie sind hier: Startseite -> CSS-Grundlagen -> Textformatierung -> Schriftart

CSS-Grundlagen: font-familiy für die Schriftart

Schriftfamilie: welche Schriftart ist gefragt?

Die erste Einstellung, die per CSS vorgenommen werden sollte, wenn man den Text gestaltet, ist die Auswahl der Schriftfamilie. Dabei gilt es zu berücksichtigen, dass man a) verschiedene Nutzer mit verschiedenen Betriebssystemen auf seiner Seite begrüßt und b) dass man sich im Internet aufhält.

Ersteres hat zur Konsequenz, dass nicht jedes Betriebssystem jede Schriftart besitzt, zweiteres bedeutet, dass man nicht eine von den 300 Schriftarten, die man auf einer CD mit gesammelten Schriftarten verwenden kann, weil die meisten diese zum Teil exotischen Schriftarten gar nicht besitzen. Das bedeutet: man wünscht sich diese coole Schriftart als Darstellungsmittel und stattdessen wird die 08/15-Schriftart Times als Notlösung dargestellt, weil die genannte Schriftart gar nicht existiert.

Die Einstellung der Schriftfamilie verhindert auch einen beliebten Fehler, der unter HTML immer wieder passiert. Wenn man sich manche Webseiten anschaut, die vor allem auf privater Ebene erstellt wurden, so sieht man oft einen unguten Wechsel der Schriftarten. Mal ist die Schriftart Verdana, dann wieder Arial, dann wieder Verdana.

Stellt man die Schriftart aber zentral ein, dann kann das nicht passieren, weil alle Textstellen sich an diese Einstellung halten - es sei denn, man hat für jede Ebene eigene Einstellungen vorgesehen.

In CSS erfolgt die Vorgabe der Schriftfamilie folgendermaßen:

font-family: Verdana, Arial, Helvetica, sans-serif;

Das bedeutet übersetzt: stelle die Verdana dar, wenn du sie nicht findest, dann die Arial, gibts die auch nicht, dann die Helvetica (oftmals für Mac-User) und als letztes eine Schriftart ohne Serifen. Serifen sind Schriftarten, die an den Buchstabenenden oft zusätzliche grafische Details wie verlängerte Striche aufweisen. Die Garamond ist ein solches Beispiel.

Will man nun die Schrift für eine gesamte Webseite vorgeben, dann würde man in der CSS-Datei so arbeiten:

body {
font-family: verdana, arial, helvetica, sans-serif;
font-size: 12px;
}

Body ist der Bereich der Webseite, der für die Darstellung des eigentlichen Inhaltes verantwortlich ist. Ist auf nachfolgenden Ebenen oder Absatzdefinitionen nichts anderes angegeben, dann gilt für die gesamte Seite die angeführte Schriftart mit der Größe 12 Pixel.

Ebenfalls interessant:

[aktuelle Seite]

Schriftart

Informationen über den CSS-Befehl font-family und die Möglichkeit, mittels CSS die Schriftart vorzugeben.

Schriftgröße

Informationen über den CSS-Befehl font-size, mit dem sich die Schriftgröße des Textes oder der Überschriften auf einer Webseite festlegen lassen.

Schriftstil

Informationen über den CSS-Befehl font-style, mit dem in CSS der Schriftstil festgelegt werden kann.

Fettschrift

Informationen über den CSS-Befehl font-weight, mit dem in CSS die Fettschrift eingestellt und formatiert werden kann.

Schriftvariante

Informationen über den CSS-Befehl font-variant, mit dem man Text als Kapitälchen darstellen lassen kann.

Zeichenabstand

Informationen über den CSS-Befehl letter-spacing, durch den man den Zeichenabstand im Text einstellen kann.

Wortabstand

Informationen über den CSS-Befehl word-spacing, wodurch sich der Abstand zwischen den Wörtern mit CSS definieren lässt.

Textdekoration

Informationen über den CSS-Befehl text-decoration, mit dem die Textdekoration mit CSS ermöglicht wird, beispielsweise unterstreichen oder durchstreichen.

Textumwandlung

Informationen über den CSS-Befehl text-transform, durch den ein Text in Großbuchstaben oder Kleinbuchstaben umgewandelt werden kann.

Textfarbe

Informationen über den CSS-Befehl color, durch den die Textfarbe mittels CSS bestimmt werden kann.

Textschatten

Informationen über den CSS-Befehl text-shadow, durch den eine Schattierung eines Textes möglich wird.

Zurück zum Hauptthema

Übersicht Textformatierung

Startseite CSS-Grundlagen