Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Is it time to ditch the design grid?

css-irl.info

Post reply on HN
Print view View original

21–30 of 31 posts

Re: Is it time to ditch the design grid?

#21

Post by IfOnlyYouKnew »

No, but it’s time to drop the frameworks. Their only purpose was to make grid designs work, and CSS has caught up a while ago.

> Designers will often prescribe that an element should span (for example) four out of 12 columns on a desktop screen, without the knowledge that their idea of “columns” on the web bears no relation to how the layout may actually be built.

I won’t doubt the author’s lived experience. But in mine, designers aren’t as clueless as they are presented in this quote and in many discussions here.

Re: Is it time to ditch the design grid?

#22

Post by itronitron »

djstein wrote: post #2

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

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

Re: Is it time to ditch the design grid?

#23

Post by gpspake »

IfOnlyYouKnew wrote: post #21

No, but it’s time to drop the frameworks. Their only purpose was to make grid designs work, and CSS has caught up a while ago. > Designers will often prescribe that an element should span (for example) four out of 12 columns on a desktop screen, without the knowledge that their idea of “columns” on the web bears no relation to how the layout may actually be built. I won’t doubt the author’s lived experience. But in m…

This is my take too. Bootstrap and foundation's float hack grid systems kept us alive while CSS caught up to "OMG we need to display websites on mobile devices" Then grid and flexbox came along and gave us a native css solution. Then everyone moved on to figuring out SPAs - or as I call them "OMG we need to display websites on mobile devices 2.0"

Re: Is it time to ditch the design grid?

#24

Post by Buttons840 »

brailsafe wrote: post #9

I think web designers could stand to study actual grid based graphic design and see how that applies to our current capabilities on the web. As for layout frameworks, I tried to learn them, but as far as I could tell they simply made bad/half assed design faster and easier. For a laughable amount of time they assumed you were building a desktop size column-based layout that was supposed to shrink, and anything differ…

> actual grid based graphic design

Got any suggestions on where to start? I could Google, but I wouldn't know if what I found was "actual" grid based graphic design. I'm not trying to be snarky, I'm sincerely interested in non-web-based graphic design resources.

Re: Is it time to ditch the design grid?

#25

Post by vitovito »

Buttons840 wrote: post #24
brailsafe wrote: post #9

I think web designers could stand to study actual grid based graphic design and see how that applies to our current capabilities on the web. As for layout frameworks, I tried to learn them, but as far as I could tell they simply made bad/half assed design faster and easier. For a laughable amount of time they assumed you were building a desktop size column-based layout that was supposed to shrink, and anything differ…

> actual grid based graphic design Got any suggestions on where to start? I could Google, but I wouldn't know if what I found was "actual" grid based graphic design. I'm not trying to be snarky, I'm sincerely interested in non-web-based graphic design resources.

The Grid Book, by publication designer Jan V. White: https://archive.org/details/gridbookguidetop00whit

Re: Is it time to ditch the design grid?

#27

Post by munk-a »

jjoonathan wrote: post #26
jdowner wrote: post #3

Weeee! Back around again...

Let's make a new HTML element for this. Let's call it... table, because the grid is like a table on which you draw things. This is gonna be legendary!

I've got some rounded corner jpegs in my other coat in case you need them to affix at the intersection of two border images. Modern web here we come!

Re: Is it time to ditch the design grid?

#28

Post by munk-a »

shaicoleman wrote: post #11

I agree that the 12 column grid system isn't great. Our company uses the 8 point grid system, and it makes everything neater and visually consistent, and it looks great across all zoom levels. https://tanzu.vmware.com/content/built-to-adapt/intro-to-the...

That, I think, is the wrong take-away. You're forcing elements into even more strictly defined buckets that can't scale responsively to different devices.

I, personally, prescribe to the 1px grid system - where I write all my widths, heights and offsets in multiples of 1px. It helps keep things consistent.

Re: Is it time to ditch the design grid?

#29

Post by munk-a »

IfOnlyYouKnew wrote: post #21

No, but it’s time to drop the frameworks. Their only purpose was to make grid designs work, and CSS has caught up a while ago. > Designers will often prescribe that an element should span (for example) four out of 12 columns on a desktop screen, without the knowledge that their idea of “columns” on the web bears no relation to how the layout may actually be built. I won’t doubt the author’s lived experience. But in m…

I don't know about dropping frameworks so much - they allow companies with very little incentive to invest in mobile (nearly all our users are desktop based) to get half-decent mobile layouts with a minimum amount of investment.

Re: Is it time to ditch the design grid?

#30

Post by neovive »

I agree that it's great to break out of the rigid 12 column grid, but for most devs -- without formal design training -- a basic grid helps with sizing, spacing and alignment.

One thing I enjoy when working with Tailwind is the ease at which I can experiment with flexible layouts and jump into a grid, when needed for alignment and sizing. When working with more opinionated CSS frameworks, you're pretty much forced into the 12 column grid pattern -- unless you're comfortable customizing the framework.

Post reply on HN