Wayfire Media

Everyone makes mistakes, and web designers are no exception. However, there some web design goofs that are frequently made by designers who are just starting out - so consistently that most web designers will admit to committing some or all of these at some point early in our careers.

We aren't talking about the real amateur problems, like cheesy animated GIFs, loud backgrounds, and horrible font choices. Here we're looking at mistakes that you might see from professionals who get paid good money for their work. And it often looks good. But even a site that looks great to the untrained eye can conceal problems beneath the surface (and invisible to the client).

1) Insufficient Browser Compatibility Testing

Everyone in the world doesn't use the same combination of web browser and operating system as you do. Rookie web designers might check their design in one or two browsers, but few do any extensive testing on the full range of browsers and even fewer test on multiple operating systems.

Those who haven't experienced the differences in platforms may be surprised to learn that Internet Explorer for Windows behaves very differently from IE Mac (fortunately the latter is nearly dead).

Professional web designers learn to support as many browsers as possible, even if the extra effort often goes unnoticed by clients. A web site may get only a handful of visitors using Camino, but if one of that small group is looking to make a million-dollar purchase, you want be sure your site looks great to them.

2) Lack of Plain Text

Have you ever seen a search result like this? "Copyright 2005" isn't a very good description of any site, so what's going on here? Usually you'll see this when a page has virtually no plain text content (including ALT attributes and META descriptions).

New designers often succumb to the temptation to lock their text within image files, where they're able to use a wide range of fonts and render them with pixel-perfect precision. Unfortunately, while the end result may look great on screen, it takes longer to load, can't be easily resized, and it's unreadable to machines (including screen readers for the blind).

The internet may have changed a lot since it's early days, but at it's heart it has always been about text, and it still is. As good as computers have become at displaying multimedia content, they're still not very good at understanding it.

Plain text is still the most reliable way of representing information in a way that's understandable to both people and machines, and it's the web designer's challenge to present that text in an appealing way, without resorting to images and other methods which are less accessible.

Multimedia has it's place, of course, but plain text should not be neglected.

3) No Call to Action

Almost every web site is created for a reason. Online stores, obviously, exist to sell products, but many small business sites don't actually incorporate ecommerce features. These "brochure sites" don't just exist to provide information; they are created in the hopes of eliciting a specific reaction from the visitor. It may be a phone call for more information, or generating a lead by filling out an online form. Often, new designers focus so much on things like graphics and page layout that they forget to tell the site's visitors what they want them to do.

It's important that a web designer understand the goals of the web site, and structure the site in a way that encourages visitors to take that action.

Sites built to generate sales calls should feature the company phone number prominently on every page, not just buried on a contact page. If the goal is to have visitors fill out a form, then the link to that form should be the most "clickable" element on the page.

Visitors are more likely to do what you want if you give them some direction, and web site owners are much happier when their web site generates real leads and sales - not just page views.

Still Looking Good

Again, a web site can have all of the problems above, yet still look fantastic. That's why these mistakes can go unnoticed by clients and newer professionals. They may not be apparent until the site has been live for some time, and clients begin to complain about poor search engine performance, or lack of conversions, or an important customer who can't view the site properly.

Fortunately, they can all be fixed (some more easily than others) and as designers gain experience we learn to avoid these pitfalls - and discover new ones :)

Designers: What other mistakes did you make when you were just starting out? Or what mistakes do you see newbies making again and again?

*This post was written as part of the Three Blog Project.

At least according to BusinessWeek. They're running an article called No Geeks Required, all about how small business owners can realize big savings by designing their own websites. They claim that "a variety of services make it easy for the tech-impaired and time-challenged to get a site up and running," and then go on to profile 3 business owners who've had success with these services.

It's interesting that BusinessWeek neglected to link to any of the self-made sites that they profile, and I took the time to track them down and have a look. Normally, I don't use this space to critique anyone else's work. But since the creators of these sites are not professional designers, and they're claiming in an widely read magazine that my profession is unnecessary and overpriced, I'm going to consider them fair game. Lets take a look.

Wow! Imports

According to the article, the owner of Wow! Imports used a do-it-yourself service at Register.com to create her site. "I stayed up all night cutting and pasting and did the whole thing in two days", she says. Take a look at what two sleepless nights can produce.

