What kind of order? Why of course, the kind that reflects the designer’s view of the world as she feels it should be. Her choices can be understood as an expression of her particular ideas of the way the would should function. It’s a small, limited form of tyranny imposed on an even smaller corner of the world.

Maybe I’m projecting here. Because what I’ve described is essentially an account of what first attracted me to design.


Eventually, I came to realize that in graphic design grids are the most powerful method of creating an orderly foundation for creativity. I had been trying to use them for years with mixed results, without proper training and usually without proper preparation. It’s been said that graphic design amounts to little more than “lining stuff up,” and for many years, that’s more or less all I did. Most of my designs employed ad hoc grids, poorly planned columns that would arise spontaneously as I tried to “line things up.” Of course, they rarely provided a stable base on which to build well-considered designs. This was especially true when I would haphazardly revise them as I went along, having almost always skipped the necessary stage of planning out the units and columns.

It took me a long time to learn how to use grids, but I learned, through trial and error, reading, poring over work from more talented designers, more reading, lots of experimentation, and finally even more reading. Grids, I came to understand, are a much more deeper subject than superficial appearances suggest.


By virtue of their relation to one another on the same plane, whether spread to the far corners of the page or situated tightly side by side the two dots we’d made suggested structure. Even in this rudimentary and skeletal form, the implication of structure was there. Indeed, the lesson was this: any time more than one element is present, there is the suggestion of a human agenda at work, a pattern of order being imposed. Design is nothing if not order applied to disorder.


Whether a designer works in print, on the Web, or in some other media, it’s my belief that the biggest benefit grids provide is that they are excellent facilitators for creativity.

For those with only a passing familiarity with what it means to work with grids, this assertion might seem counterintuitive. Many novices assume that grids are by appearance — and therefore by nature — confining, that they restrict freedom of expression and stifle creative impulses.


To say a grid is limiting is to say that language is limiting, or typography is limiting.

We can think of grids, therefore, as a springboard for creativity. They lay a foundation through which a designer can create solutions to problems large and small, and in doing so help readers, users, and audiences find that which all human seek: a sense of order within the disorder.


On the other hand, a user of an interactive system can sense that the features of that system — its content, its tools, its navigation — are constructed according to some overarching design. If he encounters some evidence that there is order in place, his confidence in and sense of ease with the system increases dramatically. An ordering system need not announce itself, and it may never be consciously understood, but its presence is nevertheless significant.


How different? To answer this, it helps to think of these two modes as everyday communications: the declarative tradition as a speech given before an audience, and the conversational mode as, well, a conversation between friends or acquaintances.

A speaker invited to address a crowd may not be able to predict perfectly how well her talk will go over, but she still has a good idea of the conditions under which she’ll deliver it: at a podium, on a stage, with the audience sitting facing her, saving their questions until the end. By contrast, a conversation might begin with a clear agenda and a proactive participant may help to guide the discussion, but conversations are nearly always as unpredictable as they are predictable, if not more so.


The printing press undercut the persuasiveness of storytelling and conversation.


Designers should not force every element and interaction to occur within the grid. It’s the designer’s job to make certain decisions for the user — not every decision, but enough so the user can accomplish his goals unhindered.


We first judge truly good design not by its beauty or its innovativeness or its efficiency, but rather by how well it responds to its original problem. Successful solutions demand that the designer grasp the problem presented to her and the constraints within which she’s working. The designer has to ask and understand the answer to questions such as: who is the audience, what is the context, when will the solution be encountered, how will the solution be used — and even why is the solution necessary?


Of course, designers will bemoan the inconvenience of constraints, or perhaps the thorniness of some of the particular constraints they must contend with. If only those constraints were lifted, if only the problem were slightly different, then the solution would be much easier to arrive at or more elegant in nature.

However, these constraints have a silver lining: in some ways they might make a problem more difficult, but they can also make it easier to arrive at a design. Comprehensive solutions like grids can often benefit from being built around one or two nonnegotiable constraints, immovable requirements that can’t be easily altered during the design process. To begin with, they can directly influence the proportions of a grid, they very sizes of the units, columns, and regions that the designer constructs. These kinds of constraints might appear to limit the options available to a designer, they very often also have the effect of increasing a designer’s inventiveness. The more wide open a design problem and the less restrictive the constraints, the less a designer is likely to make those insightful leaps of logic that are the hallmark of great design. Nonnegotiable constraints can help spur a designer to do this.


It’s important to note that the baseline grid, even more than the columnar grid, is only a set of guidelines, and is not meant to be strictly obeyed. Again, there are too many elements on most web pages to affix or align each one to the baseline grid. Doing so would require a mathematical rigor that, if it can be achieved, might produce rationally exact measurements and placements but will most likely be something less than elegant.


There’s also the argument that the home page is the most prominent page on the site, the face and gateway to the content. Again, this is a completely valid argument, but in the direct access world of the Web, it’s the content itself that often matters most. The homepage, after all, is usually an index of content.


Note that the enlarged avatar is 110x110 pixels in size. This allows it to conform to the grid and remain proportional to the smaller avatar icons. This is one of the most pleasing side effects of using a well-developed grid: at times, the design seems to guide itself, without requiring arbitrary design decisions.


While designers must continue to share control over the experiences of their products with users, those users want guided experiences. It’s a mistake to assume that responsive web design means giving user full control, because in reality what every user wants is only some control. User expect the designer not only to have embraced the medium, but also to have mastered it sufficiently to be able to exert some control over it.