Responsive Web 101

When we hear “responsive design”, it brings diverse device sizes to mind. In discussions with clients, developers, and designers, we frequently encounter the belief that responsive design is simply creating two versions of a webpage: one for desktop, and one for mobile. However, such an approach feels outdated now. Beginning in 2010 and advancing to the current day, 2023, the landscape has significantly transformed. Responsive design has taken a journey from its early days with fluid grids, flexible images, and CSS media queries, to the addition of container queries, and more today. In this talk, we’ll delve into concepts like mobile-first and desktop-first, go over daily use layouts like grid items and cards, and explore how new advancements in CSS can assist us.