Whenever a blogger browses through blog layouts, one decision is whether to choose a grid or masonry design.
When you’re considering a new design for your blog, you have plenty of options, especially if you use WordPress. WordPress offers thousands of themes for free in its theme repository. But you can find other sites that offer blog layouts that you can purchase that may offer additional features.
Among the choices you’ll have to consider is whether to go with a grid or masonry layout. While the two classifications are fairly self-explanatory, it still may help to see simple examples.
Grid layout
I can give you two television shows that provide perfect examples of what a grid layout looks like: The Hollywood Squares and The Brady Bunch. Both featured grids — during gameplay on the former and in the opening and close on the latter.
A grid places blog posts, particularly on a blog’s home page or search result pages, in nice neat columns and rows. Some people feel it’s easier on the eyes. Others, however, may feel it’s too predictable.
The mockup to the left shows roughly what a grid would look like. Imagine each blue square contains a headline and introductory text of a blog post. It might even include a thumbnail of a post’s featured image.
The grid layout may not necessarily place the elements in an actual box.
It’s just that they’re arranged in a “boxy” lineup so that everything looks neat and even. That means that some posts may have a little extra white space between them because shorter pieces are still set alongside longer pieces to maintain row height.
The front page of Patrick’s Place, in case you hadn’t noticed, is in the grid format.
Masonry layout
If the grid layout keeps things neat and even, the masonry layout is a little more out there. It maintains column width across the page. But when it comes to row height, well, that’s out the window.
Within each column, the length of the post excerpts determine when one position ends and when the next one begins.
The mockup to the right gives a rough example of what a masonry layout might look like. Again, each blue square represents a headline and an excerpt of the blog post. A thumbnail of the post’s featured image might also be part of the square.
And there won’t necessarily be a box around the post excerpt.
But as you can see by the varying sizes of each individual element, there’s less organization when go from column to column.
The masonry layout looks more like the layout of a newspaper’s classified section.
If you have obsessive-compulsive disorder, a masonry layout may be too “cluttered” for you, just as the grid layout might be too dull for others.
Which is the better choice for a blogger?
Most blogs have what is called “blog layout.” On the front page, that’s one post, followed by another, followed by another. In some cases, you see the entire posts. In other cases, you see fixed-length excerpts. But they’re all one after the other in a single column.
But for many front pages or even category or search pages, bloggers may choose alternate blog layouts. Some may select a grid while others may select a masonry layout to display a larger number of posts (in the form of search results) in two, three or four columns. This blog, as I said, uses a grid layout. If you have every used Pinterest, you’ve seen the masonry layout.
As to which one is better…well, that’s a difficult question.
Blog layout is a fairly subjective thing. There are certain layouts that I like as a reader and certain ones I don’t. But no matter which ones I favor, that may not be the same ones you do.
There’s no right or wrong answer when it comes to the “best” of the two blog layouts. In all honesty, you have to select which you think looks best for your site and which works best for your content.
For me, the grid layout worked best since I have multiple topics and I wanted all of them to be easier to differentiate. But I’ve seen some blogs work well with the masonry layout.
One of the best things about blogging — and blog layouts — is that you have the freedom to experiment and see what does work best for you and your readers!
