Informatik Webentwicklung – HTML und Semantik
Semantisches HTML ist die Grundlage barrierefreier, suchmaschinenfreundlicher Webseiten. Nach dem Lernen dieser Karten kennst du die wichtigsten HTML5-Elemente, ihre Bedeutung und wann du sie einsetzt – für Code, der von Screenreadern und Crawlern verstanden wird.
Lernziele
Was du in dieser Lektion lernst
- Was ist der Unterschied zwischen <section> und <article>?
- Wann nutzt du <nav> statt einer einfachen <ul> für Navigation?
- Welche Funktion hat das <main>-Element?
- Warum solltest du <header> und <footer> innerhalb von <article> verwenden?
Lerntipp
Baue eine Beispielseite nur mit semantischen Elementen (header, nav, main, article, section, aside, footer) – ohne div/span. Prüfe sie danach im Screenreader-Modus des Browsers.
Hinweis: Der Inhalt dieser Seite wurde mit einem KI-Modell erzeugt und nicht von Fachmenschen geprüft. Nutze die Karten als Lernhilfe und gleiche medizinische oder rechtliche Aussagen mit deinen Unterlagen ab.
Karteikarten
Alle 15 Lernkarten
Tippe auf eine Karte, um die Antwort aufzudecken
Häufige Fragen
Die wichtigsten Fragen zu Informatik Webentwicklung – HTML und Semantik
- Was ist der Unterschied zwischen <section> und <article>?
- <article> steht für in sich abgeschlossene, eigenständig verteilbare Inhalte (z. B. Blogbeitrag), <section> für thematische Abschnitte innerhalb eines Dokuments.
- Wann nutzt du <nav> statt einer einfachen <ul> für Navigation?
- <nav> kennzeichnet primäre Navigationsblöcke für Screenreader und Suchmaschinen; <ul> allein hat keine semantische Navigations-Bedeutung.
- Welche Funktion hat das <main>-Element?
- <main> umschließt den eindeutigen Hauptinhalt der Seite – exakt einmal pro Dokument, nicht in Vorfahren wie article oder section verschachtelt.
- Warum solltest du <header> und <footer> innerhalb von <article> verwenden?
- Sie strukturieren Metadaten (Überschrift, Autor, Datum) bzw. Fußnoten eines Artikels semantisch, unabhängig vom Seitensheader/-footer.
- Was bewirkt das <aside>-Element?
- <aside> markiert Inhalte, die nur indirekt zum Hauptinhalt gehören (Sidebar, Pull-Quotes, Werbung) und beim Lesen übersprungen werden können.
Warum Atrio?
- FSRS-5 Spaced Repetition
- Der Algorithmus plant jede Wiederholung anhand deiner eigenen Lernhistorie und stellt Karten kurz bevor du sie vergisst – das reduziert unnötige Wiederholungen.
- KI-Import
- Notizen, Skripte und PDFs in Sekunden in Lernkarten verwandeln – genau wie diese Seite automatisch entsteht.
- Prüfungsplanung
- Termine hinterlegen und Atrio berechnet rückwärts, wie viele Karten du pro Tag lernen musst – ohne Stress.
Interaktiv lernen
Diese 15 Karten jetzt interaktiv in der Atrio-App lernen
Atrio zeigt dir jede Karte dann, wenn du sie fast vergessen hättest – damit bleibt genau das hängen, was du lernst.
Starter-Plan kostenlos – keine Kreditkarte erforderlich.