5 ms·

Visually, the "no" grid website [0] just looked like a website created with CSS Grid. I was expecting some sort of design that would be different. Are we missin

Visually, the "no" grid website [0] just looked like a website created with CSS Grid. I was expecting some sort of design that would be different. Are we missing something? [0]: https://gridless.design https://gridless.design

oo0shiny 5y ago
I think the idea is not that the design is without a grid, but more on how it handles being resized. The video in the article does a good job of explaining it.
- michaelscott 5y ago
  The principles of a grid-based design are still adhered to though. This isn't "gridless" in any real sense (other than maybe its handling in CSS?) from a design perspective. Maybe a better term is "adaptive grid" or something similar, which would make more sense in the design for something in a shifting and dynamic medium.
  - dgb23 5y ago
    I agree, it is talking about a specific type of grid, where each column gets to have a fixed fraction of the parent container: 1fr 1fr 1fr 1fr ... 12times or so Many CSS frameworks will provide a default grid system like this, and many designers will think in terms of such a grid. But the author suggests that this is too rigid. And in fact a frontend developer will then have to interpret the rigid grid to be more adaptable and have either multiple flex grids for different breakpoints or use CSS grid to express more flexible flows.
dgb23 5y ago
This isn't an article about CSS features, nor is the linked site. This is about how designers think about their design and how that doesn't translate well into CSS. Both articles are trying to bridge the gap between design and implementation based on the reality of web content and browsing. Also from the article: > Paradoxically, where CSS Grid shines is not only in building layouts that adhere to a strict design grid, but in baking flexibility into our components.
itronitron 5y ago
I was surprised by how many right angles, rectangles, and perpendicular lines I saw for a site focused on not using a grid.

oo0shiny 5y ago

I think the idea is not that the design is without a grid, but more on how it handles being resized. The video in the article does a good job of explaining it.

michaelscott 5y ago
The principles of a grid-based design are still adhered to though. This isn't "gridless" in any real sense (other than maybe its handling in CSS?) from a design perspective. Maybe a better term is "adaptive grid" or something similar, which would make more sense in the design for something in a shifting and dynamic medium.
- dgb23 5y ago
  I agree, it is talking about a specific type of grid, where each column gets to have a fixed fraction of the parent container: 1fr 1fr 1fr 1fr ... 12times or so Many CSS frameworks will provide a default grid system like this, and many designers will think in terms of such a grid. But the author suggests that this is too rigid. And in fact a frontend developer will then have to interpret the rigid grid to be more adaptable and have either multiple flex grids for different breakpoints or use CSS grid to express more flexible flows.

dgb23 5y ago

This isn't an article about CSS features, nor is the linked site. This is about how designers think about their design and how that doesn't translate well into CSS. Both articles are trying to bridge the gap between design and implementation based on the reality of web content and browsing. Also from the article: > Paradoxically, where CSS Grid shines is not only in building layouts that adhere to a strict design grid, but in baking flexibility into our components.

itronitron 5y ago

I was surprised by how many right angles, rectangles, and perpendicular lines I saw for a site focused on not using a grid.