<header> </header>
Das HTML-Element header steht für den einleitenden Inhalt der Seite oder des Abschnitts. Es kann Titelelemente, aber auch andere Elemente wie ein Logo, ein Suchformular, den Namen des Autors usw. enthalten.
Ein Header-Element kann nicht untergeordnet zu einem Footer-Tag oder sich selbst sein (z. B. unten) :
<header>
<header></header>
</header>
<footer>
<header></header>
</footer>
<main> </main>
Das HTML-Element main steht für den Hauptinhalt des <body> des Dokuments. Der Hauptinhalt oder das Hauptthema des Dokuments.
Ein Dokument kann nicht mehr als ein main-Element haben.
<footer> </footer>
Das HTML-Element footer stellt die Fußzeile seines übergeordneten Elements dar. Es ist in der Regel absteigend von : body, section, article. Ein footer-Element enthält normalerweise Informationen über den Autor des Abschnitts, Angaben zum Urheberrecht, Links zu anderen verwandten Dokumenten oder Kontaktinformationen.
<section> </section>
Das HTML-Element section steht für einen generischen Abschnitt eines Dokuments, z. B. eine thematische Inhaltsgruppe. Um gültig zu sein, muss der Abschnitt mindestens Folgendes enthalten: 1 Titel und eine Beschreibung.
Beispiel: Auf meiner Homepage habe ich einen Abschnitt, der die Seite "Über uns" zusammenfasst, und einen weiteren Abschnitt, der die Seite "Unsere Dienstleistungen" zusammenfasst. Jeder dieser Teile wird in einem eigenen Abschnitt zusammengefasst.
<article> </article>
Das Artikel-Element stellt eine eigenständige Komposition auf der Seite dar, die unabhängig verteilt oder wiederverwendet werden soll. Ein Artikel muss für sich selbst Sinn machen und er muss unabhängig vom Rest der Seite verbreitet werden können.
Beispiele: ein Magazin- oder Zeitungsartikel, ein Blogeintrag, eine Produktbeschreibung, ein von einem Nutzer abgegebener Kommentar, etc.
<div> </div>
Das HTML-Element div (oder division) ist der generische Container für den Inhalt des Feeds. Dieses Element hat keinen semantischen Wert, es ist vor allem nützlich, um den Inhalt zu unterteilen und uns die Formatierung zu ermöglichen. Es hat also keine Auswirkungen auf den Inhalt oder das Layout, solange es nicht mithilfe von CSS angegeben wird.
<h1></h1> ... <h6> </h6>
Die HTML-Elemente h1 bis h6 stehen für die sechs Ebenen der Abschnittsüberschriften. <h1> steht für die höchste Ebene und <h6> für die niedrigste Ebene. Auf der Ebene der natürlichen Suchmaschinenoptimierung wird h1 daher wichtiger sein als h6.
<p> </p>
Das HTML-Element p steht für einen Textabsatz. Absätze werden normalerweise als Blöcke dargestellt und durch ein vertikales Leerzeichen getrennt. Der p wird alle Textelemente enthalten, egal ob es sich um lange oder kurze Beschreibungen handelt.
<a> </a>
Das HTML-Element a für den Anker steht für alle Links auf der Website. Es dient dazu, zwischen den Seiten zu navigieren oder auf eine externe URL weiterzuleiten. Dieses Element benötigt das Attribut href, um zu funktionieren. --> mehr dazu hier
hier ein Beispiel, um eine externe URL einzubinden:
<a href="https://mon-url.ch">Der Name meines Links, der für den Benutzer sichtbar ist</a>.oder für eine Weiterleitung auf eine Seite der Website :
<a href="der-name-meiner-datei.html">Meine zweite Seite</a>.<img/>
Das HTML-Element img ist vorhanden, um Bilder an beliebiger Stelle auf der Website einzubinden. Dieses Element benötigt die Attribute src und alt, um zu funktionieren. --> mehr dazu hier
hier ein Beispiel, um eine externe URL einzubinden:
<img src="pfad/zu/mein/bild.jpg" alt="beschreibung" />.<ul> </ul> oder <ol> </ol>.
Die HTML-Elemente ul oder ol stehen für eine Liste von Elementen. Der Unterschied zwischen den beiden :
<ul> = ohne besondere Reihenfolge:
.
<ol> = geordnete Liste:
.
In einem Kochrezept wird ol verwendet, da die Reihenfolge wichtig ist und jeder Schritt nacheinander ausgeführt werden muss.
Jedes Element in meiner Liste wird in einem <li> </li> enthalten sein. Hier ist ein konkretes Beispiel:
<ul>
<li>mein Element XY</li></li>.
<li>mein Element Z</li></li>.
<li>mein Element F</li>
<li>etc...</li>.
</ul>.