Draft - Be careful with colours - Quality Web Tips
This is a draft "webmaster tip", under work and review by the Quality Assurance Team, and shouldn't be considered as an official tip from W3C while it remains a draft.
- Most browsers use dark foreground colours, typically black for text, underlined blue for links, and a slightly different underlined blue for visited links.
- That's also the case for old browsers not supporting CSS. Therefore changing the background colour is tricky:
- Dark background colours are out - unless the foreground colour is also changed. Ideally checked with a service converting all colours to a monochrome scheme, if it still works it might be fine also for the colourblind.
- Mixing legacy markup and CSS can have hilarious effects like a legacy black/blue foreground on a dark background, if editors use bgcolor="black" for the BG, and style="color: white" for the FG.
- Using a legacy <font color="white"> is deprecated. Violating that rule is an option, otherwise better don't use legacy markup for dark backgrounds.
- Outside of CSS stay away from the hex. #rgb notation, old browsers only know #rrggbb (six hex. digits). Maybe use one of the sixteen colour names, that's guaranteed to work on the most limited devices, cell-phones, PDAs, printers, etc. (as far as they support colours).
- Text browsers don't support colours. (They need them internally to display physical and logical style tags like <code> on text mode displays with a single monospaced font).
- XHTML Basic and Print don't support inline CSS. If available use class= references to an external style sheet.
Further Reading
- An experimental page with links to a colourblind emulator designed to work even with HTML 2 browsers.
About the "QA Tips"
The W3C QA Tips are short documents explaining useful bits of knowledge for Web developers or designers, hosted and produced by the Quality Assurance Interest Group at W3C.
While the tips are carefully reviewed by the participants of the group, they should not be seen as anything else than informative bits of wisdom, and especially, they are not normative W3C technical specifications.
Learn more about the Tips, how to submit your own pearls of wisdom, and find all the other QA tips in the Tips Index.