9 Common Website Design Faux Pas

Website design errors can ruin your brand and drive site visitors into the arms of the competition. Check out these nine common errors and try to avoid them. If you do, your website will become the best salesperson, marketing department and public relations firm on the payroll.

Mistake #1: No responsive website design

Today, a significant and rapidly growing number of people access the Web from mobile devices. If a company’s site is difficult to use on a mobile phone or tablet, a substantial number of visitors will exit quickly, and probably with a bad taste in their mouths. A mobile-unfriendly site design is particularly damaging to local consumer businesses, but the effects are now being felt in practically every sector.

Mistake #2: No search box or a hard-to-find search box

When someone comes to a company’s site looking for something specific, he or she is probably an excellent prospect or a current customer. Frustrating these high-quality visitors by making finding what they want difficult accomplishes one thing: driving them to a competitor.

Mistake #3: Too much information crammed above the fold

In the old days, the idea of forcing a visitor to scroll made Web designers cringe. Thus, they got into the habit of throwing everything except the kitchen sink above the fold on the Home page. Today’s users, however, are accustomed to vertical scrolling, thanks to their experience on the mobile Web. As a result, today’s effective website pages can afford to have a cleaner look and place important information and calls to action below the fold too. Here’s an example of an effective Home page design.

Mistake #4: Hard-to-read text

Readability is enhanced enormously by using the following simple (but often ignored) techniques. Learn much more.

• Short paragraphs – 3-4 lines or fewer
• Descriptive, interest-building headlines and subheads
• Bullet points and bold text to facilitate scanning
• High contrast (dark text on light background)
• Limited number of font sizes, styles and colors
• Selective or no use of text in all caps
• Ample white space

Mistake #5: Hard-to-use contact forms

If a company’s goal is to eliminate sales leads and customer inquiries, there’s no better way to achieve it than with an impossible-to-use contact form. On the other hand, if you want leads and contact from customers, consider these key design suggestions for your contact form:

• Don’t use CAPTCHA.
• Don’t display a multitude of required form fields – especially ones that ask for non-relevant information.
• Clearly highlight required fields.
• Display as few form fields as possible.
• Display credibility elements.
• Display alternate contact options, such as a phone number.
• Use pre-filled fields and drop-down menus whenever possible.
• Display detailed, polite and easy-to-understand error messages.

Mistake #6: Hard-to-find or no contact information

Even worse than a hard-to-use contact form is not having one at all. A surprising number of business sites fail to display a phone number, or bury it in footer navigation. Another common error is relying on a “contact us” email – also buried in the footer. Besides being a spam magnet, an email address forces users to compose their inquiry from scratch, which always takes time – something your visitors may not be willing to give you.

Mistake #7: Confusing navigation

The best site navigation is simple and intuitive. It helps users quickly find the most important information on the site, and gently, almost invisibly, guides them through a conversion funnel. Tips for effective navigation:

• Use common terminology for header links – for example, “Contact” is better than “Communicate.”
• Keep header navigation elements to a minimum.
• Use a secondary navigation box and/or breadcrumbs for sites with many pages and/or sections.
• Use footer links that mirror header navigation rather than making the footer a warehouse for SEO links, which is now a bad practice.
• Color and underline text links consistently (learn more).
• Place the company logo in the header link to the Home page.
• Regularly test for broken links.
• Design clear, helpful and engaging 404 error pages (cool examples).

Mistake #8: Distracting page elements

Generally speaking, trying to impress visitors with a wild and crazy design backfires badly. In business situations, users are primarily, if not exclusively, interested in finding relevant information quickly. Distractions that frustrate business users include:

• Flash animation, unless very selectively used
• Home page header carousels
• Video or audio clips that launch when the page loads
• Blinking text
• Hard-to-read text/background combinations
• Horizontal scrolling

Mistake #9: Lame imagery

While well-designed images are worth a 1,000 words, poorly handled images impact users negatively or not at all. Important image-related design principles to keep in mind:

• Captions enhance the persuasive and informational power of images.
• Include ALT tags for images to enhance accessibility and usability.
• Avoid massive image files – slow page loading frustrates users and hurts SEO.
• Never use images in place of plain text for body content.
• If text appears over an image, confirm that it is readable.
• Make sure imagery is thematically consistent throughout the page and site.
• Avoid stock photography, as it tends to cheapen the brand.
• For tips on handling images in responsive site design, click here.

Over to You

What website design tips can you add to this list? What are the most annoying design errors you encounter?

About the Author!

Brad Shorr is the B2B Marketing Director of StraightNorth.com, a web development agency with headquarters in Chicago. Brad’s articles have appeared on publications including Forbes, AllBusiness, and Carol Roth. Connect with Brad on Twitter @bradshorr.