Serif vs Sans

Seven simple steps to better design, sans designer

Lately, I’ve found myself giving a substantial amount of design feedback to non-designers. While I always maintain that you ought to leave design to professionals, sometimes this just isn’t feasible for one reason or another. So, in the interests of public service (prettiness making the world a better place, and whatnot), I’d like to offer up some suggestions that should improve your design across the board.

1. More whitespace!

Every time I give someone feedback on designed pieces, I find myself repeating this over and over and over. (Programmers are notoriously bad about this, for some reason.) Consider the look and feel of a store layout—generally speaking, those with higher-quality merchandise tend to have more space between displays. The same is true for design; more whitespace will give an impression of higher quality. Move related elements together; decrease the spacing between lines of text, don’t butt text against a solid shape, and don’t be afraid to leave empty space. This gives the eye a chance to rest and prevents your design from looking like an ad for a car sales lot.

2. All hail the 66-character line!

The ideal line length, in terms of legibility, is widely believed to be around 66 characters long. Of course, this isn’t a hard-and-fast rule, but generally speaking, your text will be far more readable if the lines measure somewhere between 50 and 70 characters. I’m pretty good at eyeballing this now, but I still always check my line lengths with a simple character count tool to make sure they’re good.

3. Go left of centre.

Unless you’re designing a wedding invitation, avoid a centred alignment, which generally gives a highly classical look to any design piece. It can work nicely for old-styled invitations, frontispieces, or labels, but generally it just looks overly formal. A left-hand alignment of elements makes for a more readable text (unless you’re working with a right-to-left language, that is.)

4. Keep it in the (font) family.

Typically, two fonts is all you need for a well-balanced design. Too often people try to use too many “fun” fonts and end up with a chaotic mess. Select two fonts—one serif, one sans—and stick with them. (If you pick fonts with a variety of weights and styles—bolds and italics and such—you’ll have more options in terms of formatting.) A serif font has little sticks and stems on the ends of the lines, which help guide the eye from one letter to the next. Accordingly, they tend to be better suited for long passages of text.

Serif vs Sans
A serif font (Mrs. Eaves) compared to a sans-serif (Gotham).

Stay away from the following fonts: Comic Sans, Papyrus, Trajan, Arial, Times New Roman, unless you have a really great reason for using them. FontSquirrel has a great selection of free and well-crafted fonts you can download and use for anything you’d like.

5. Get up in your own grid.

Using a grid will magically help your design look cohesively and professionally-designed, even if it isn’t. A grid will also lend the whole thing an overall sense of order and structure, particularly useful when working on a design that contains lots of information. While there’s quite a lot to grids (and they’re something I plan to touch on in more detail in another post), basically this involves aligning your elements to an “invisible” grid pattern. 960.gs has excellent templates available for most design programs as well as a number of great tools for websites.

Grid structure
This website makes use of an underlying grid structure!

6. Become a feedback monster.

My roommates and the people around me are probably more than a little tired of this habit of mine, but I ask everyone who’ll listen to me for opinions of my work. It’s easy to miss things when you’re working on something, and other people will often perceive your work in unexpected ways. You don’t need to use every crackpot suggestion, but taking them into consideration will improve your work.

7. Microsoft Word = The Devil.

Above and beyond any of its varied other failings, it is very difficult to make anything look nice in Word. Use OpenOffice if you really like word processors, or the range of (also variably flawed) Adobe products created for professionals, or their equally powerful freeware alternatives.

These are just some very basic suggestions and tips; if you’re serious about making things look better, pick up a copy of The Non-Designer’s Design Book. Or, hire a designer.

Like this post? Hate this post? Let’s talk about it.