Friday, June 27, 2008

Blog: Typography

Cruise the web for sites that model good and/or bad use of text and typography. Make a post to your blog pointing out at least two sites and specifically what aspects of the sites show good and/or bad use of type and typography.

I feel totally unqualified to do this! I decided to search scrapbooking/rubber stamping sites, since that is a topic I'm interested in.

The Good:

1. Scrap Jazz
I like this site, because it is easy to read! They are utilizing the short line length recommendation by having a navigation bar on the right hand side and on the top of the page. Their font is not squished; with good padding and margins. They even break their text into smaller segments by placing boxes around different topics and using images to draw the eye around the page.

2. Hero Arts Tutorial
I really like how easy it is to follow their instructions. They are following the short line of text, nice font, good padding and margins. Hero Arts is also using a blue background color behind the instruction title to highlight the start of important text. Plus having all their example images on the left hand side really works to balance their heavy text side. I also like the way that they contained their text. Notice how they put their "More Resoures" with a blue background. I like their color consistancy for the important text backgrounds.

The Bad:

1. Club Scrap
One of my favorite places to go, but it is a bear to read through their list! I think it is because: it seems like everything is pushed over to the right hand side of the screen; the text all looks the same; and it is hard to figure out what is the more important information is, since it is all presented at the same type size and color. They also do not seem to be utilizing padding (which I know a little about after doing Chapter 7) and I think padding would help to break things up and create focus on different parts of information being provided.

2. RubberStampMadness Stamping Tips
Okay. It seems like the sites that I do not like have all the text bunched together in long lengths. This site also has a font that is harder for me to read. I do see the advantages now in breaking the text up into shorter line lengths, with nice padding and margins. I am not seing any of the tips given to break of the text and make the important information stand out. They are using color, but doing a brief scan of the colored words on this page does not make any specific tips jump out to me. This page has some good info and I most likely would have ignored it if I wasn't trying to figure out the typography on it.

1 comment:

Anonymous said...

You've picked up on a number of important points when it comes to typography on the web:

line length-- optimal reading length for a line is 11-17 words!

whitespace-- padding, margin, leading (line height) need to work together so it is clear where text begins and ends and how it is grouped

chunking/grouping-- like you, I hate sites where the text blocks are hard to discern from one another

size/structure -- typography is limited on the web, but sites should use what they can, such as size and color of fonts to make a logical visual structure

color/contrast - again, with limited ability to control the fine points, color and contrast are significant attributes for readability.