Cathy has produced an exceptional overview of modern responsive/intrinsic design best practices. From fluid units, to content-led design, to subgrid, pretty much every current or on-the-horizon feature of CSS/HTML is covered.
That includes some very interesting thoughts on the potential limitations of container queries, which was nice to see. Plus, what is hands-down the best explanation of how the new min()
, max()
, and clamp()
functions actually work (maybe this time it'll stick 😄).
On the fact that design has fundamentally changed (oh how this resonates right now):
What I learned the hard way was that you can’t just add responsiveness at the end of a project. To create fluid layouts, you need to plan throughout the design phase.
On the benefits of subgrid in CSS (their example showing cross-component adaptation is simple yet very clear):
CSS Grid allows us to separate layout and content, thereby enabling flexible designs. Meanwhile, Subgrid allows us to create designs that can adapt in order to suit morphing content.
On the core of responsive/intrinsic/inclusive design today:
Good design for the unexpected should allow for change, provide choice, and give control to those we serve: our users themselves.