Top 4 Tips on Choosing the Right Colors for Your Mobile Site

When coming up with a new mobile site, you will go through the same planning process that you did for its desktop version.  Choosing the right color scheme would be one of these steps, and a very important one at that.

Deciding on the right colors to use for your mobile website is very important to make sure that your site displays well on any mobile device, and that it will be easy to read by users who are on the go.

1. Use the colors you have for your desktop website. 

If you already have a website, it will make perfect sense to just duplicate the colors you used for it.  You really do not need to make drastic changes to make the mobile site look different from the original desktop version.  Start from the color scheme of your website and adjust as needed.

2. Remember that mobile screens are not as powerful as your desktop monitor.  

While it is true that mobile phones, tablets and other devices are increasingly getting more cutting edge displays, they are still not as sharp as your computer monitor.  They can only display a limited range of colors, have shallow color depth and limited contrast.  On top of these, mobile screens are also smaller.

This means that you can only work with fewer colors when designing a mobile site.  Stick to main colors such as red, green, blue, yellow and similar colors, because colors in between like sky blue or lemony yellow may not display properly.

You also need to check for the brightness and contrast of your site and take into consideration that your visitors might be viewing your site in the dark or under full daylight.

3. Avoid gradients.

Gradients might not display well on every mobile device, so to have a more consistent look, minimize the use of gradients.

4. View it in monochrome.  

While most mobile devices now have color screens, you should still check your site’s readability by viewing it in black and white or monochrome.  This is the true test of readability.  If you find some sections of your site not displaying well, change that particular color.