Kategorie: HTML-Kurs

Abbildung von Kontrollkästchen, Optionsfeldern, Listen und Datumssteuerelementen

HTML-Kurs / Eingabetypen für E-Mail, Zahlen, Datum und Auswahl wählen

Wählen Sie passende Eingabetypen für E-Mail-Adressen, Mengen, Datumswerte und Auswahlmöglichkeiten. Vergleichen Sie in einem vollständigen Formular sichtbare Eingaben, erforderliche Radiogruppen und tatsächlich übermittelte Werte.

Ein blaues Etikett, das in einer Abbildung mit einem Eingabefeld verbunden ist

HTML-Kurs / label und input richtig verknüpfen

Verknüpfen Sie Beschriftungen über for und id mit Eingabefeldern. Lernen Sie den Unterschied zwischen id und name kennen und erfahren Sie, warum ein Platzhalter keine sichtbare Beschriftung ersetzt.

Abbildung eines Formulars mit drei Eingabefeldern und einer blauen Schaltfläche

HTML-Kurs / Formularstruktur und der Unterschied zwischen GET und POST

Unterscheiden Sie action, method und name, und vergleichen Sie dann die GET- und POST-Anfragen. Untersuchen Sie die Eingaben mit FormData, ohne sie zu senden, und vergleichen Sie die Attribute disabled, readonly und die Kontrollkästchen.

Abbildung einer Tabelle, deren einige Spalten und Zellen hervorgehoben sind

HTML-Kurs / Zugängliche Tabellen: caption, scope und verbundene Zellen

Machen Sie die Tabellenüberschriften und die Beziehungen zwischen den Daten mit caption, th und scope klar, und lernen Sie, wann colspan oder rowspan eine Tabelle schwerer lesbar machen.

Abbildung einer Tabelle mit einer blauen Kopfzeile und mehreren Datenzeilen

HTML-Kurs / Tabellen mit table, tr, th und td erstellen

Erstellen Sie eine grundlegende HTML-Datentabelle mit Zeilen und Kopf- oder Datenzellen und ordnen Sie dann deren Kopfzeilen und Datenzeilen, ohne Tabellen für das Layout zu verwenden.

Abbildung eines Bildes von See und Bergen auf einem Blatt mit einem Beschriftungsbereich

HTML-Kurs / Bilder und Beschriftungen mit figure und figcaption verbinden

Verwenden Sie figure und figcaption, um ein Bild und seine Erklärung zusammen sichtbar zu halten und die Bildunterschriften vom alternativen Text des Bildes zu unterscheiden.

Zwei blaue und grüne Inhaltsblöcke in einem weißen Behälter gruppiert

HTML-Kurs / Wann verwendet man div und span?

Verstehen Sie den strukturellen Unterschied zwischen div und span, lernen Sie, den benötigten Inhalt mit CSS anzusprechen, und wählen Sie semantische Elemente, wenn sie den Inhalt besser beschreiben.

Illustration der verschiedenen Bereiche einer Webseite in Form von farbigen Zonen

HTML-Kurs / Eine Seite mit semantischen Elementen strukturieren

Lernen Sie, wann Sie header, nav, main, article, section, aside und footer verwenden, und erstellen Sie dann eine vollständige Seite, deren Bereiche und interne Links zusammen funktionieren.

Die gleiche Seeszene auf einem Bildschirm, einem Tablet und einem Telefon angezeigt

HTML-Kurs / Responsive Bilder: srcset, sizes und picture

Vergleichen Sie srcset und sizes für die Auflösungsänderung mit picture zur Anpassung des Bildausschnitts. Verwenden Sie echte Dateien, um die mobile Anzeigebreite, Media-Bedingungen und das vom Browser gewählte Bild zu überprüfen.

Illustration eines Fotos von See und Baum, das in eine Webseite eingefügt ist

HTML-Kurs / Bilder mit img einfügen: Alternativtext und Abmessungen

Fügen Sie ein Bild mit HTML img ein, schreiben Sie einen nützlichen alternativen Text und legen Sie die Breite und Höhe korrekt fest. Ein herunterladbares Beispiel hilft Ihnen, Dateipfade und Größen zu testen.