Robin Williams, the friend to all beginning designers, points to four things that are critical: Contrast, Repetition, Alignment and Proximity (and yes, the acronym is CRAP!). You should get her book, "The Non-Designer's Design Book" and study it. Everything in it applies to the web as much as it does to print. It's easy to read and very clear. Then get "The Non-Designer's Web Book" and study that. I would add to her quartet: Message, Harmony and Relevance.
The Message the client wants to get across is the first thing you need to know, because it informs everything else. In successful photography, design, painting, writing, there is a simple trio of rules that are never broken: 1) Have a message; 2) Include only what contributes to the message; 3) Remove anything that distracts from the message. In a photograph of an athlete, you would use the shot of her in mid-air looking effortlessly graceful, and clone out the empty coke can and half-eaten sandwich in the background. As an artist, you have to know what you're trying to say. As a designer, you have to know what the client is trying to say. This is, after all, what the client is paying you for.
Harmony is another very broad requirement that you have to consider early. If the client has a logo and corporate colors, your site must use them and color that harmonize with them. You can't use typefaces that are similar-but-different for headlines and copy. A good rule for beginning designers is to use one sans and one serif that go together, and use only those two in the design.
Relevance comes at the very beginning of a design cycle. It applies to color, typography and general layout. You wouldn't use powder blue and baby pink for a design for a high-tech company website, nor for a hip-hop artist. That wonderfully edgy grunge typeface isn't going to work for a lawyer or accountant, but Times Roman might. (You would avoid Times for a site that needs to look modern.) A heavy metal band needs bold shapes and colors, high contrast, but a medical clinic or a baby clothes site would require a much softer look.
Contrast means dark vs. light, rich colors vs. tints, dark on light or light on dark. If your design calls for bold contrasts, the key thing is to make them BOLD so that they are clearly deliberate. Only one thing breaks a design faster than "almost-but-not-quite-the-same," which I'll get to in a moment.
Repetition places the same type of element in the same place and with the same colors or headline or shape every time. Spacing is consistent. Visual layout has a rhythm, just as music does. If your elements don't fall "on the beat" the viewer is made uncomfortable, just as a band whose rhythm is off is hard to listen to.
Alignment, lack of, is the surest way to break a design. There is nothing that screams "amateur" louder than things that don't quite line up. In print, we work to an accuracy of less than 1/1000th of an inch. You can place things way out of alignment, provided the displacement is bold, obvious and deliberate. But never, ever have 7px padding on a p tag and 8px on the h1. (As a side note: avoid centered layouts for anything other than a wedding or funeral invitation. Centered layouts are in repose, serene, motionless, which is almost never what you want. Beginners use centered layouts because they don't know how to align things.)
Alignment and Repetition are why grids are such a useful tool. Understanding these points will answer many questions about the use of grids.
- Proximity just means keeping things that belong together close to one another. A heading must be closer to the paragraph that follows than it is to the one above, for example.
Get those two books. They will change your designs. In the meantime, here's an exercise: write these seven points in a list, then visit 10 websites that you consider really brilliant and find where each of these points has been applied. Don't cheat. They will all be there, so don't quit until you find every one. Now take a look at your own designs, and find where one or more of these have been violated.
Practice these seven points consciously and deliberately. Before long, they will become instinctive, and your designs will reach a whole new level. That's a promise.
