Swapped 12-column grids for named areas on a client site and never looked back

I used to spend an hour fussing with spans and offsets on a 3-column layout, then last month I tried grid-template-areas with named sections like 'sidebar' and 'content', and it read like plain English. Has anyone else found named areas harder to debug when the layout gets more than 5 sections, or is it just me?

1 comments

1 Comment

gavinwood8d ago

...and honestly the named areas thing is fine until you have nine boxes with names like 'heroSidePanel' and 'footerCTAsecondary' and then you're basically reading a novel just to figure out which div goes where. The real fun starts when someone renames a section and the whole layout silently breaks because the CSS is now pointing at a ghost. I went back to numbers for a project with twelve widgets and it was boring as hell, but at least I could count. Named areas are great for a landing page with three blocks. Past that, it's just a map where the streets keep moving.