Do you consider the "960 Grid System" one of the "Holy Grails" of User Experience layouts? [closed]

Question

Is there a "Holy Grail" of layout?

I recently redesigned a website for a client (University of Connecticut Coop), where I happened upon a link in their old code to this article: "http://www.alistapart.com/articles/holygrail".

Upon researching further, I also came across the "960 Grid System": "http://960.gs/demo.html"

I then began to wonder..."Am I missing something here? Is there a consensus among design professionals regarding the best User Experience for layouts?"

So, I put it to you: "Is there a "Holy Grail" of layout?"

Answer 1

There are no grails. And it's true not only for layouts but for design in general. There are lots of rules, recommendations, tips. But no grails and no laws. Since design is not a science it's apt to get around any laws. And as Nathanael said every "rule" has exceptions. More than that: none of assertions of this sort can possibly be viewed as a general rule. They are right only sometimes.

For less experienced designers it may be good to blindly follow some "laws". It helps to achieve better results. But as long as you understand the meaning of such a rule (be it 960 Grid System or any other) you can decide when to follow it and when to ignore. And this understanding helps to achieve much better results.

Answer 2

Generally speaking, using a grid system is nearly always a good idea: it's simply one of the best available tools to visually organise (i.e. compose) your content in a coherently structured, well-proportioned, yet sufficiently flexible manner. You might want to think of it as best practice. Most good designers regularly use them, unless it makes sense to go for a true freestyle composition approach (in most cases it doesn't, even less on the web and on the desktop – the use of a grid does not need to be obvious at all, BTW). Designing a good grid system that is well suited for a specific purpose and all necessary content requires some training though (at least anybody experienced in typography and similar areas of graphics design should be able to do it).

960gs and the like (e.g. blueprint) on the other hand are ‘just’ good frameworks to simplify technically implementing a working grid system across browsers without re-inventing the wheel each time (heck, that's what frameworks are for :-)) Mind you, you are not forced to use the default 12 or 16 column grid. These settings are, well… just a good default to start from. ;-) But in the end you might want to roll your own. Understanding grid systems comes first though, anyway.

See e.g. http://www.subtraction.com/pics/0703/grids_are_good.pdf and http://www.thegridsystem.org/ for starters. Mark Boulton has a great tutorial on how to design grid systems: http://www.markboulton.co.uk/journal/five-simple-steps-to-designing-grid-systems-part-1

Answer 3

No. 960 is an option that can help guide design by giving you a "snap to grid" approach to wireframing and often a higher likelihood of clean implementation with things in alignment which is generally accepted to be a good thing - but as in all things with UX there are exceptions to such principals so don't jump into the 960 without first understanding its benefits and limitations and that it is suitable for the UI job you're applying it for.

Answer 4

I second the comments already posted - it is just another tool in the UX and web-design toolbox, and like any tool, there is a right time and wrong time to use it based upon the nature of the project, and the strengths/weaknesses of the 960 grid itself. It can obviously help speed up the creation of any html prototypes.

We certainly use the layout for quickly creating wireframes in Omnigraffle - once you have set up a template to match the columns (12 or 16) grid you can very quickly move and position elements. As with any 'rule' though - sometimes they need to be broken though if there is good reason to do so.

Answer 5

A CSS grid system is really more of a technical 'holy grail'. And not necessarily holy, or even a grail. But definitely a handy tool in that it can greatly reduce the effort that goes into building the presentation layer code.

I've found it invaluable on larger projects where large numbers of developers with little-to-no skills or interest in presentation layer production are on the team. I can build some basic guidelines and incorporate some Object Orientated CSS methods and they end up with a fairly flexible system for laying out the pages that is a lot less likely to break in their hands.

In terms of UXD, ideally, the perfect layout is the layout that caters to the particular design goals of the project. A CSS Grid framework can just make that particular layout a little easier to get into production.

Answer 6

I like the concept of the 960 grid as its divisible by so many different units. Your grid, if you find it suits your design then becomes really easy to slice up, you have some flexibility in the number of columns, and the math generally results in numbers that are pretty easy to work with.

Following a grid system can help you if your project is designing reusable "widgets" that might get shared across a range of websites. Standard building blocks can make development easier, and faster.

The ultimate proof though is the impact on your users. Does it help them get to their goals? Does it help generate the right business outcomes? Then great! Just don't limit yourself to other ideas or possibilities...

Answer 7

It may not be a holy grail but it has certainly given improved structure and aesthetic appeal since I've started to use it.

My complex multi-page web forms would be horrific without it...now they're just mildly scary ;)

N