Der grundlegende Aufbau einer HTML-5-Webseite

 

HTML5 – Es hat sich viel getan

Mit HTML5 und CSS3 hat sich viel getan. Oben sehen Sie einen typischen Aufbau einer HTML5-Webseite. Dies ist das Grundgerüst mit dem gearbeitet wird.

Es sind viele Erleichterungen durch HTML5 hinzugekommen. Darüber freuen sich die Entwicklerinnen und Entwickler. Es ist aufgrund dieses „Gerüstes“ nun

auch einfacher geworden, Webseiten zu erstellen.

 

Welche Elemente gibt es in HTML5 für den Webseiten-Aufbau?

Es beginnt mit dem <header>, also dem Logo und dem Titelbild. Das Logo sollte immer oben links in der Ecke sich befinden. Danach kommt der <nav>-Bereich, also die Navigation oder auch „Menüleiste“ genannt. Anschließend folgt <main>, das ist der sichtbare Hauptbereich der Webseite neben dem Header und der Navigation. Dort befindet sich der weitere Seiteninhalt. Der Seiteninhalt ist wiederum in verschiedene Abschnitte gegliedert, die man <section> („Abschnitt“) nennt. Es kann mehrere Abschnitte geben, die dann durchnummeriert werden. Es gibt ein <aside>-Element, dies kann eine Sidebar sein, sofern vorhanden. Wenn man Artikel in seinen Texten hat, kann man das <article>-Element verwenden. Zum Schluss kommt der <footer>-Bereich in den üblicherweise die Anschrift, die Öffnungszeiten, Social Media und rechtliche Hinweise geschrieben werden. Man kann natürlich auch auf weitere Webseiten im Footer verlinken und weitere Services anbieten, so wie es beispielsweise Amazon in seinem Footer-Bereich macht. Ganz am Ende des Footer steht das Copyright, jedoch ist der Bereich zumeist in einer etwas anderen Farbe, beispielsweise Schwarz, während der Footer-Bereich Braun oder Dunkelblau sein kann. Oder eben in Ihrer gewünschten Farbe.

Auf der Abbildung sehen Sie noch das class-Element. Man vergibt beim Seitenaufbau gleich noch Namen für die CSS-Klassen für das jeweilige Element, damit man es besser ansprechen kann innerhalb der CSS-Datei.

Copyright © 2021, Martina Ledermann