Attribute bei HTML-TAGs

Früher wurde viel Design direkt über HTML gemacht. Dies wurde durch Attribute bei den entsprechenden HTML-TAGs erreicht. So konnte z.B. die Ausrichtung von Text mitgegeben werden (linksbündig, rechtsbündig, zentriert) oder Farben angegeben werden. Das sollte man bei der Philosophie von HTML dringend unterlassen. Viele dieser alten Attribute werden sonst von den Validerungstools als Fehler angemerkt werden. Design wird nun über CSS gemacht. Es ist nur noch Inhalt und Logik gewünscht. Daher sind nicht mehr allzu viele Attribute zugelassen bzw. gerne gesehen.

Merken Sie sich einfach: Attribute, die für das Design zuständig sind, sind verpönt. Lesen Sie veraltete HTML-Bücher, werden Sie Konstruktionen finden wie z.B. das veraltete <p align=“right“>. Hier sehen wir den HTML-TAG p für Absatz und noch vor Abschluss des HTML-TAGs (also vor dem >) kommt das Attribut. Das englische „align“ bedeutet übersetzt „ausrichten“ und die Angabe „right“ steht für rechts. Das ist ganz klar Design und hat nichts mit dem Inhalt zu tun. Dieses Attribut sollte also vermiedene werden, da es aus dem kommenden HTML-Standard gestrichen sein wird.

Die gute Nachricht ist: durch die Trennung von Inhalt (HTML) und Design (CSS) sparen Sie sich sehr viel Zeit beim Lernen von HTML und CSS. Es ist wirklich einfacher geworden. Wir haben nur noch sehr wenige Attribute.

Zu den sehr wichtigen Attributen gehört das Attribut id – was aus dem Englischen übersetzt wiederum „Ausweis, Identifikation“ bedeutet. Das Beschreibt auch exakt, für was dieses Attribut gut ist. Man kann damit jedem HTML-Element einen eindeutigen Namen geben, über dem man dann später in CSS Design zuweisen kann. Schauen wir uns den Aufbau anhand des Attributs id an.

Aufbau der Attribute

Wir möchten nun unserer Überschrift <h2> durch das Attribut id ergänzen. Als HTML-Code sieht das dann wie folgt aus:

<h2 id="eindeutigername">...</h2>

Nach unserem HTML-TAG h2 ist ein Leerzeichen und dann kommt das Attribut, das aus 2 Teilen besteht. Erst kommt der Attributname und dann der Attributwert. Nach dem Attributname kommt ein Gleichheitszeichen und der Attributwert wird in Anführungszeichen angegeben.

Auf gut deutsch: wer bist du und was für einen Wert hast du

Unser Attributname oben ist „id“ und der Wert im Beispiel ist „eindeutigername“.

Mehrere Attribute für 1 HTML-TAG?

Kann es mehrere Attribute für einen HTML-TAG geben? Ja! Schauen wir uns im nächsten Beispiel dies für das Attribut „class“ an. Das englische „class“ bedeutet übersetzt „Gruppe, Kategorie, Klasse, Stil“. Wir können also damit Gruppen bilden. Beispielweise wollen wir über CSS die Farbe Rot zuweisen und daher bilden wir eine Gruppe namens „farberot“.

<h2 class="farberot">

Unsere Überschrift wird noch lange nicht rot sein – dass muss erst im CSS definiert werden. Aber wir haben nun im HTML die Voraussetzung geschaffen.

Und jetzt der Aufbau bei mehreren Attributen

<h2 id="eindeutigername" class="farberot">...</h2>

Die Attribute kommen einfach hintereinander mit einem Leerzeichen getrennt. Die Reihenfolge der Attribute ist unwichtig. Es kann genauso diese Reihenfolge gewählt werden.

<h2 class="farberot" id="eindeutigername">…</h2>

Anmerkung: Beim Einstieg in HTML wird man meistens entweder „id“ oder „class“ verwenden – aber je nach Fall kann es geschickt sein, beide anzuwenden.

Vorkommen von Attributen

Bei welchem HTML-TAGs kann ein Attribut vorkommen? Je nach Attribut. „id“ und „class“ können bei so gut wie jedem HTML-Tag genutzt werden. Andere Attribute dagegen nur beim passenden HTML-TAGs, wie im folgenden Kapitel bei Links. Mehr zu den Attributen für Links dann im folgenden Kapitel.

nächstes Kapitel: Links, Hyperlinks
Aufgabenlösung DefinitionslistenSeitenanfangLinks, Hyperlinks
eBook HTML-Seminar.de
del.icio.usMister Wong         Aufgabenlösung DefinitionslistenSeitenanfangLinks, Hyperlinks
© 2000-2010 Axel Pratzner • www.html-seminar.de • Stand 22.06.2010
Wir freuen uns über Weiterempfehlungen und Links zu www.html-seminar.de