erova notebook • a user experience blog by Chris Avore

I’m sure many web designers and other user experience professionals visualize their perfect client: likely someone who has a firm but not rigid idea of what she wants built, can explain common tasks and requirements, provides you with clear direction, hires competent developers, and respects your professional suggestions when your ideas differ than those of the person signing the checks (which arrive on time, of course).

But what happens when you find yourself on a project or worse, a full-time job restricting how you can provide an ideal user experience for your business’s users and clients?

While every job, gig, project, or contract is unique, there are some shared opportunities that lie in even the most muddled of projects.

Below are a few methods to provide the best user experience possible that could go undetected by unaware bosses, managers, and others.  All of these cases assume the UX practitioner has pleaded for user testing to sort out these issues but such requests have been denied or ignored.

Problem:
Client has already determined the information architecture, navigation, and labels of the site and won’t listen to dissenting opinion.

Solution:
Even if your client demands links in the primary navigation to include  “Misc.”, “Hit Us Up”,  and three red circles to indicate three unique categories only revealed on mouse-over, you can still find some opportunity to make such dreadful navigation more useful than if you quickly nodded your head in surrender and began debating whether to jump off the building head-first or tucked in a cannonball.

If the client has decided what the navigation will be,  hopefully you can determine how it will be built:

1. Rely on semantic code to at least provide some meaning by using an unordered list to arrange the links rather than a table with columns and spacer gifs.
2. If the client requires images in the navigation (assuming you’ve provided the boilerplate warnings against doing so), use the images as background images of the list-item tag so you still have legitimate markup in the tag itself, and use CSS to only show the background image.
3. Use alt and title attributes as appropriate. If the boss really wants “Hit Us Up”, you may be able to get away with “Contact Us” as the link title.
4. Make the entire list-item clickable, not just the text itself.  Increase the size of the hit-state for easier clickability.
5. In addition to color, use font weights or other styles to distinguish links from one another.  Color is unreliable to connote meaning as it’s susceptible to cultural interpretation, it varies across displays, and some users could be colorblind.  If you’re using text links, consider displaying primary links in bold, and secondary links in normal font weight.

Problem:
The boss hand-picks terribly cliched stock photography for the home page, and even cornier text to overlay on the image.

Solution:
It’s safe to say laughable stock photography and feature text will burn you right in your craw every time you look at the site whether it’s the first time or 500th time. But regardless, here are a few ideas that could be worth explaining in an interview when the creative director asks how you’ve handled adversity.

1. If the featured text isn’t grammatically correct, take a chance and lay it out with corrected language.  Granted, you may get your hand smacked for changing exactly what was submitted, but you could also be the last line of defense before later embarassment that will look like you failed to catch.
2. Attempt to add additional creative changes to the photo so it looks less like everything else.  As long as you don’t follow other cliches or trends, such as ink blotches, swirls, stickers, or slanted lines, altering the hue, color, or sharpness of the image may breathe some originality into the image.
3. Holistically lay out the image with the rest of the site.  Even if the image is unoriginal and the text is terrible, it will stand out even more if it’s wider than its host column or shorter than a complimentary shape or image.
4. Even if the text’s meaning is awful, you still risk looking like an amateur if you don’t lay it out well.   Yes, even “Think outside the box” can look acceptable with the right font in the right place.

Problem:
A task or process is complicated, unconventional, and confusing, and you cannot alter the sequence of steps due to technical limitation.

Solution:
Hearing that step 5 always has to come before step 3 because a programmer from 6 years ago built it that way is always frustrating, particularly when competitor sites execute similar tasks flawlessly.   But a few helpful tips can make confusing steps a bit more predictable.

1. Provide an overview of the steps necessary to complete the task at hand.  Inform your user what lies ahead so you limit surprises.
2. Continue showing those steps during completion, including steps yet to come, and steps that have been successfully completed.
3. If technology allows, provide the user the ability to revisit earlier steps to confirm his or her input.
4. Pick the low hanging fruit.
   Provide inline form validation, usable calendar date pickers, and let the system format data as necessary, instead of the user.
5. Provide helpful definitions…
   Use pop-up tips or definitions immediately following the unclear concept, not off in another column across the page that may go unnoticed.
6. But don’t overwhelm the user with “helpful advice”
   If you inundate the user with the aforementioned tips (i.e. the label First Name includes a tip reading “Enter Your First Name”), you’ll dilute the quality of the tips that are necessary to leading the user to success.  Using only a few tips will let the tips you need stand out.

We don’t always have the luxury of working with perfect clients or sublime art directors. But there are opportunities to enhance the user experience even when crippled by draconian design guidelines.