| Jul. 02 2008 at 8:37 AM |
|
|
|
During the course of a day, I often visit many websites, both for business purposes and pleasure. More often than not, I find websites that have poor readability. What do I mean by poor readability? Here are the five most common readability faux pas I come across:
1. White or light text on a black or dark background. This is a readability no, no. Why? This is called text in low-contrast, and research has shown that text in low contrast irritates the reader and causes eye fatigue. Instead, use contrasting colors like black or dark text on a white or light-colored background. This is easier on the eyes, and much more reader-friendly.
2. Huge blocks of text. Readers of web pages are notorius scanners, so break up your text into shorter, bite-sized paragraphs. There's nothing worse than trying to read a paragraph that seems to never end. Most people won't even bother to try. They'll just click away and leave your site. Also, use bullets and subheads whenever possible.
3. Tiny text. Stay away from using tiny font sizes that make people squint or requires bifocals to read. Stick with 12pt font whenever possible. Or at the very least 10pt font. Conversely, don't use overly large font sizes either. And use all-capitalization sparingly.
4. Fancy fonts. Whenever possible use regular or standard font types such as Times Roman, Arial or Verdana. Try to stay away from hard to read fancy fonts, such as Italic, Comic Sans or any type of cursive fonts.
5. Too much clutter. So many websites I visit look like someone's attic. Clutter, clutter and more clutter. Have you ever visited a website that was so cluttered, your eyes didn't know where to begin to look? Do you know what I do when I come across a website like that? Instead of hanging around trying to figure things out, I leave. Don't over-crowd your webpages with text and graphics. Less is more. I personally live by the motto, "White space is a good thing!"
There are of course many other things you can do to make your website more readable. I will cover those in another article.
Dale King
If you're tired of all the money-making
hype, lies and scams...read this!
Click here for more details!
|
| Jul. 02 2008 at 1:45 PM |
|
|
Good points. Simplicity and consistency go a long way.
M Hall
MichianaWebline
|
| Jul. 02 2008 at 2:40 PM |
|
|
Here's another article on font sizes, whether they should be specified by points or relative sizes. "Font sizes on the Web."
Craig Landes
---
Defining the undefinable. "There are 10 kinds of people in the world---those who understand binary numbers and those who don't." - Unknown
---
Success = Passion, Patience, Persistence!
|
| Jul. 02 2008 at 3:20 PM |
|
|
|
Re: White or light text on a black or dark background.
This isn't "low-contrast". White text on a black background has the same contrast as black text on white. Dark gray over a medium gray, or yellow text over white would be low contrast. "Contrast" is a measure of a color's value (simply put as it's level of darkness).
Yes it is true that reading light text over a dark background has been proven to be more straining on the eye. However, this doesn't mean that it is a no-no. Studies also show that the eye is often drawn to whatever is lightest on a page (print or web). Light text over a dark background can be extremely effective for headlines or short texts like taglines or bullet points.
It's naive to say that dark over light is best for readability in all cases. Smart designers know what to use where. But generally speaking, for paragraphs of text, yes, black on white is easiest to read. But I'll argue that it doesn't mean it's always the best choice. Barack Obama Poster and T-Shirts
Home Sweetest Home - Poster-Style Home Portraits
Zingerding - the Internet's Funny Pages (coming soon!)
Steve Lowtwait, artist and entrepreneur.
|
| Jul. 02 2008 at 4:25 PM |
|
|
CampSteve wrote: Re: White or light text on a black or dark background.
This isn't "low-contrast". White text on a black background has the same contrast as black text on white. Dark gray over a medium gray, or yellow text over white would be low contrast. "Contrast" is a measure of a color's value (simply put as it's level of darkness). It's naive to say there is only one definition of low-contrast. There are many possible definitions. Some include color; others do not. According to Travnikova, "Such a multiplicity of notions of contrast is extremely inconvenient. It complicates the solution of many applied problems and makes it difficult to compare the results published by different authors." So I would argue that my definition of low-contrast is indeed valid. And let's not turn this into some huge debate about who's right and who's wrong. You made your point. I made mine. Obviously, we both have different opinions on this, but it's not worth arguing about. So let's move on. Dale King
If you're tired of all the money-making
hype, lies and scams...read this!
Click here for more details!
|
| Jul. 02 2008 at 7:00 PM |
|
|
Ouch.. So, here I am absorbing all of the multiple reviews that I've read over the months that I have been a member here... And my site redesign is... White text on a black background.
I think my images are more stark that way. But I'll try it the other way, too.
Steve Mann
Internet Videographer
MannMade Digital Video
My Email
|
| Jul. 02 2008 at 7:28 PM |
|
|
Who's Travnikova? A Google search brought up too many results to understand your reference. And we are talking about visual contrast only in terms of color value, not problem solving or whatever that quote is in reference to. So who's Travnikova?
Edited by: CampSteve - Jul. 02 2008 at 7:31 PMBarack Obama Poster and T-Shirts
Home Sweetest Home - Poster-Style Home Portraits
Zingerding - the Internet's Funny Pages (coming soon!)
Steve Lowtwait, artist and entrepreneur.
|
| Jul. 02 2008 at 7:36 PM |
|
|
DaleKing wrote:
During the course of a day, I often visit many websites, both for business purposes and pleasure. More often than not, I find websites that have poor readability. What do I mean by poor readability? Here are the five most common readability faux pas I come across: 1. White or light text on a black or dark background. This is a readability no, no. Why? This is called text in low-contrast, and research has shown that text in low contrast irritates the reader and causes eye fatigue. Instead, use contrasting colors like black or dark text on a white or light-colored background. This is easier on the eyes, and much more reader-friendly. 2. Huge blocks of text. Readers of web pages are notorius scanners, so break up your text into shorter, bite-sized paragraphs. There's nothing worse than trying to read a paragraph that seems to never end. Most people won't even bother to try. They'll just click away and leave your site. Also, use bullets and subheads whenever possible. 3. Tiny text. Stay away from using tiny font sizes that make people squint or requires bifocals to read. Stick with 12pt font whenever possible. Or at the very least 10pt font. Conversely, don't use overly large font sizes either. And use all-capitalization sparingly.
4. Fancy fonts. Whenever possible use regular or standard font types such as Times Roman, Arial or Verdana. Try to stay away from hard to read fancy fonts, such as Italic, Comic Sans or any type of cursive fonts.
5. Too much clutter. So many websites I visit look like someone's attic. Clutter, clutter and more clutter. Have you ever visited a website that was so cluttered, your eyes didn't know where to begin to look? Do you know what I do when I come across a website like that? Instead of hanging around trying to figure things out, I leave. Don't over-crowd your webpages with text and graphics. Less is more. I personally live by the motto, "White space is a good thing!" There are of course many other things you can do to make your website more readable. I will cover those in another article. Dale King
hello everyone,
Yes, these are all good points and thank you for the reminders. I personally hate it when they have used a light gray font, very small on a white background. Or any weird font that is difficult to read, or big blocks of text that have nothing to break them up. And yes, the cluttered and flashy gizmo ones with lots of ads----terrible! I don't stay on those pages either, I look forward to more tips later on.
financial supply chain
Edited by: Cparkinson - Jul. 02 2008 at 7:39 PM
|
|
|