Monday, 21 July 2008

SEO problems of white text on a dark background

I wanted to find out how Google treats white writing on darker backgrounds. Design issues aside I'm looking at whether there is any impact on SEO of the colours you choose for your website.

Well first off, the Google spider is colour blind as far as i can tell. It just jumps from link to link regardless of what colour they are. There is an exception to this of course and that is invisible text - if the spider detects the same colour text and background (for example white on white) it may well note this and ban your site from the listings (more on invisible text). So maybe not as blind as i first thought, but the spider isn't going to not visit your content just because of the colour.

However Google doesn't just rank your site on whether it can reach your content - it's concerned with links, and links appear if your site is relevant and easy to use.

Easy to use site = More links = Higher ranking

As to whether you use white on black or vice versa it’s all down to contrast – too much is hard to read and too little is equally hard.

The following points are from this massive discussion on background and text colours:
  • There is a trade-off between contrast and readability: too little contrast makes things hard to read, but too much contrast creates so much vibration that it diminishes readability.
  • Black is the worst dark colour to use as the contrast is the most (too) extreme
  • Screens aren’t white text – they are shining white light – very different to reading on paper
  • Unless you have a print style sheet that changes it to black on white you’re going to use lots of ink printing the page
  • Most images on a black background create a very high-contrast situation that is more difficult to look at for a long time than lighter backgrounds
So none of this condemns light text on a dark background but make sure you do check that your site is easy to use / read and is accessible before settling on your site's colours. Personally I'd stick to dark colours on light backgrounds.

There's a contrast checker here if you are colour blind - for non-colour blind readers i don't think this is a huge amount of help; if you're in doubt whether the contrast is big enough then it isn't, I don't need a contrast checker to tell me that red on pink is 'sort of' contrasting. Plus this doesn't say 'that is awful!' when you choose black on luminous yellow.

And finally, yes black backgrounds do use less electricity than white backgrounds. So it's your choice, but just don't make something that causes dizziness, fainting or looks like one of those Magic Eye drawings from the 1990s.

Related posts
What font / text size online and how to set it in the CSS (Oct 2008)
Improve and check your website's readability (Mar 2009)
Check your web design in different browsers online (Jun 2009)


Anonymous said...

Easy to use site = More links = Higher ranking

Not really, it's trying to see how well connected your site is. Outgoing and incoming links matter.

Dexter jazz said...

internet marketing is one of the precious way to get the products popularized in the market. Thank you so much for sharing it. Internet Marketing - SEOagency

Williams jack said...

Many online business owners thinks that SEO is not necessary for the website but they are wrong. It is the great way of business. Thanks for the post. SEO Services - SEOServices