Always keep <em>Caps off</em>, on the web Mar12 '05
Lately, when writing, I’ve been avoiding typing words in all caps.
Typically, when we write, we sometimes decide to make a word (or series of words) all caps, to emphasize the meaning of the word(s), such as this:
I am REALLY enjoying the Big Ten Tournament.
This is a bad practice to get into.
A word, in the context of an article, or any written piece – should never be typed in all caps.
Having a word in all caps is a stylistic enhancement, and a cosmetic change, that should never be represented with words that are meant to be consumed (read), such as articles, books, etc.
The clarity of words
When we read, we tend to read whole words at once, instead of reading each letter, on it’s own. We see the word as a whole, and our mind recognizes the shape and pattern of the word.
Every letter has proportion, weight, height. Without even knowing it, we recognize these things as we read.
There is a science to this. It’s called typography.
Typography is the study of letterforms, and how they interact to form visual representations of meaning.
Serif vs. Sans–serif
A brief mention of Serif vs. Sans–serif would be helpful.
A serif font has tiny serifs at certain spots, on each letter:
Notice the difference. The serif font (Times New Roman) has curved angles that protrude out, at the edges of the letterform. The Sans–serif font (Helvetica) has no such alterations.
Serifs help letters and words to become more distinctive, and studies have claimed serifs enhance legibility.
That’s not to say that Sans–serif is bad – not at all. You are reading an article in Sans–serif right now.
It all depends on the application.
Typically, on the web, Sans–serif fonts are used. In print, Serif fonts are used.
The negatives of all caps
When a word is typed in all caps, each letterform is the same height as the previous letterform, making it appear as a block. This drastically decreases legibility.
Which is easier to read?
THIS LINE OF TEXT THAT I JUST WROTE FOR YOU TO SEE?
or...
This line of text that I just wrote for you to see?
Notice how the first example is one giant block, whereas the second example has different heights for each letter, making each word more recognizable.
Enter HTML
When you are writing for the web, it makes sense to utilize the proper HTML elements, in the case of emphasizing text.
HTML provides two important elements, to emphasize text:
<em> and <strong>. Both have varying degrees of emphasis. Typically, <em> is less emphasis than <strong>.
<em> will make your text appear "slanted," or italicized.
<strong> will make your text appear "heavy," or bold.
Both of these visual cues (italicized and bold) suggest emphasis, and are much better than using all caps.
Enter CSS
In the case that all caps is needed – to achieve a distinct visual effect – CSS has a property called text-transform.
Use it similar to this:
.uppercase
{
text-transform: uppercase;
}
That way, you are declaring your visual effect through CSS, like you’re supposed to.
The bottom line
Making text all caps is a visual effect, and nothing else. It should never be used to suggest emphasis.
Categories: Typography 
Add Feedback (view all)
Leave feedback
is published and produced by Matt Thommes - an independent publishing enthusiast, mobile blogger, content creator, informative writer, web developer from Chicago.
Never one to conform, Matt intends to promote the effect the web has on our lives, in an effort to intensify, instruct, and clarify all that is happening around us.
- Office ergonomics – Standing vs. Sitting
- Sunday night lullaby
- Social networking: say it; don't spray it
Similar Entries
- PITT article: web-based feed readers (6 recent visits)
- Developing web applications: operational means beta (11 recent visits)
- How do web sites work? (Part 1, Series A) (157 recent visits)
- How do web sites work? (Part 2, Series A) (153 recent visits)
- Web site stats via email or RSS (7 recent visits)
- WEGO – The Web Ego project (10 recent visits)
Stats
2 unique visits since December 2008