>> Rules  
>> Awards  
>> Glossary  
>> F.A.Q  
>> News  

Information
Rules

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


 

   Copyright - Terms of Use - F.A.Q. - Link to Us - Site Map