Direkt zum Inhalt

Grundlagen · Eingangsklasse

Semantisches und barrierearmes HTML

In dieser Lerneinheit erarbeitest du Semantisches und barrierearmes HTML und wendest das Wissen anschließend in vier eigenen Aufgaben an.

Zentrale Begriffe

  • Semantik
  • Überschrift
  • Landmarke
  • Alternativtext

Das kannst du danach

  • Du kannst eine kleine Seite strukturell korrekt und tastaturfreundlich aufbauen.
  • Du kannst einen Lösungsweg fachsprachlich nachvollziehbar begründen.

Verständlich erklärt

Semantische Elemente beschreiben die Aufgabe eines Inhalts. Eine nachvollziehbare Überschriftenstruktur, echte Bedienelemente und Textalternativen helfen Menschen und technischen Hilfsmitteln.

Eigenes Beispiel

<main><h1>Lernthema</h1><button>Prüfen</button></main>

Typische Fehler

  • Klickbare div-Elemente statt Buttons verwenden
  • Überschriften nur nach Optik auswählen

Kurz zusammengefasst

Du kannst eine kleine Seite strukturell korrekt und tastaturfreundlich aufbauen.

Abi-Check

Prüfe, ob du Begriff, Ablauf und eine typische Anwendung erklären kannst.

Übungen zu Semantisches und barrierearmes HTML