Webdesign & Webentwicklung, UX/UI
KI-Webentwicklung I: Moderne Frontends mit HTML5, CSS3 und KI
Sie lernen, wie moderne Websites heute strukturiert, gestaltet und für alle zugänglich gemacht werden: mit semantischem HTML als Grundgerüst, modernem CSS für Layout und Design und KI-Werkzeugen, die von der ersten Stunde an Teil Ihres Arbeitsablaufs sind. Sie arbeiten in VS Code, nutzen die Entwicklerwerkzeuge des Browsers und setzen KI-Assistenten wie GitHub Copilot, Claude oder ChatGPT als Lernhilfe, Code-Assistent und Korrektur-Partner ein.
Im Mittelpunkt steht die praktische Umsetzung: Sie bauen vollständige, responsive Websites, die auf allen Bildschirmgrößen funktionieren, den Standards für Barrierefreiheit entsprechen und für Suchmaschinen sauber strukturiert sind. Sie verstehen, wie Box-Modell, Kaskade und moderne Layout-Systeme wie Flexbox und Grid zusammenwirken, und steuern Farben, Typografie und Abstände mit CSS-Variablen konsistent über das gesamte Projekt.
Sie lernen außerdem, KI gezielt für Entwurf, Struktur und Inhalt einzusetzen, KI-generierten Code und KI-generierte Inhalte kritisch zu prüfen und rechtliche Rahmenbedingungen wie Urheberrecht, Lizenzen und Datenschutz zu beachten. KI ist dabei kein Ersatz für Webwissen, sondern ein integrierter Bestandteil Ihres Workflows.Lerninhalte
- Arbeitsumgebung einrichten
- KI von Anfang an im Workflow: Überblick über LLMs sowie Bild- und Code-Modelle
- Effektives Prompting für Webentwicklung
- Semantisches HTML5
- Formulare: barrierefreie, nutzerfreundliche Formulare mit nativer HTML-Validierung aufbauen
- Grundlagen Barrierefreiheit
- CSS-Grundlagen verstehen: Selektoren, Kaskade, Spezifität, Vererbung und das Box-Modell
- Moderne CSS-Organisation: CSS-Variablen, Verschachtelung und der :has()-Selektor
- Typografie und Farbe im Web
- Positionierung: Elemente mit relative, absolute, fixed und sticky gezielt platzieren
- Layout mit Flexbox und CSS Grid: eindimensionale Anordnungen mit Flexbox, zweidimensionale Layouts mit Grid
- Responsive Design: Media Queries und Container Queries
- Bewegung und Interaktion mit CSS
- Bild- und Grafikformate im Web: responsive Bilder, moderne Formate
- Moderne, barrierefreie, responsive und SEO-gerechte Websites umsetzen
- Recht und Verantwortung
Ihr erlerntes Wissen werden Sie in praktischen Projekten, Übungen oder Fallstudien mit fachlicher Unterstützung anwenden. Teil der Weiterbildungen bei cimdata sind die flexiblen Übungsphasen. Dank unserer Lernform „cimlive“ können unsere Teilnehmenden als Teil eines virtuellen Klassenraumes auch individuelle und eigenständige Lernprozesse umsetzen. Dadurch können Sie ortsunabhängig und flexibel lernen und haben gleichzeitig unsere Dozierenden in digitaler Nähe.
Lernziel
Nach Abschluss des Kurses erstellen Sie vollständige, moderne Websites mit semantischem HTML und modernem CSS. Sie beherrschen das Box-Modell, die Kaskade und die Layout-Systeme Flexbox und Grid und setzen responsive, barrierefreie und SEO-gerechte Seiten eigenständig um. Sie steuern Design konsistent über CSS-Variablen und nutzen moderne CSS-Funktionen wie Container Queries, Nesting und den :has()-Selektor.
KI ist dabei von Beginn an ein integrierter Bestandteil Ihres Workflows: Sie setzen KI-Werkzeuge gezielt für Entwurf, Struktur und Inhalt ein, bewerten ihre Ausgaben kritisch und beachten die rechtlichen Rahmenbedingungen. Damit sind Sie optimal auf den Einstieg in die Programmierung mit JavaScript und TypeScript in KI-Webentwicklung II vorbereitet.
Zielgruppe
Dieser Kurs ist für Personen mit wenig oder keiner Programmiererfahrung geeignet, die in Webentwicklung oder digitale Berufe einsteigen wollen. Er richtet sich ebenfalls an Personen, die ihre Kenntnisse auffrischen wollen und KI-Workflows erlernen wollen.
Vorkenntnisse
Gute Computerkenntnisse sind erforderlich.
Förderung
Fördermöglichkeiten sind mit Bildungsgutschein SGB II und SGB III sowie durch Rentenversicherungsträger (DRV), Berufsgenossenschaften (BG) und den Berufsförderungsdienst der Bundeswehr möglich. Darüber hinaus können Förderungen mit der Bildungsprämie sowie den regionalen Bildungschecks erfolgen.
Marktchancen
Der Arbeitsmarkt für Webentwickler:innen wächst, verändert aber gleichzeitig sein Anforderungsprofil grundlegend. Das U.S. Bureau of Labor Statistics prognostiziert für Web Developer und Digital Designer ein Beschäftigungswachstum von 13 Prozent zwischen 2022 und 2032. Treiber dieser Entwicklung ist vor allem die Integration von KI: Mehr als 60 Prozent der Fachkräfte erwarten, dass KI ihre Kernaufgaben innerhalb der nächsten fünf Jahre verändert.
Die Nachfrage nach KI-Kompetenzen im Web-Development wächst um über 30 Prozent jährlich. Das schlägt sich auch im Gehalt nieder: Entwickler:innen mit KI-Kenntnissen verdienen 15 bis 20 Prozent mehr als Kolleg:innen ohne diese Qualifikation. Zugleich könnten laut WEF rund die Hälfte der heutigen Arbeitsaufgaben bis 2030 automatisiert werden.
Betroffen sind vor allem repetitive Tätigkeiten. Die Frontend-Entwicklung statischer Seiten, automatisiertes Testing und einfaches Content-Management lassen sich zunehmend durch KI-Tools abbilden. Was bleibt, sind Kompetenzen, die KI nicht ersetzt: UX-Design mit echtem Verständnis für menschliches Verhalten, strategische Entscheidungen, kreatives Problemlösen sowie Fragen von Ethik und Barrierefreiheit.
Parallel entstehen neue Berufsrollen. Dazu zählen AI Integration Specialists, Automation Engineers, datengetriebene UX-Designer:innen und KI-gestützte Security Developer. Gefragt sind dafür konkrete Fähigkeiten wie Python und JavaScript, Grundlagen des maschinellen Lernens, Datenmanagement, KI-Frameworks wie TensorFlow oder PyTorch sowie Cloud-Plattformen wie AWS und Microsoft Azure.
Den größten KI-bedingten Bedarf an Webentwickler:innen verzeichnen vier Branchen: E-Commerce, Healthcare Technology, Financial Services und der Bereich Smart Cities. Für Berufseinsteiger:innen und Umschulende ist das eine günstige Ausgangslage, weil sie direkt auf dem neuen Kompetenzniveau aufsetzen können. Wer Webentwicklung heute mit KI-Kompetenz verbindet, qualifiziert sich für einen Markt, der wächst und gleichzeitig neue Spezialisierungen schafft.
