In diesem Modul werde ich dir Schritt für Schritt zeigen, wie du die für den Kurs benötigte kostenlose Software installieren kannst.

Diese Lektionen erwarten dich:

• [Anleitung] Visual Studio Code installieren
  
• [Anleitung] Google Chrome Browser installieren

In diesem Modul wirst du ein Grundwissen im Bereich HTML aufbauen.

Diese Lektionen erwarten dich:

• [Video 1] Überblick über Visual Studio Code
• [Video 2] HTML-Dateien erzeugen und im Browser öffnen
• [Video 3] HTML-Syntax: Elemente
• [Video 4] HTML-Syntax: Selbstschließende Tags
• [Video 5] HTML-Syntax: Attribute von HTML-Elementen
• [Video 6] Grundgerüst einer HTML-Seite
• [Video 7] Tipp: Emmet (die unsichtbare Unterstützung)
• [Video 8] Meta Tags
• [Video 9] Tipp: Live Server Extension installieren und verwenden
  

Nachdem du im letzten Modul das notwendige Grundwissen im Bereich HTML aufgebaut hast, werden wir uns nun in diesem Modul zahlreiche wichtige HTML-Elemente ansehen, welche du immer wieder benötigen wirst. 

Diese Lektionen erwarten dich:

• [Video 1] Überschriften und Paragraphen
• [Video 2] Kommentare
• [Video 3] Links
• [Video 4] Bilder
• [Video 5] Listen
• [Video 6] Tabellen
• [Video 7] HTML Entities
• [Video 8] Unterschied zwischen Block-Level und Inline Elementen
• [Video 9] Divs und Spans
• [Video 10] Semantische HTML Elemente

In diesem Modul werden wir die ersten Schritte mit CSS machen. Genauer gesagt wirst du zunächst einmal lernen, mit welchen Varianten man CSS implementieren kann.

Diese Lektionen erwarten dich:

• [Video 1] Einführung in den CSS Grundkurs
• [Video 2] Übersicht: Drei CSS Implementierungs-Varianten
• [Video 3] Variante 1: Inline CSS
• [Video 4] Variante 2: Internal CSS
• [Video 5] Variante 3: External CSS
• [Video 6] Welche Implementierungs-Variante sollte man verwenden?

In CSS verwendet man sogenannte Selektoren, um damit zu definieren, welche spezifischen Elemente gestylt werden sollen. In diesem Modul wirst du unterschiedlichste Selektor-Arten kennenlernen.

Diese Lektionen erwarten dich:

• [Video 1] Einführung und Typ-Selektoren
• [Video 2] Universal-Selektor
• [Video 3] ID- und Klassen-Selektoren
• [Video 4] Attribut-Selektoren
• [Video 5] Kombinatoren

Es existieren hunderte von CSS-Eigenschaften, mithilfe derer man die gewünschten HTML-Elemente stylen kann. In diesem Modul wirst du die wichtigsten CSS-Eigenschaften kennen und anzuwenden lernen.

Diese Lektionen erwarten dich:

• [Video 1] Einführung
• [Video 2] Fonts
• [Video 3] Mehr Fonts: Google Fonts implementieren
• [Video 4] Hintergrund
• [Video 5] Ränder
• [Video 6] Farben spezifizieren
• [Video 7] Tipp: Google Chrome Developer Tools
• [Video 8] Box Model, Margin und Padding
• [Video 9] Die CSS-Eigenschaft box-sizing
• [Video 10] Exkurs: Pseudo-Klassen (am Beispiel von Links erklärt)
• [Video 11] Tabellen stylen
• [Video 12] display: inline, block, inline-block und none

In diesem Modul wirst du lernen, wie du Elemente mithilfe von CSS positionieren kannst.

Diese Lektionen erwarten dich:

• [Video 1] Einführung Positionierung: Die CSS-Eigenschaft position
• [Video 2] Die Werte relative und absolute
• [Video 3] Der Wert fixed
• [Video 4] Der Wert sticky
• [Video 5] Der z-Index
  

In diesem Modul wirst du lernen, wie du mithilfe von CSS Floating schrittweise Layouts erstellen kannst. 

Diese Lektionen erwarten dich:

• [Video 1] Floats
• [Video 2] Clearing Floats
• [Video 3] Einfaches Float Layout erstellen

In diesem abschließendem Projekt werden wir gemeinsam eine komplette Beispiel-Webseite umsetzen. Wir werden hierzu alle unsere Fähigkeiten einsetzen, die wir im Verlauf des Kurses erworben haben.

Diese Lektionen erwarten dich:

• [Video 1] Vorstellung des Praxisprojekts
• [Video 2] Generelle Projekt-Struktur + HTML Grundgerüst für Startseite
• [Video 3] Navigationsmenü
• [Video 4] Startseite - Welcome-Section
• [Video 5] Startseite - About-Section
• [Video 6] Startseite - Skills-Section
• [Video 7] Startseite - Footer
• [Video 8] Kontakt-Seite
• [Video 9] Letzte Anpassungen + Abschluss