Responsive Webdesign verstehen und anwenden
Wir zeigen dir, wie Websites auf jedem Gerät funktionieren. Von den Grundlagen bis zu fortgeschrittenen Techniken – hier lernst du flexibles Layout-Design, Media Queries und Mobile-First-Ansätze.
Das Programm dauert acht Wochen und kombiniert Live-Sessions mit praktischen Übungen. Du bekommst direktes Feedback und arbeitest an echten Projekten.
Jetzt Platz sichern
Modulaufbau des Programms
Acht Module über acht Wochen. Jede Woche behandelt ein spezifisches Thema mit praktischen Anwendungen und Code-Reviews.
Responsive Basics
Fundamentale Konzepte von flexiblen Layouts und wie Browser verschiedene Bildschirmgrößen interpretieren.
- Viewport-Konzepte verstehen
- Flexible Einheiten nutzen
- Box-Model anpassen
Media Queries
Breakpoints definieren und verschiedene Layouts für unterschiedliche Geräte erstellen.
- Breakpoint-Strategien entwickeln
- Orientierung handhaben
- Device-spezifische Anpassungen
Flexbox Layout
Moderne Layouttechniken mit Flexbox für eindimensionale Strukturen und Content-Anordnung.
- Flex-Container konfigurieren
- Ausrichtung kontrollieren
- Responsive Navigation bauen
CSS Grid System
Zweidimensionale Layouts mit Grid erstellen und komplexe Seitenstrukturen aufbauen.
- Grid-Templates definieren
- Areas und Tracks nutzen
- Auto-placement verstehen
Responsive Bilder
Optimierte Bilddarstellung für verschiedene Auflösungen und Bandbreiten implementieren.
- Srcset und sizes einsetzen
- Picture-Element verwenden
- Performance optimieren
Mobile-First Approach
Von kleinen Bildschirmen zu größeren entwickeln und Progressive Enhancement anwenden.
- Mobile-basierte Struktur
- Touch-Interfaces designen
- Schrittweise Verbesserung
Testing und Debugging
Responsive Designs auf verschiedenen Geräten testen und Probleme systematisch beheben.
- Browser-DevTools nutzen
- Cross-browser Testing
- Debugging-Strategien
Performance und Best Practices
Abschlussprojekt mit allen gelernten Techniken und Performance-Optimierung.
- Ladezeiten reduzieren
- Code-Organisation
- Production-ready Setup
Wie wir arbeiten
Jede Woche gibt es zwei Live-Sessions von je 90 Minuten. Zwischen den Sessions arbeitest du an praktischen Aufgaben und bekommst individuelles Feedback zu deinem Code.
Live-Coding Sessions
Wir programmieren gemeinsam in Echtzeit. Du siehst, wie Probleme gelöst werden und kannst direkt Fragen stellen. Keine aufgezeichneten Videos – echte Interaktion.
Praktische Aufgaben
Nach jeder Session bekommst du konkrete Übungen. Du baust echte Komponenten – keine theoretischen Beispiele. Dein Code wird von uns durchgesehen.
Code-Reviews
Wir schauen uns deinen Code genau an und geben dir spezifisches Feedback. Du lernst, wie du Probleme besser lösen kannst und wo typische Fehler passieren.
Kleine Gruppen
Maximal zwölf Teilnehmer pro Durchgang. So bleibt Zeit für individuelle Fragen und jeder kommt zu Wort. Die Gruppengröße macht echte Betreuung möglich.
Nächster Start: laufend
Der nächste Durchgang hat bereits begonnen und du kannst noch einsteigen. Die ersten beiden Wochen sind flexibel aufgebaut, sodass neue Teilnehmer den Anschluss finden.
Nach der Anmeldung bekommst du Zugang zu allen bisherigen Materialien und kannst die verpassten Sessions als Aufzeichnung nacharbeiten.