Neue Rasterkonzepte für responsive Websites – Potenziale moderner CSS-Technologien
TL;DR: In diesem Projekt geht es darum, die neuesten CSS-Features – insbesondere Grid, Subgrid, Flexbox, Media- und Container-Queries – systematisch zu untersuchen und kreativ zu kombinieren. Ziel ist es, neue, praxisnahe Rasterkonzepte für responsive Websites zu entwickeln, die technisch modern und gestalterisch überzeugend sind.
Projektvorschlag (Bachelor- oder Masterarbeit) Titelvorschlag: Neue Rasterkonzepte für responsive Websites – Potenziale moderner CSS-Technologien
Ausgangssituation: Webdesign und Frontend-Entwicklung haben sich in den letzten Jahren stark weiterentwickelt. Mit modernen CSS-Features wie Grid, Subgrid, Flexbox, Media Queries und Container Queries stehen heute mächtige Werkzeuge zur Verfügung, die flächendeckend von aktuellen Browsern unterstützt werden. Dennoch werden viele Websites weiterhin mit konventionellen Layout-Ansätzen gestaltet, die das Potenzial dieser Techniken nur teilweise ausschöpfen.
Ziel der Arbeit: Ziel ist es, das gestalterische und technische Potenzial moderner CSS-Technologien für den Aufbau flexibler, ästhetisch anspruchsvoller und performanter Layout-Raster auszuloten. Die Arbeit soll sowohl eine theoretische Untersuchung aktueller Konzepte und Best Practices als auch eine praktische Erprobung in Form von Prototypen umfassen.
Aufgabenstellung:
- Analyse des aktuellen Stands zu CSS-Grid, Flexbox, Container Queries und verwandten Technologien
- Vergleich bestehender Layout- und Rasterkonzepte im Webdesign
- Entwicklung neuer kombinatorischer Ansätze (z. B. Grid + Container Queries + Subgrid)
- Umsetzung ausgewählter Konzepte als interaktive Prototypen (Proof of Concept)
- Bewertung der Ansätze hinsichtlich technischer Umsetzbarkeit, Flexibilität und Designqualität
Besonderheit / Interdisziplinarität: Das Thema liegt an der Schnittstelle von Technik und Gestaltung. Es eignet sich besonders für Studierende, die Freude an visuellem Design, CSS-Architektur und experimenteller Frontend-Entwicklung haben. Eine Kooperation mit Design-Studierenden oder Designer:innen ist ausdrücklich erwünscht, um gestalterische Anforderungen und technische Umsetzung eng miteinander zu verzahnen.
Anforderungen:
- Interesse an Webtechnologien, Responsive Design und moderner CSS-Architektur
- Kenntnisse in HTML, CSS und grundlegender Webentwicklung
- Offenheit für gestalterische Fragestellungen und konzeptionelles Arbeiten
- Freude am Experimentieren und Dokumentieren von Design- und Implementierungsprozessen
Schlussfolgerung:
Die Arbeit bietet eine hervorragende Gelegenheit, den aktuellen Stand des Webdesigns kritisch zu beleuchten und mit innovativen Layout-Konzepten weiterzudenken. Sie verbindet technische Präzision mit gestalterischer Kreativität – und kann so einen Beitrag dazu leisten, das Web der nächsten Generation nicht nur funktional, sondern auch ästhetisch weiterzuentwickeln.