HTML und XHTML

Elemente und Attribute

leere und nicht leere Elemente

Und schon müssen wir ein erstes Mal etwas tiefer ins Detail gehen. Es gibt nämlich grundsätzlich zweierlei Elemente: solche mit und solche ohne Inhalt.

Ein gutes Beispiel für ein Element mit Inhalt, ein sogenanntes nicht leeres Element, ist ein Absatz (Paragraph). Der enthält Text, möglicherweise Abbildungen, Links und andere Inhalte, darunter zum Beispiel auch weitere Elemente.

Im Gegensatz dazu enthält ein leeres Element nichts. So besteht zum Beispiel das <img>-Element lediglich aus einem Verweis zu einer URL, die das Bild enthält.

Hier siehst du das Schema eines leeren Elements:

Abbildung 3: Schema eines leeren Elements

Wenn du die Schemen leerer und nicht leerer Elemente vergleichst, wirst du bald sehen, dass wir hier in der Syntax etwas zu beachten haben: Nicht leere Elemente haben einen End- oder Closing Tag, der übrigens sehr einfach gebildet wird:

Er steht in spitzen Klammern: <...>
Er wiederholt den Element-Namen (h1, p, body)
aber er stellt einen Schrägstrich (Slash) vor den Namen, also z.B. </body>

Dieser End-Tag bezeichnet das Ende des Inhalts eines nicht-leeren Elementes. Und sowas ist natürlich bei leeren Elementen nicht nötig. Unter HTML haben daher leere Elemente keinen End-Tag.

Unter XHTML müssten sie das aber trotzdem haben. Man hat sich aber auf den Schrägstrich konzentriert, der ja den End-Tag kennzeichnet. Leere Elemente enden unter XHTML mit />.

Auch wenn das unter HTML nicht nötig ist, empfehle ich diese Schreibweise dennoch, denn damit ist für die Zukunft bereits vorgesorgt und die Seite wird damit XHTML-tauglich. Auch ältere Browser können mit dieser Notierung umgehen; um ganz sicher zu sein, empfiehlt es sich, vor dem Schrägstrich einen Leerschlag zu machen.

Diese Dinge gehören zur Grundausrüstung, und daher möchte ich sie nochmals kurz zusammenfassen.

Aus der Sicht der Syntax, also der Sprachregelung, gibt es zweierlei Elemente: leere und nicht leere. Leere Elemente, wie z.B. Bilder haben keinen eigenen Inhalt, können aber sehr wohl Attribute haben. Nicht leere Elemente haben einen Inhalt und können auch Attribute haben. Der Start-Tag wird für beide Arten von Elementen weitgehend gleich gebildet:

Es beginnt mit der Eröffnung und dem Namen: <elementname
danach folgen die Attribute (falls es welche hat) in der Form attributname="wert"
und schliesslich wird der Tag geschlossen. Grundsätzlich wird das mit dem Zeichen>gemacht. Bei leeren Elementen gibt's aber noch eine kleine Finesse: Wenn der Browser die Tags alle persönlich kennt, dann weiss er ja, welche für ein leeres Element stehen und daher später keinen End-Tag folgen lassen werden. In XHTML geht man nun davon aus, dass jederzeit neue Tags erfunden werden können, und der Browser daher gar keine Chance hat, sie alle zu kennen. Man muss daher für leere Elemente ebenfalls ein Ende anzeigen, und das macht man, indem man den Start-Tag mit /> abschliesst. Genau genommen kannst du das auch unter HTML 4 so machen - es ist zwar nicht vorgesehen und wird von Validierungsprogrammen, die den HTML-Code auf Gültigkeit testen, dann auch prompt bemeckert, aber du kannst die Seiten später viel einfacher auf XHTML umstellen. Ich überlasse das dir.

Ein einfaches Beispiel für ein nicht leeres Element ist der Paragraph:

<p>Inhalt des Abschnitts</p>

und für ein leeres Element die Abbildung:

<img src="image.gif" />

Homepapa
März 2004

Vorheriger Abschnitt:
Elemente im Detail

Nächster Abschnitt:
End-Tag