Know the rules
before you break them
As a designer, it's important to know
the rules. That doesn't mean that you can't break the rules,
but you gotta know them before you can break them. At the very
least, you need to be able to explain to your boss or your customer
just why you broke the rules. This article will take a look
at some of the basic graphic design rules for typography, page
layout, Web design and color.
Typography
Do not use every font you own in one document If you're a designer,
it almost goes without saying that you own fonts. Lots of fonts.
Maybe even thousands of fonts. When you start using many of
those fonts in one document, the message gets lost in the jumble
of fonts. That doesn't mean that you have to stick to the tried
and true two fonts rule (one for headings and one for text),
just make sure there's a reason why you're using the fonts you
choose.
Serif type is easier to read than sans serif
The theory goes that serif type is easier to read because the
serifs draw your eye from character to character. Therefore,
sans serif type is best left to headings and short amounts of
text. The truth is that almost any font can be made readable
with the correct design. If you choose sans serif for body text,
remember that most sans serif types need more leading than serif
type. Sans serif can give your documents a very modern look,
and is often used as body text in Europe.
Do not put two spaces after a period
In the days of typewriters and monospaced fonts, two spaces
after a period were used to indicate the end of a sentence.
Today we are blessed with fonts that have characters of different
widths, and there is no longer any need to place two spaces
after a period. In fact, I recently read a book whose typesetter
did just that — put two spaces after every period. The problem
is the space creates a stop, rather than signifying the end
of a sentence. I actually did find this book difficult to read
because of this design flaw!
Do not use all capital letters
People read by the shapes of words, not letter by letter. When
was the last time you sounded out D-O-G while reading? Ascenders
and descenders are what makes it easy to quickly identify the
shape of a word. When you use all capitals, you have no ascenders
or descenders. The shape of almost every word becomes a rectangle,
and it's harder to read. That doesn't mean you can't ever use
all capitals. Short phrases or headings can work well in all
caps. Sans serif tends to work better in all caps than serif
type; the serifs can actually detract from the readability of
the text when set in all caps.
Do not center large amounts of text
This is probably one of my biggest pet peeves. When you read,
you rapidly scan one line, then your eye has to go from the
right side of the page back to the left side of the page. When
text is centered, it can be harder to find where the text begins
again on the left side of the page, and actually all too easy
to skip down lines of text. Just say no to large amounts of
centered text, and save it for headings that don't run more
than several lines deep.
Page Layout
Don't box me in
Boxes and rules can often be the mark of a beginning designer.
You look at your page. Boring, you think. It needs a little
something . . . aha! I've got this box I can throw around the
type or a rule I can place between the columns. Before you know
it, you've used every type of box and rule your software has.
Boxes and rules can be a good way to show off important information.
Just make sure everything isn't in a box, or nothing will stand
out from the rowd.
Do not divide the page into halves
You want your documents to be visually exciting, and one of
the best ways to do that is to divide the page into thirds,
and then place the most important objects (headings, photos,
visuals) in the top or bottom third.
Web Design
Do not force viewers to scroll horizontally
There is nothing more annoying than having to actually pick
up your mouse and move a Web page over to the right. Ok, I'm
probably exaggerating a little bit here, but there's no denying
it's annoying. To scroll down all you have to do is hit page
down, but there's no shortcut to get your page to scroll horizontally.
Probably the best way to avoid the dreaded scrolling page is
to make sure you check out your Web pages at resolutions of
640 x 480, 800 x 600, and 1024 x 768. Many people nowadays say
that you can forget 640 x 480. It's true that the majority of
monitors being sold nowadays come preset to 800 x 600. Personally,
I still design for the lowest common denominator. Have no more
than three screenfuls of information People don't like to scroll
horizontally, but they're not overly fond of paging down forever
either. The rule of thumb is that any one Web page shouldn't
require a viewer to page down more than three screens. People
will scroll if the content is there. You need to balance content
and nuisance factor with having to click through on links.
One Web page should weigh in at no more than 50k
It would be a nice world if all you had to do was follow the
rules, wouldn't it? It's not quite that cut and dried. Yes,
you don't want your Web pages to take so long to download that
you lose viewers before the page loads — we've all seen those
commercials where people aren't living their lives because they're
still waiting for a download. You only have about seven seconds
to make a good first impression on the Web. There are times
that you may need those really large graphics. If you're a photographer
showing off his photographs, for instance. Just make sure that
you're not bloating your Web pages unnecessarily.
Do not force your viewers to download plugins Flash is fun.
Flash can even help your Website's interactivity and give it
some "wow!" factor. That "wow!" can turn to groans of annoyance,
or even worse lost viewers, if you don't provide alternatives
to the Flash plugin. Or the Acrobat plugin. Or the director
plugin. You get the idea.
Sure, lots of people have plugins nowadays. Lots don't. Think
about making an HTML alternative to your site to accommodate
everyone.
Color
Use contrasting colors for readability
Dark text on a light background is easy to read. It goes without
saying that dark text on a dark background, or light text on
a light background, is difficult to read. You need to make sure
that there's enough contrast between your text and background
for the text to be readable. Light text on a dark background
is also easy to read, but it should be used sparingly. It's
more tiring to the eyes to read large amounts of text on a dark
background.
Use color sparingly You choose to design in more than one color
for one reason: for impact. If color is thrown around everywhere,
it loses its impact. Make sure that you use color for maximum
impact: for headings, or even the most important words in headings.
Do not use complementary colors
Complementary colors are colors that are opposite each other
on the color wheel, such as blue and orange. When these two
colors are used side by side, the eye has trouble focusing on
both at the same time, and the colors may actually seem to vibrate.
Do not use color screened more than 40%
with text
You see them everywhere it seems: sidebars that consist of text
on a box of color that is screened. However, if the screen is
too dark, it's impossible to read the text. Anything darker
than 40% tends to be too dark to read text against, but this
can vary somewhat depending on how dark the color is. You can
screen green darker than blue, for instance.
Your best bet is to get a Pantone book of tints. This shows
screens of the same color from 10 to 90%, with both text and
reversed text on the screens, so you can tell at a glance what
will or will not be readable.
From about.com