Ziel

"CSS und HTML-Programmierung mit KI" vermittelt die Grundlagen der Webgestaltung mit HTML und CSS und zeigt, wie KI-Assistenten das Erlernen und die Anwendung dieser Technologien erheblich beschleunigen. Teilnehmende lernen, strukturierte und ansprechend gestaltete Webseiten zu entwickeln und KI-Tools für Design, Implementierung und Fehleranalyse einzusetzen. Der Kurs ist der ideale Einstieg für angehende Webentwickler und Designer.

Inhalte (Auswahl)
  • HTML-Grundlagen: Struktur, Tags & semantische Auszeichnung

  • CSS-Grundlagen: Selektoren, Eigenschaften & das Box-Modell

  • Layout-Techniken: Flexbox & Grid mit KI-Unterstützung

  • Typografie, Farben & visuelle Gestaltung mit CSS

  • Responsive Design: Media Queries & Mobile First

  • CSS-Animationen & Transitions mit KI gestalten

  • HTML-Formulare & interaktive Elemente

  • KI-Prompts für HTML/CSS-Aufgaben präzise formulieren

  • Fehler in HTML & CSS finden & beheben mit KI-Assistenten

  • Webprojekte mit HTML & CSS realisieren & veröffentlichen


Arbeitsweise

Der Kurs verbindet das schrittweise Erlernen von HTML und CSS mit direkter KI-gestützter Umsetzung. Jede Einheit enthält praktische Gestaltungsaufgaben, die zu einem vollständigen Webprojekt zusammenwachsen. KI-Tools werden als durchgehende Unterstützung für Lernen und Entwicklung eingesetzt.

Kompetenzen (Ergebnis)
  • HTML & CSS sicher anwenden & Webseiten professionell gestalten

  • Layout-Techniken mit Flexbox & Grid umsetzen

  • Responsive & visuell ansprechende Webseiten entwickeln

  • KI-Assistenten für HTML/CSS-Aufgaben produktiv einsetzen

  • Eigene Webprojekte mit HTML & CSS realisieren & veröffentlichen


Tools (Beispiele)

VS Code, Cursor, ChatGPT, Claude, GitHub Pages, Figma, CodePen