Usability Flaw: Color Contrasts

Posted on by

Color contrast can be a big usability issue. Seems to be an easy task but sometimes choosing right colors is something that designers forget, probably because of lack of time.

Invitastic Logo 20071115

I was checking Invitastic, a new site to create invitations. I like the simplicity of the site but the design looks a little bit web -1.0. Trying the site, I found a flaw.

Invitastic Emails Adress Input Box 20071115

Believe me, my email address is written in the the image above. Using yellow characters on light yellow background for an email address input box was not the best solution. I can imagine thousands of users mistyping their email address and waiting for the registration confirmation email forever.

.

Disclaimer: with this kind of article I want to point out usability and interface problems some sites could have. Please do not take this as an attack, take it as a free advice. I would like to make clear that this design problems could happen for many reasons, including lack of time or money.

  • http://www.jacksonfish.com Walter Smith

    Hi Alexis –

    Believe me, we were as shocked as you when we saw this happening! Turns out the Google Toolbar is changing the background color to let you know it can autofill the field. It doesn’t look at the context, it just sets the color to light yellow–in fact almost exactly the same light yellow we used for our text.

    We’ve put some script on the site that watches for the Toolbar’s changes and resets them back to the way we originally designed. Another typical day in the wild ‘n’ wooly world of websites. :)

    BTW, thanks for trying out our site!

    - Walter