When redesigning this site a few months ago, I realised that one aspect is overlooked when we do responsive design. Sure, these days we dissect everything in a responsive approach and try to apply this method to grid design, to typography, size, line length etc.
Yet one ‘risk’ –let’s say ‘user experience component’ if we want to be less dramatic– hasn’t been talked about at length so far: luminosity.
Coming from an accessibility background, I’ve had to hammer the point again and again –and then, again once more: contrast is important. But even more so on a portable device.
When you’re viewing a website on a portable device you have more chances of experiencing with poor light: either be in the street, or have reflections on your screen. When on a desktop computer, most of the time you can adjust easily but finding the right position in the office, the right orientation for your screen, for it not to be a nuisance.
Here’s what I’ve decided:
- When viewed above a certain amount of pixel width (YMMV, let’s keep in mind that breakpoints are not the same in every design), colors can be everything I want –of course we have to at least abide to AA accessibility contrast guidelines.
- when viewed below this certain amount of pixels , all the text will be black on white and not, for example, a subtle hue of dark grey on a subtle off-white background anymore.
I’d love to hear more about this kind of stuff for responsive designs.