Some of the world's greatest print design was made on known canvases, with known content using known color options. On the web, we have more flexible tools. Media queries, flexible units, Grid Layout and Flexbox let us do great graphic design. With flexibility.
In this talk, I will show some of the CSS that puts great graphic design into practice on the web. Get inspired by some of the icons from the history of graphic design, while learning new properties that you can use in projects today.
Fantasai's idea for a Grid Layout workshop. After the event in Amsterdam, I decided to want to learn more than just the CSS.
The first major book about modernist graphic design, originally written for printers, but super interesting for anyone who likes typography.
Inspired by Tschichold, in this book Müller-Brockmann explains why and how to create grids.
Mark Boulton applied Tschichold's principles to the web many years ago.
Great post about a process for designing with Grid. My presentation shows the example layout plus sketch, as I think it not only works great for deciding on flexible vs fixed, as Hui Jing mentions, maybe it could also help us decide about where to put whitespace and where to put content.
I talked about some mathematics the browser gives us for free. More maths may be coming as this proposal would give us ratios in whitespace (between column and row spacing).
Rachel Andrew discusses various approaches to fallbacks for Grid Layout and also what supports means when talking about Grid Layout. Rachel also hosts an online workshop about Grid Layout.
Maaike de Laat encourages front-end developers to show designers what's new
The article that sparked the whole responsive design movement. It becomes more relevant every year, because there are more things with browsers on them every year.
Some examples to get started with Grid Layout. Also check out Jen's Experimental Layout Lab while you are there.