Should The Grid Be Visible?

Vormgevers exhibition poster in 1968 by Wim Crouwel

A couple of recent designs have left me wondering whether we should be ‘showing our workings’ and display the grid at all, whether subtlety like Jina Bolton’s Sushi & Robots or something more elaborate, like Analog (note: press Alt+G).

Once visible, the precision of the grid acts as evidence of design credibility, and its purity of form has a mystical draw.

A Brief History of Grids, Lucienne Roberts http://www.graphics.com/modules.php?name=Sections&op=viewarticle&artid=620

Having a visible grid is certainly not new; Here you can see the Vormgevers exhibition poster in 1968 by Wim Crouwel.

I’m certainly not going to say if the grid should be visible or not, but I’d love to hear your thoughts or opinions on the topic, or just to add a link to a site where you have seen a visible grid used well.

7 thoughts on “Should The Grid Be Visible?

  1. Paul Post author

    I sometimes think they are only put there for the designers benefit and don’t enhance the design; In other instances, they seem to hold the whole design together

  2. Ben Bodien

    As you say, I think they do an excellent job of highlighting the underlying structure of a layout, as long as the grid is displayed subtly (as yours is here). Whether it’s only designers who pick up on that or not, I don’t know, as I’m a designer and a lover of grids so I tend to spot them quickly every time.

    Avoid them to avoid the cliche, or if a grid being displayed doesn’t match the design direction or somehow impedes the function of the site.

    I think the easter egg approach as used by Analog is the nicest way. With that said, our grid at http://neutroncreations.com is on proud display in the header, but not further down where we encouraged Elliot Jay Stocks to deliberately emphasise the seemingly chaotic layout, without revealing any order behind it.

  3. Paul Post author

    Great points Ben. I’m designing a site at the moment where the grid is so obvious, it looks a little regimented (even without displaying it).

    I guess a design could even lose a little bit of it’s magic if the grid is shown, especially for complex layouts where the grid isn’t obvious at first.

  4. Martin Bean

    I don’t think the grid should be shown, no. At the end of the day, it’s only going to be designers who are nosey and looking to see if a grid’s been used. If they find it they can nod in approval; if not they can feel slightly taller and superior.

    The grid won’t mean a lot to the average web surfer. They’ll just wonder why they have “squared paper” on their website. I know if I added a visible grid to one of my client’s sites I’d get an angry phone call pretty quickly.

  5. Paul Post author

    An interesting perspective Martin. I guess as designers you can sometimes forget what the ‘average web surfer’ will think.

  6. Ethan Resnick

    Should the grid (generally) be visible? Hell no.

    As designers, our role is to curate content for our users, to make it clear and approachable. And our best friend in presenting our content effectively is the grid, but it isn’t content itself. Showing the grid adds no value to regular user and adds an unnecessary visual element that detracts from the hierarchy of the real content.

    That said, there are exceptions, namely, when the grid is actually content. One example, might be on the site of a design firm, where they’re trying to show “designedness.” In cases like that, a subtle presentation of the grid could be acceptable. But those are the vast minority of cases.

  7. Bruce

    Great points Ben. I’m designing a site at the moment where the grid is so obvious, it looks a little regimented (even without displaying it).

    I guess a design could even lose a little bit of it’s magic if the grid is shown, especially for complex layouts where the grid isn’t obvious at first.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>