How I learned to stop worrying and love the grid

About a year ago, I took the plunge in to grid-based web layouts. For a long time, I felt that grids were too restricting for creative design and limited your choices and direction for development.

Oh how wrong I was.

The use of the grids is quickly becoming a standard for rapid template generation. Designers are going back to their print shop roots and finding that the same paradigms can be incredibly useful in the responsive web design world. Before you drink the Kool-Aid, let’s go over a few pros and cons of using grids and how we can overcome them.

“Grids are great!”

Grids are great for a large websites with tons of content, much like an .edu site. It allows developers and designers to setup a series or rules for where content should go, and leave little to no surprises when building out new pages.

Grids and responsive design go hand in hand, allowing the developers to write some simple media queries for the grid markup to have it shift in predictable, visually appealing ways across the entire site making a mobile device friendly site easier to contain.

Grids allow supreme flexibility as well as a stable baseline across all browsers (I’m looking at you IE) for you to build off of. The floating columns allow the use of vertical space as well as horizontal markup, allowing you to stack elements without worrying about the usual problems you may face.

“Grids are awful!”

Grids have the potential to restrict creativity if the designer is too aware of their looming presence.  A designer with a working knowledge of the code behind their design might find something as concrete as a grid to be a deterrent in pushing his layout to the next level.

Using a grid for the first time is intimidating; it often can be overwhelming for a young developer to start using a pre-built grid layout with no prior experience. Once you get your feet wet with grids though, I doubt you’ll ever want to look back.

Breaking free of the grid when you need to can be hard. In a perfect world, every variable would fit into neat containers and we wouldn’t have any surprises.  Unfortunately, that is rarely the case. Sites often call for an unexpected addition that your grid can’t handle and making exceptions for things can quickly spiral out of control.


In the end, grids aren’t made for everyone and every site. It’s up to you, the developer, to know when using a grid system will benefit your clients and yourself. I urge everyone out there to get a taste of what grids can do before you write them off completely.