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.
Interview with Wim Crouwel.
Examples from the Total Design portfolio
Mark Boulton applying Tschichold's principles to the web.
One of the best blog posts about designing with grids, one of the tools Hui Jing shows is to sketch a grid with pencil and paper.
There's a proposal for having ratios between rows and column spacing using the ar unit.
Rachel Andrew on supporting browsers without Grid.
Maaike de Laat on working together and how developers should show designers more of what's possible.
“Web design is about finding the right compromise”
“It is the nature of the web to be flexible, and it should be our role as designers and developers to embrace this flexibility (…)”
In which Swiss design posters have been recreated on the web with beautiful transitions.
The inventor of Suzy explains she doesn't use Suzy anymore either (great talk with fantastic Grid Layout examples)
Some examples to get started with Grid Layout.
Great examples of many possible lay-outs using Grid.
Rachel Andrew has an in-depth CSS Layout workshop
A game to learn flexbox properties
A game to learn CSS Grid Layout properties