MakingForegroundReadable
Mobile devices are often used in situations where lighting is suboptimal; they may not have backlighting. Therefore it's especially important to ensure that foreground elements (text, graphics) are visible against the background.
Use complementary colors for foreground and background. Complementary colors of light are two colors which, when combined, produce white light (e.g. yellow and blue). See for example http://en.wikipedia.org/wiki/Color_theory. Complementary colors produce a maximum visual contrast. Green text on a blue background is OK; yellow text would be better.
- Use even, homogenous background images. Complex, colorful background images may obscure the text and graphics on them. Prefer background images that are mostly uniform in color and brightness. One may make an image more acceptable as a background image is to modify it with an image editing program -- lower the saturation, and increase or decrease the brightness.
Back to BestPracticesList
CategoryPhp CategoryXhtml CategoryBpColorContrast CategoryBpBackgroundImageReadability