Interaktiver Kurs Im Browser Anfänger
HTML Von der ersten Zeile Markup bis zur fertigen Seite mit Navigation, Bildern, Tabellen und Formularen. Semantisch sauber, damit auch Screenreader mitkommen.
Hier geht es los
Abschnitt 1 · HTML verstehen
Was ist HTML?
Lektion 1 von 8 · Noch nicht begonnen
Kurs starten
Die Lektionen öffnest du mit dem Basis Konto, das kostet nichts. Damit bleibt
auch erhalten, was du geschafft hast, auf jedem Gerät.
Deine Strecke 0 von 11 Abschnitten erledigt
Start
01 HTML verstehen
, noch offen 02 Text strukturieren
, noch offen 03 Listen
, noch offen 04 Links und Navigation
, noch offen 05 Bilder und Medien
, noch offen 06 Semantik und Struktur
, noch offen 07 Tabellen
, noch offen 08 Formulare
, noch offen 09 Der Kopf der Seite
, noch offen 10 Interaktion ohne JavaScript
, noch offen 11 Sauberes HTML
, noch offen Ein Punkt ist ein Abschnitt, jeder endet mit einem kurzen Test. Ein Klick schlägt ihn unten auf. 01 HTML verstehen 0 / 8 02 Text strukturieren 0 / 6 03 Listen 0 / 3 04 Links und Navigation 0 / 4 05 Bilder und Medien 0 / 5 06 Semantik und Struktur 0 / 5 07 Tabellen 0 / 4 08 Formulare 0 / 7 09 Der Kopf der Seite 0 / 4 10 Interaktion ohne JavaScript 0 / 3 11 Sauberes HTML 0 / 6
danach:
CSS JavaScript PHP
Abschnitt 1
HTML verstehen 1.1 Was ist HTML? 1.2 Dein erstes HTML 1.3 Das Grundgerüst 1.4 Tags, Elemente und Verschachtelung 1.5 Void-Elemente 1.6 Attribute 1.7 Kommentare und Sonderzeichen 1.8 Test zum Abschnitt Test Am Ende des Abschnitts
Ein kurzer Test, eine Frage nach der anderen.
Abschnitt 2
Text strukturieren 2.1 Überschriften und Hierarchie 2.2 Absätze und Textfluss 2.3 Betonung und Hervorhebung 2.4 Zitate, Code und Datenauszeichnung 2.5 Weitere Textauszeichnung 2.6 Test zum Abschnitt Test Am Ende des Abschnitts
Ein kurzer Test, eine Frage nach der anderen.
3.1 Aufzählungen 3.2 Verschachtelte und Beschreibungslisten 3.3 Test zum Abschnitt Test Am Ende des Abschnitts
Ein kurzer Test, eine Frage nach der anderen.
Abschnitt 4
Links und Navigation 4.1 Links 4.2 Pfade und Verzeichnisse 4.3 Sprungmarken und Navigation 4.4 Test zum Abschnitt Test Am Ende des Abschnitts
Ein kurzer Test, eine Frage nach der anderen.
Abschnitt 5
Bilder und Medien 5.1 Bilder 5.2 Bilder für alle Bildschirme 5.3 Figuren und Bildunterschriften 5.4 Audio, Video und Einbettungen 5.5 Test zum Abschnitt Test Am Ende des Abschnitts
Ein kurzer Test, eine Frage nach der anderen.
Abschnitt 6
Semantik und Struktur 6.1 Warum Semantik zählt 6.2 Der Seitenaufbau 6.3 Inhalt gliedern: article und section 6.4 Block und Inline 6.5 Test zum Abschnitt Test Am Ende des Abschnitts
Ein kurzer Test, eine Frage nach der anderen.
7.1 Tabellen 7.2 Tabellen richtig strukturieren 7.3 Zellen verbinden 7.4 Test zum Abschnitt Test Am Ende des Abschnitts
Ein kurzer Test, eine Frage nach der anderen.
8.1 Formulare 8.2 Formulardaten verschicken 8.3 Eingabetypen 8.4 Auswahl treffen: Checkbox und Radio 8.5 Auswahllisten und Textbereiche 8.6 Eingaben prüfen und erleichtern 8.7 Test zum Abschnitt Test Am Ende des Abschnitts
Ein kurzer Test, eine Frage nach der anderen.
Abschnitt 9
Der Kopf der Seite 9.1 Titel und Beschreibung 9.2 Sprache, Favicon und Viewport 9.3 CSS und JavaScript einbinden 9.4 Test zum Abschnitt Test Am Ende des Abschnitts
Ein kurzer Test, eine Frage nach der anderen.
Abschnitt 10
Interaktion ohne JavaScript 10.1 Aufklappen mit details 10.2 Dialoge und Popover 10.3 Test zum Abschnitt Test Am Ende des Abschnitts
Ein kurzer Test, eine Frage nach der anderen.
Mit Lektion 10.1 anfangen Abschnitt 11
Sauberes HTML 11.1 Barrierefreiheit 11.2 ARIA und Tastaturbedienung 11.3 HTML prüfen und Fehler finden 11.4 Deine erste eigene Datei 11.5 Eine ganze Seite bauen Projekt 11.6 Test zum Abschnitt Test Am Ende des Abschnitts
Eine ganze Seite bauen
Lektion 11.5 · Aufgabe mit Prüfliste
Danach ein kurzer Test, eine Frage nach der anderen.
Mit Lektion 11.1 anfangen 01 HTML verstehen 0 / 8 1.1 Was ist HTML? 1.2 Dein erstes HTML 1.3 Das Grundgerüst 1.4 Tags, Elemente und Verschachtelung 1.5 Void-Elemente 1.6 Attribute 1.7 Kommentare und Sonderzeichen 1.8 Test zum Abschnitt Test 02 Text strukturieren 0 / 6 2.1 Überschriften und Hierarchie 2.2 Absätze und Textfluss 2.3 Betonung und Hervorhebung 2.4 Zitate, Code und Datenauszeichnung 2.5 Weitere Textauszeichnung 2.6 Test zum Abschnitt Test 03 Listen 0 / 3 3.1 Aufzählungen 3.2 Verschachtelte und Beschreibungslisten 3.3 Test zum Abschnitt Test 04 Links und Navigation 0 / 4 4.1 Links 4.2 Pfade und Verzeichnisse 4.3 Sprungmarken und Navigation 4.4 Test zum Abschnitt Test 05 Bilder und Medien 0 / 5 5.1 Bilder 5.2 Bilder für alle Bildschirme 5.3 Figuren und Bildunterschriften 5.4 Audio, Video und Einbettungen 5.5 Test zum Abschnitt Test 06 Semantik und Struktur 0 / 5 6.1 Warum Semantik zählt 6.2 Der Seitenaufbau 6.3 Inhalt gliedern: article und section 6.4 Block und Inline 6.5 Test zum Abschnitt Test 07 Tabellen 0 / 4 7.1 Tabellen 7.2 Tabellen richtig strukturieren 7.3 Zellen verbinden 7.4 Test zum Abschnitt Test 08 Formulare 0 / 7 8.1 Formulare 8.2 Formulardaten verschicken 8.3 Eingabetypen 8.4 Auswahl treffen: Checkbox und Radio 8.5 Auswahllisten und Textbereiche 8.6 Eingaben prüfen und erleichtern 8.7 Test zum Abschnitt Test 09 Der Kopf der Seite 0 / 4 9.1 Titel und Beschreibung 9.2 Sprache, Favicon und Viewport 9.3 CSS und JavaScript einbinden 9.4 Test zum Abschnitt Test 10 Interaktion ohne JavaScript 0 / 3 10.1 Aufklappen mit details 10.2 Dialoge und Popover 10.3 Test zum Abschnitt Test Mit Lektion 10.1 anfangen 11 Sauberes HTML 0 / 6 11.1 Barrierefreiheit 11.2 ARIA und Tastaturbedienung 11.3 HTML prüfen und Fehler finden 11.4 Deine erste eigene Datei 11.5 Eine ganze Seite bauen Projekt 11.6 Test zum Abschnitt Test Mit Lektion 11.1 anfangen 55 Lektionen 43 Aufgaben mit Prüfliste 11 Abschnittstests läuft im Browser das Basis Konto reicht
Wie es weitergeht CSS setzt HTML voraus Box-Modell, Positionierung, Flexbox und Grid. Geübt wird da, wo mehrere Eigenschaften zusammenwirken, und am Ende steht dein eigenes Portfolio.
Zum Kurs
JavaScript setzt HTML voraus, CSS hilft ab Abschnitt 11 Vom ersten console.log bis zu DOM, Events, fetch und Klassen. Am Ende machst du eine Seite bedienbar und holst dir Daten aus dem Netz.
Zum Kurs
PHP Sandbox setzt HTML voraus, kein JavaScript nötig Der zweite Weg nach HTML, ganz ohne JavaScript. Von echo bis zur eigenen kleinen Anwendung mit Formularen, Sitzungen, Login und Datenbank.
Zum Kurs
