I’m wondering if anyone has any idea what sort of grid was used in the making of the site in the attached image below? I’m looking for something similar and was just curious as to how this page was organized (columns, rows, gutters etc) if anyone has any tips on the breakdown.
Thanks!!
Well, it’s awfully ugly, so I wouldn’t be looking to replicate it.
It’s sort of built like a printed newspaper page using a six-column vertical grid. I don’t see any particular organization going on horizontally.
Yeah, I was wondering what the hell was going on horizontally!
It looks like the Metro grid system (similar to the windows 10 start menu). If you look, you can break down each component into a rectangular module
6 columns yeah but ack that has to be the worst ad page for a newspaper I’ve ever seen. I would not recommend that you use this as a template.
It could be done so much better - its OK to mix 1,2 and 3 column-wide elements, but vertically you need some kind of system to avoid the empty spaces (like below the right hand part of the yellow box, above the right of the magenta box, etc.).
Any magazine or newspaper page must have some kind of vertical harmony to the elements, enabling all the columns to start and finish on the same measure.
It doesn’t even look like the layout was started with a grid. It looks like there was a lot of afterthought to align elements after they were already dropped on the page wherever they fit.
Just to be clear, this is for a website layout, correct?
I’ve seen many Wordpress templates offering up this layout as it’s generated automatically. This layout is called a “masonry grid”. I’d look into it, as the dimensions of your photo assets usually dictate the layout (Note: The vertical images tend to have less accompanying text).