Clearly the work of an amateur, but not too bad. The pink-gray gradients are "interesting", though the header and footer seem to be completely divorced from one another, separated by a sea of empty space. I actually hit refresh and then tried a different browser, because it felt like there was a background image that wasn't loading, but it appears to be done that way "by design". The company name in the header is just plain text, instead of incorporating the logo which appears elsewhere (the logo is also a do-it-yourself design, I assume). Visually, it's unimpressive, but of course that's largely a matter of taste. Taste, though, is one of those intangible things that a professional brings to a design.

Beyond the visual appearance, other problems lurk. The pages carry non-descriptive names such as "page2.html" and are needlessly buried in a subdirectory. The page titles, largely identical across the site, are ridiculously long and stuffed with keywords. For example, the front page title contains 33 words and is 228 characters long. The products page has almost all of it's text hidden within image files. None of these things are helping the site on the search engines, and the spammy title tags may even be hurtful.

Dream a Little Dream Events

Next up is Dream a Little Dream Events, created with software from Homestead. The owner originally tried out the site builder at Register.com but found that "everything looked weird". (note: this site has since been redesigned since this story was originally posted)

I wasn't surprised to find this the most visually appealing site. A company that plans weddings and designs invitations should be expected to have an eye for design, and the site is tastefully put together. There's an odd use of white space at the top of the front page, and a few alignment issues, but that's forgivable - these are amateur sites we're talking about.

Once you get past the visual aspects, the site doesn't hold up so well. The navigation is done with javascript, which is bound to cause problems for search engine spiders. This probably explains the fact that the front page has a Google Page Rank of 3, while most of the internal pages haven't even been indexed. If I could only fix one thing on this site, this would be it. Search engines can't send visitors to your site if they can't crawl it.

There's also a problem with the images on the site. Large images are used, with the scaling left to the browser. This causes larger pages, longer download times, and badly rendered images (most browsers are terrible at image scaling). Beyond the on-site images, there are photo galleries hosted with a different service on a separate domain. The galleries have a different design and no link back to the primary web site, and no contact information for the company. If a visitor finds the company via the photo gallery pages, they have no way to find the actual company site without resorting to a search engine.

Parking Padding Solutions

Finally, we have Parking Padding Solutions, created with Microsoft's Office Live. This is also a second attempt, after the first try with Yahoo produced a site that "wasn't as professional-looking". (note: this site has since been redesigned since this story was originally posted)

This site manages to avoids most of the structural problems of the other two, so it appears to be well indexed by the search engines. Visually, though, it falls far short of the "professional-looking" image the site owner was going for. The logo and graphics are clearly amateur. Every element on the page seems to have a border applied, which only accentuates the lack of padding in some table cells. Viewed the Firefox, the design falls apart, producing horizontal scrollbars no matter how large the browser window is. In Internet Explorer, the right side of the page is cut off for users with a screen resolution less than 1280 pixels wide. I suppose that's fine if your target market is people with huge monitors.

Professional Design Matters

Despite their problems, all three websites are largely functional, and I have to applaud the efforts of the do-it-yourself designers. I only want to point out that you do get what you pay for, and that all of these low cost sites contain problems that a professional would know how to solve. Further, these sites were selected by BusinessWeek as examples of successful DIY sites, we're not hearing from those who have given up in frustration.

Although all 3 site builders are apparently satisfied with the fruits of their efforts, I believe that these are examples of businesses that have succeeded in spite of their websites, not because of them. How many potential customers didn't get in touch because the site looked unprofessional? Or because it wouldn't work in their web browser? How many clients never even found them because their pages weren't indexed by Google?

Those with speedy internet connections seem to quickly forget what it's like to experience the web through a dial-up connection. Still, millions of people continue to access the internet through the reliable old 56k modem and standard phone line, and that's not likely to change any time soon, especially not in the United States.

A recent report reveals that only 44% of US households have broadband internet access. Among those indentified as "active internet users," penetration is 73%, which leaves more than a quarter of active users stuck on dial-up.

If your web site makes extensive use of multimedia content, that means as many as one in four visitors, your potential customers, may experience unacceptably long load times.  Audio, video, and Flash content, if not used wisely, can slow your site to a crawl and turn away customers on a slow connection.

But what if your target market is other companies?  Surely most workplaces have broadband connectivity?  While fast connections as more common in the business world, still 10% of workers connect to the internet with a regular 56k modem. 

Broadband use should continue to rise in the near future, but adoption will eventually plateau as the market matures.  And users in rural areas will likely remain on dial-up for years to come. Using the latest technologies and a professionally designed web site, it is possible to build a web presence that is attractive and engaging to all of your users, not just those with faster connections.  Can you afford to turn away 25% of your potential customers?