By Tristan Loper
There was a time when simply having an online presence was enough: businesses and creative people followed an “if they build it, customers will come” mentality.
Today’s dynamic web is virtually unrecognizable from its early days. Technology has evolved, and every corner of the Internet begs for both our attention and interaction. Because of this, ease of use is paramount to fostering visitor loyalty.
Effective user interface design allows people to easily digest web content, and the easier a site is to use, the longer people stay. “Bounce rate”—or the percentage of visitors who enter a website and leave without viewing other pages—is an important metric for both content creators and advertisers. A high bounce rate signifies a site that doesn’t draw people in, which means fewer ad impressions. This can mean that a site has uninteresting content, or it can mean that it’s just too painful to use.
Finding the right balance between an effective website and a beautiful one can be tricky, and getting it right is often an ongoing process. Nobody wants to lose a sale or a reader, though. Fortunately for busy people, there are tried-and-true practices from our in-house expert, John Lane, that you can implement right away.
John Lane, B.A., is the principal of J. Lane Designs, a local design studio maintaining a national and international client base. In addition to teaching courses in Illustrator, InDesign and Dreamweaver, Mr. Lane is the faculty/program advisor and lead instructor for the Digital Arts Center program at UC San Diego Extension. He is also a recipient of UC San Diego Extension’s Outstanding Instructor award.
We asked John for a list of ten mistakes of web design. Here’s what he had to say:
1. Don’t Make It Hard to Read: Choose your fonts wisely; don’t use small font sizes, keep the contrast high between text and background (e.g. dark text on a light background).
2. Don’t Use Non-Standard Links: Links are the web’s number one interaction element. Violating common expectations for how links work is a sure way to confuse and delay users.
Five big mistakes for links:
- Not clear what’s clickable: for text links, use colored, underlined text (and don’t underline non-link text).
- No difference (colors) for visited and unvisited links.
- No explanation of what users will find at the other end of the link; e.g., no key information-carrying terms in the anchor text itself to enhance scan ability and search engine optimization (learn more below).
- Don’t use “click here” or other non-descriptive link text.
- In particular, don’t open pages in new windows (except for PDF files and such).
3. Don’t Use Flash: Despite good intentions, most of the Flash that web users encounter each day has no function beyond annoying people. Flash should offer users additional power and features, not a jazzed up experience. If your content is boring, rewrite text to make it more compelling; don’t make your pages move.
4. Don’t Use Content That’s Not Written for the Web: Writing for the web means making content that’s short, easily scanned, and to the point. Web content should also answer users’ questions in common language (which also improves search engine visibility, since users search using everyday terms).
5. Don’t Ignore Search Engine Optimization (SEO): Search engine optimization simply means using terms that make it easier for people to find your website when using search engines like Google. Everything else on this list is pretty easy to get right, but optimizing your site’s searchability requires considerable work and attention to best practices. The key is that it’s worth doing because search is a fundamental component of the web user experience, and it helps to separate your site from the pack.
6. Don’t Design Just for Internet Explorer: Internet Explorer is still a widely used browser, but enough people have abandoned it for Firefox, Safari, and Chrome that we all need to design our sites with all browsers in mind.
7. Don’t Make Forms Long and Cumbersome: Web users are already confronted by numerous forms – often featuring excessive questions and options. It’s important to make information gathering as smooth as possible, so cut questions that aren’t needed, make some fields optional, and allow flexible input of phone numbers, credit card numbers, and the like. Why lose orders because a user prefers to enter a credit card number in nicely chunked, four-digit groups, rather than an error-prone blob of sixteen digits?
8. Don’t Forget to Include All of Your Company Contact Information: Even though phone numbers and email addresses are the most requested forms of contact info, many people won’t consider giving money to a company with no mailing address.
9. Don’t Use Frozen Layouts with Fixed Page Widths: The worst offenders are sites that freeze both the width and height of the viewport (area in view) when displaying information in a pop-up window. Pop-ups are a mistake in their own right. If you must use them, don’t force users to read in a tiny peephole. At an absolute minimum, allow users to re-size any new windows.
10. Don’t Forget That the Web Is a Visual Medium: One of the long-standing guidelines for e-commerce usability is to offer users the ability to enlarge product photos for a close-up view. Seeing a tiny detail or assessing a texture can give shoppers the confidence they need to place an order online. The worst mistake is when a user clicks the “enlarge photo” button and the site simply displays the same photo. Such do-nothing links and buttons add clutter, waste time, and increase user confusion.
Learn more from John Lane and other UC San Diego Extension instructors, both online and onsite, in one of our web design courses. Summer 2012 classes include Introduction to Blogging Design Software, WordPress I, WordPress II, Dreamweaver I, Dreamweaver II, and more. For details, visit http://extension.ucsd.edu/digitalarts.
The Career Boost Camp will take place Saturday June 2nd, 8:30 a.m. – 12:00 p.m. at the UC San Diego Institute of the Americas conference hall. Registration is $10 per person and includes breakfast and a raffle ticket for books and Extension workshops. Parking is free (recommended parking at N. Torrey Pines and Pangea Dr.).
