Navigation Button

Internet Brothers: Helpware for the Cybercommunity - Typography and Colors

Coloring and Typography Choices

Now for a little discussion about typography; size and color, and background colors; for your web pages. We're far from experts, but some observations over the years have led us to opinions about what looks good and what doesn't, what's readable and what isn't. We tend to think that type any smaller than 12 points is difficult to read on a computer monitor. With today's modern browsers it's easy to change type size on the fly, but who wants to mess with that when doing your daily surfing. So when building your pages, keep your type size large enough to read; assume that your visitor has their default size at 12 points. In other words, it's not wise to reduce the size of the type below the default type size.

Mixing Colors

The human eye cannot focus on red and blue at the same time. Trying to read red type on a blue background or vice versa causes extreme eye fatigue. (Stare at the blue cell below for ten seconds and tell us you don't agree.) Your visitor will bail out before you can say "back button."

Never, ever use blue type
on a red background.

Even worse, is red type
on a blue background.


Warm colored type with
warm colored backgrounds.

Cool colored type with
cool colored backgrounds.


Nature Knows It's just an opinion, but we think that warm colors such as red, brown, orange and yellow look better together in combination. Likewise, cool (no, not kewl) color combinations like blue, green, gray and white make for a more appealing presentation. What do you think?

Working With Contrast

Keep the contrast low. We've seen lots of web pages that use white type on a black background. It looks cool at first, but it becomes difficult to read in long articles. Light gray type on a dark gray background is much easier to focus on, but is still not the best combination of colors for text intensive pages. No matter what colors you're using, keep the contrast reasonable. If your background has a value of, say 20%, and the type has a value of 80%, it presents a subtle look that's easy on the eyes and is graphically appealing. Avoid the extremes.

White type on a
black background.

Gray type on a darker
gray background.


Dark gray type on a
light gray background.

Light green type on a
dark teal background.


Wild and Wooly Finally, if you are featuring huge amounts of text for information purposes, present it as black type on a white background and let your reader choose with browser settings how the type will be displayed. Remember to make the font size large enough that we don't need our bifocals. Otherwise, be creative, just don't get too bright or use too much contrast between colors, unless of course your readers are snowboarders.


Helpful TipTo print a copy of an Internet Brothers tip or article, simply take a photograph of your computer screen, develop the film and have the photo enlarged to the font size of your choice.

The Internet Brothers have implemented hierarchical menus for navigation. Easier done than said.

The hierarchical menus were created using Peter Belesis' © Dynomat DHTML scripting tool from Webreference. Give them a visit, you'll like what you learn.

Our Lovely Email Icon    another darn bug






Site Map

 

 

 

If it keeps up, man will atrophy all his limbs but the push-button finger.

 

 

 

 

Self-delusion is pulling in your stomach when you step on the scales.

 

 

Was this site useful to you?
Vote For Us at WebbieWorld

 

Copyright © 1997-present Internet Brothers. All Rights Reserved. Really.