Dieser Artikel soll sich ein wenig mit den Grundlagen der Gestaltung von Webseiten beschäftigen. Darum geht es heute darum wie man die HTML Font Size und andere Eigenschaften der Schrift in HTML beeinflusst.

Generell kann man die Schrift Eigenschaften in einer Webseite mit dem „font“-Tag ansprechen.

Die Größe der Schrift lässt sich durch das „size“-Attribut setzen. Möchten wir die Schriftgröße auf 5 festlegen müssten wir folgenden Tag einbauen.

<font size=“5“>Hier kommt der Text</font>

Die Schriftgröße kann die Werte von 1 bis 5 annehmen. Möglich sind auch Angaben wie „+3“ oder „-2“. Diese Angaben beziehen sich immer auf die Normalschriftgröße welche mit 3 notiert ist. Generell muss man immer beachten das die Angaben relativ zu den „size“ – Einstellungen des Browser gewertet werden.

Der HTML Font Tag bietet aber auch noch zwei weitere Attribute zur Gestaltung der Schrift. Der eine ist „color“, mit diesem kann man die Schriftfarbe bestimmen. Das „color“ Attribut erwartet eine Schriftfarbe als Hex-Code, zum Beispiel würde folgende Angabe eine weiße Schrift ausgeben:

<font color=“#ffffff“>Hier kommt der Text</font>

Das dritte Attribut was gesetzt werden kann ist „face“. Mit „face“ wird die Schriftart gesteuert. Eine mögliche Angaben wäre:

<font face=“Avalon“>Hier kommt der Text</font>

Der Text würde jetzt in der Schriftart „Avalon“ dargestellt, wenn man auf Nummer sicher gehen möchte kann man mit Kommata getrennt weitere Schriftarten angeben. Der Browser arbeitet diese dann chronologisch ab, sprich wenn Schriftart 1 nicht verfügbar ist wird Schriftart 2 versucht und so weiter. Ein Beispiel für mehrere Schriftarten ist:

<font face=“Avalon,Arial,Wide Latin“>Hier kommt der Text</font>

Wenn keine Schrift im Browser verfügbar ist zeigt „face“ keine Wirkung.

Allerdings wird der „font“ – Tag heute in der Regel nicht mehr verwendet da die Gestaltung der Schrift über CSS vorgenommen werden kann. Die Attribute kann man über CSS praktisch genauso setzen. Ein Beispiel in dem alle 3 Attribute verwendet werden wäre:

<div style=“font-size: 12pt; color: #ffffff; font-family: Verdana;“>Hier kommt der Text</div>

Das Beispiel gibt „Hier kommt der Text“ in einer Schriftgröße von 12pt mit weißer Schriftfarbe und als Schriftart Verdana aus.

CSS bietet auch noch weitere Möglichkeiten der Textgestaltung an, alle Eigenschaften sind bei SelfHTML aufgelistet und sehr gut erklärt.

Update: Die HTML Variante sollte man also keinesfalls verwenden da diese schon seit einigen Jahren veraltet ist und es dafür die Eigenschaften in CSS gibt. Weiteres dazu findet ihr in den Kommentaren.

Ich hoffe dieser Artikel hat die Benutzung des „font“ – Tags gut erklärt und die Beispiele helfen euch bei der Gestaltung eures Projekts.