Why are so many sites using gray text?

Can somebody please explain why so many sites are making their text harder to read?

A lot of sites are using gray-on-white or gray-on-gray text – including this one!

Is there some backroom deal with eyedrop vendors? Why are designers doing this?

Google shows plenty of others complaining about this and writing Greasemonkey scripts, but I missed the memo justifying this (appalling) practice.

If you have a site with gray text, please explain why it’s better than black text.

Black text on white background is generally considered to be too high a contrast and hard on the eyes. A very dark grey on white is easier to read.

If you had a slightly darker background then black might be more appropriate. It’s not specifically the use of black - it’s the contrast between the text colour and the background colour that’s the issue.


But considered “too high a contrast and hard on the eyes” by whom? Based on what studies? When did this idea get circulated?

I know that not being able to read a #%^&*! site seems harder on my eyes. :wink:

Meanwhile, I’ve uncovered www.wowwebdesigns.com/power_guides/ever_heard_of_contrast/ , which makes claims about the rationale.**


W3C Recommendation:

There are a variety of colour contrast testing sites. eg:

Hope this helps,

Thanks, but those W3C guides are setting minimum acceptable contrasts. They are not telling designers to muck up their sites!

It’s like the law says I have to feed my kid nutritious meals. I stay out of jail feeding her quality dog-food. That doesn’t mean I’m a good parent.

Also, these W3C suggestions make no mention of maximum contrasts! So why do designers think readable is bad? Is it just misinterpreting the guidelines?

You might want to read Designing for Dyslexics and the two follow on articles.



Personally, I just go with what looks ‘right’ - more often that not that is grey. As others have suggested, quite often 100% black on 100% is too contrasting and hard on the eyes, although it depends to a degree on the surrounding colour scheme.

With finer, ill adjust the contrast till it just looks easy on the eyes and easy to read.

My site has a dark grey background colour. How would black text on dark grey be more readable? You’d hardly be able to see the text…

I think the inference is that it’s grey text on a white background. But then again, you knew that, didn’t you… :wink:

Its a phase just like the plainly stupid pixel font was a couple of years ago and hopefully it will move on just as that did. Like most design phases though, its usually the designers who decide rather than the end users.

You may notice that I have edited your post and put the link in. I appreciate that the spam measures that we employ aren’t to everyones taste and may inconvenience you slightly but it’s worth it to us on a large scale :wink:

If I use a pure black text (#000000) then I will have a slightly muted white (#eeeeee). If I do have a pure white background (#ffffff) then the font colour I use will be a very dark grey (#1e1e1e).

For me, and as others have noted, black on white is simply too sharp. I am yet to receive complaints against any of my layouts regards this issue so I feel I have the right mix.

If you find it that much of a problem then email the webmasters of the sites you are having difficulty with. If they ignore your complaint, just dont use their website. If its as bad as you say it is, im sure plenty of other users will follow suit and then the organisation may think again about using unreadable text.

Well I haven’t had any problems with contrast on sitepoint, where is the problem?

If you have problems with your vision (im not making assumptions), if your using firefox then you can go View>Page Style>No Style, which will show you the site without CSS (so pure black on pure white). Or you could use/download opera and go view>style>high contrast which will put the website you are viewing in high contrast making it easier for you to read.
If your using IE… get Firefox or Opera :stuck_out_tongue:

I find any shade of gray darker than #333333 perfectly readable against pure white. Most unreadable gray text is simply too small.

The explanation that designers make these choices based on how the page looks with lorem ipsum and never test its readability sounds plausible, though.

I agree on #333333 is perfectly readable with a white background.

Isn’t the entire point of lorem ipsum to imitate real content? Also, I think grey text on white backgrounds is fine. It’s not too contrasting, and the colors complement each other exactly. The issue I think most people encounter is the size of the font itself, not the color.

Thank you :smiley:

That’s exactly the reason why one might have a hard time reading dark grey on white or black on off-white.

The reason dark grey is chosen over black as mentioned is because of to sharp a contrast between black & white on computer monitors. That practice is as old as browesrs and the www. It works when the font size is reasonable but lately many sites seem to be created with micro sized fonts. That seems to me to be the alarming trend in web dev today.

I think that some people think that a clean-style means blending all colors too close together. Whereas, one should–imo–keep color ranges together, but not too close. I also think that some “designers” have never heard of a color wheel.

As long as the font size and line height is correct, using a dark gray font color works great. It’s easier on the eyes and improves readability if done properly. That’s what I think at least.

Thanks, everyone, for your replies.

Its a phase just like the plainly stupid pixel font was a couple of years ago and hopefully it will move on just as that did. Like most design phases though, its usually the designers who decide rather than the end users. 

Thanks, the more I look into this practice, the more it looks like unreasoned herd mentality.

You might want to read Designing for Dyslexics and the two follow on articles.


Thanks, Gary.   Those articles are the best justification, yet, that I have seen for text with unreadable contrast.

There are three huge flaws with its ideas, however:

[*]No studies were mentioned and no non-subjective data provided.
[*]Most [B]sane people will adjust the brightness and contrast of their monitors[/B] we don't need individual web "designers" screwing things up with unreadable text that is different from site to site.
[*]The articles admit that high contrast is best for most people, and especially the huge group of vision-impaired users, but claims that those with "Scoptic Sensitivity Syndrome" need lower contrast.

A Google search for "Scoptic Sensitivity Syndrome" yields only 171 hits.   This is either another made-up, yuppie disease (link 1 below) or it is very rare.

Crippling readability for such a small group (and based on no hard data!) is akin to banning underwear in all of Australia because one kid is allergic to cotton.

Several people, on this thread, have now stated that gray text "looks fine", or similar.    I speculate that these people have never run usability studies, [i]with end users[/i], on their sites.

Meanwhile, the W3C was so appalled about poor contrast that it set minimum standards but not maximum.    Web usability professionals, like Jakob Nielsen, continue to deplore gray text (link 2 below).

I am ready to declare this another case of mass insanity pending a definitive scientific study of text-contrast on monitors.

(This forum prevents newbies from inserting anything close to a hyperlink.)
1: [Nut allergies -- a Yuppie invention](http://www.latimes.com/news/opinion/la-oe-stein9-2009jan09,0,3149168.column)

2: [Let Users Control Font Size](http://www.useit.com/alertbox/20020819.html)    (Bottom of the page.)