Semantische Elemente mit HTML 5
Semantische Elemente bei HTML 5
Vor HTML 5 hat man bestimmte Bereiche einer Webseite bzw. des Quellcodes mit
<div id="..."> abgegrenzt und konnte über die
id per CSS auf das Element zugreifen.
Eine grobe Struktur hätte dabei zum Beispiel wie folgt ausgesehen:
Mit HTML 5 wurden sogenannte semantische HTML Tags eingeführt, deren Namen auf den Inhalt schließen lässt. Somit sind für diese Standardelemente keine
<div id="..."> Konstruktionen nötig.
Die Struktur von oben würde man daher jetzt wie folgt vorfinden:
Neben den im Beispiel verwendeten Tags gibt es noch:
<main> und
<section>
Aufgabe 1
-
Die semantischen HTML Tags wurden nicht nur zur Verbesserung der Übersichtlichkeit eingeführt. Recherchiere weitere Nutzungsmöglichkeiten.
-
Erstelle in einem Editor deiner Wahl ein neues HTML 5 Dokument und ergänze die oben abgebildeten Tags. Achtung: Natürlich müssen die Tags auch geschlossen werden
<header></header>.
