In diesem Workshop wird Web Performance anhand der Core Web Vitals untersucht. Im Mittelpunkt steht die Frage, wie schnell, stabil und reaktionsfähig Webseiten aus Sicht der Nutzerinnen und Nutzer wirken.
Dazu werden zunächst grundlegende Begriffe und Messmethoden erklärt, bevor verschiedene Webseiten mit Tools wie PageSpeed Insights, Lighthouse und Chrome DevTools analysiert werden. In einer praktischen Übung untersuchen die Teilnehmenden eine Beispielseite, ordnen Performance-Probleme den passenden Metriken zu und entwickeln konkrete Optimierungsvorschläge.
Web Performance verstehen: Einführung in den Begriff Performance und Einordnung, warum Performance nicht nur eine technische Kennzahl, sondern ein zentraler Bestandteil der Nutzererfahrung ist.
Core Web Vitals als Bewertungsgrundlage: Erklärung der zentralen Metriken LCP, INP und CLS sowie deren Bedeutung für Ladeverhalten, Reaktionsfähigkeit und visuelle Stabilität.
Messmethoden und Datenquellen: Vergleich von Labor- und Felddaten sowie Einordnung von CrUX und Real User Monitoring zur Bewertung realer und simulierter Nutzungssituationen.
Toolgestützte Analyse: Praktische Arbeit mit PageSpeed Insights, Lighthouse CLI und dem Performance-Bereich der Chrome DevTools zur Messung und Interpretation von Web-Performance-Daten.
Optimierungspotenziale erkennen: Analyse einer Beispielwebseite, Zuordnung von Problemen zu den Core Web Vitals und Ableitung konkreter Optimierungsstrategien für LCP, INP und CLS.
Dieser Workshop richtet sich an Studierende und Webentwicklerinnen und -entwickler, die verstehen möchten, wie Web Performance gemessen, bewertet und verbessert werden kann. Der Fokus liegt darauf, Performance nicht nur als Ladezeit zu betrachten, sondern als Teil der Nutzererfahrung zu verstehen. Die Teilnehmenden lernen, Messergebnisse richtig einzuordnen, typische Performance-Probleme zu erkennen und daraus konkrete Optimierungsmaßnahmen abzuleiten.
Um einen direkten und reibungslosen Einstieg in die Praxis zu gewährleisten, sollten folgende Komponenten im Vorfeld auf dem eigenen Gerät installiert bzw. vorbereitet werden: