45 Web Design Mistakes

  1. Don’t tease me with a splash or intro page unless you’re running an adult website. They serve no purpose other than wasting my time. Scale it down and add it as a feature on your home page.
  2. Don’t use embedded fonts. Period.
  3. Don’t create your entire website in Flash, especially just to display text. Take a lesson from Adobe, the makers of Flash. Notice that their own website isn’t entirely Flash-based. Shouldn’t that tell you something?
  4. Don’t launch your main website in another window after I’ve visited your home page. Mimicking the behavior of pop-up ads will chase away most people that might have been interested in your website, assuming your site gets past the pop-up blockers in the first place.
  5. Don’t make me use a specific browser, especially not Internet Explorer. If your website doesn’t work in Firefox, it shows that your web designers (or you!) have absolutely no clue about the Internet. This blog sees only 61% of its traffic from IE users, 27% from Firefox, and the remaining 12% split between various other browsers (Safari, Opera, and others) Why alienate a significant percentage of your potential visitors? You think I’m going to fire up Internet Explorer (and the hazards it brings) just to visit your silly little website?! Not!
  6. Don’t underline text unless it’s a link to another page. If I see underlined text, I expect it to be a link. See, isn’t that annoying?
  7. Don’t forget to spell check your pages and check them for grammatical errors. Offering “web desing” services and claiming that delivering “attarctive designs” is part of your “domain experties” is not the most convincing sales pitch.
  8. Don’t offer choices of high bandwidth, low bandwidth, HTML, or Flash. It’s like asking me if I’d like to enter your “crappy” store or your “better” store that requires a special key and a mind-numbing delay at the door.
  9. Don’t start playing music when I visit your home page unless I ask for it. The same rules applies to video streams with audio. If I want your website to make noise, I’ll hit the play button myself.
  10. Don’t make me try to figure out how to navigate your website. I am not going to sit there and try to guess how to get to whatever it is you want me to see.
  11. Don’t resize my browser window. I like it the way it is, thank you.
  12. Don’t put all of your text on one never-ending page so that I have to scroll forever to get to the bottom. The more information there is on a particular page, the less likely it is that I will read it. Plus, it just takes so dåmn long to load.
  13. Don’t make me scroll the browser horizontally because you failed to properly design and test your page. Just because it looks great on your monitor which is set at 1600×1200 doesn’t mean I’m going to see it the same way you do.
  14. Don’t make me rely on a built-in search engine to get me to the information I’m looking for unless your website contains hundreds of textual pages. Spend efforts instead on improving navigation.
  15. Don’t make it hard for me to figure out what the hëll your website is about. Nothing screams “hit the Back button” louder.
  16. Don’t scroll text across the page. It’s really annoying. Unfortunately, there are a few web publishers still trapped in the mid-1990s who think that kind of JavaCrap is cool.
  17. Don’t make text blink. Never. The HTML BLINK tag is evil, and so is anything that mimics it. Contrary to what these folks say, blinking text is NOT back.
  18. Don’t publish most of your text as images. It’s hard to read, search engines can’t pick it up, and it tells the world you have graphic designers that know nothing about producing content for the web.
  19. Don’t forget to add titles to your web pages. The title may be your one and only shot to get me to click to your website from Google.
  20. Don’t lure me to your website, only to show me pages with nothing on them, telling me that they are “under construction”. If your pages aren’t ready to publish, don’t publish them. I don’t need to know what it is you think you might be working on next.
  21. Don’t forget to create index pages in your folders. Web servers expect files such as index.htm, index.html, index.php, or default.htm. Without including those files, you may expose areas of your website you did not intend to. I recently found a set of documents containing a competitor’s entire supposedly confidential marketing strategy just by typing in the right folder name into my browser.
  22. Don’t assume that I have DSL or broadband. I do not want to have to wait six minutes to download your 700K Flash-based website just because I happen to be staying in a hotel in Peoria that does not have high-speed Internet. (see rule #3)
  23. Don’t overload my senses with too many fonts, too many styles, too many weights, too many sizes, or too many colors. It just makes it look like someone vomited on your website.
  24. Don’t use frames. There are good reasons why you might want to use frames but there are no good reasons to actually use them.
  25. Don’t use my browser to resize your images. Size your images in your image editing program before placing them on your pages. Images that are blown up in the browser look crappy and unprofessional, and images that are reduced in the browser increase the loading time of a page. The browser will never do as good a job as any image editing software and it looks terrible.
  26. Don’t use an incorrect image format. JPGs are best for photos, although the more you compress them, the worse they look. GIFs are best for images with large areas of a single solid color, for non-transparent icons, and for transparent images that do not need to blend into their backgrounds. PNGs are great for all types of images, especially transparent images that need to blend smoothly (as long as you apply a JavaScript fix for IE6), but they are often larger in byte size than the other formats.
  27. Don’t host your website with a free service such as Angelfire, GeoCities, or Tripod. They litter your site with banners and pop-up ads that are guaranteed to annoy your visitors and make you look bad. Visit GoDaddy, register a domain name for less than $10 per year, and then splurge on a budget-minded hosting plan that should cost less than $5 per month, you cheapskate!
  28. Don’t justify text because it interferes with readability.
  29. Don’t forget to put navigation links on every page. If I get stuck in your website’s equivalent of Timbuktu and I can’t figure out where to go next, I am more likely to close the browser than click the Back button.
  30. Don’t make it difficult for me to remember your domain name.
  31. Don’t make your domain name easy to remember for the wrong reasons. Graphic Art Sex Change?
  32. Don’t download someone else’s themes, templates, or plugins, call them your own, and then advertise yourself as a web designer. Just because you bought a copy of Photoshop doesn’t make you a graphic artist. Knowing how to use Dreamweaver, FrontPage, or GoLive does not necessary make you a web developer, especially if you can’t code in raw HTML, CSS, and at least one of the following without a GUI IDE: Perl, Python, Ruby, PHP, ASP, JSP, or XSLT (list subject to change as technology expands).
  33. Don’t expect to get a $5000 website for $250. You get what you pay for.
  34. Don’t change the size or weight of text in a link when I hover over it with my mouse. It tends to push everything haphazardly around the page, and it tells me that you really haven’t a clue.
  35. Don’t link images from another website into yours without their permission. That’s called hotlinking or bandwidth stealing. It’s wrong.
  36. Don’t bombard me with endless animation. If you have to have something animated, limit it to one item only. Preferably, have no animation whatsoever, even if it looks like a Monty Python sketch. It is really distracting. It is the “oh… my… god… I’m never coming back to your website ever again” kind of distracting.
  37. Don’t subject me to color combinations that are hard on my eyes or have too little contrast. Blue text on a dark blue background is really hard to read.
  38. Don’t mess with my browser’s Back button. The Back button is the second-most used navigation feature, behind hyperlinks.
  39. Don’t forget to periodically update your website. If your latest news is dated July of 2002, I’m pretty much guessing at this point that nothing else on your website is relevant, timely, or useful either.
  40. Don’t use an image as a background if you plan on displaying text over it. By doing so, your telling me that the picture is more important than the words, and I shouldn’t bother reading them. Not that I can, anyway.
  41. Don’t use an animated background. Ever. Having a completely blank page is better than having one with an animated background. Having a monkey shoved up your åss is more fun than viewing a website with an animated background.
  42. Don’t show me unnecessarily huge images. Use the smallest images necessary for the required detail or impact. Huge images are simply rude. They make you look like an amateur.
  43. Don’t prevent right-clicks on the page or an image. That just encourages me to view your source code so I can laugh at the god-awful mess you’re trying to hide. If I want a copy of that image you’re desperately trying to protect, I can easily get it anyway. So can everyone else. If you don’t want us to have the image, don’t post it on the Internet in the first place.
  44. Don’t use Microsoft Word to create web pages. It spits out code that is not even proper HTML. It’s impossible to maintain. Links often don’t work, stuff appears in strange places, and your content gets lost in a sea of code that search engines won’t bother to wade through. Not even Internet Explorer interprets the code correctly.
  45. Don’t break a bunch of these common-sense rules and then scream to the world that you’re a web designer.

12 Responses to “45 Web Design Mistakes”

  1. Ken Patterson

    #5. A big problem with companies trying to be secure. BBC Worldwide and Nielsen’s sites that I have to work with require IE, and the last (ever) version of IE for the Mac doesn’t work! (Yes, I have XP and Parallels on my Mac, but it hogs up memory and the processor…)

    #13. I’ve been guilty of this. Now Geeklog keeps me close to a more universal size.

    #24. Again, guilty… An early version of dvillage.org used frames I even still have an example here,

    #25. I’ve done this before. Geeklog’s image tags in stories doesn’t allow image sizing, so I have to work harder at it.

    #27. YES! A Small Orange offers very good, inexpensive hosting ($5/month for their low end.) I switched to them from SBC/Pac Bell/whatever they call themselves… ASO was a fraction of the cost and had more space and services! ASO has also been good at responding to problems.

    Reply
  2. Kim

    None of these people need to be contacted telling them that they have crappy websites (Sean!)

    Reply
  3. richard

    @ken: I switched hosting for Richard’s Ramblings over to ASO in June 2006, thanks to your recommendations. They service me far better than the larger ISPs ever did.

    Reply
  4. Jon

    Not to be petty but perhaps in the spirit of #7 I should point out that there is a grammar error in point #5 (missing the word “make” as the second word in the first sentence).

    Reply
  5. Sean D. Martin

    Kim: “None of these people need to be contacted telling them that they have crappy websites (Sean!)

    ROFL!!!

    But, Richard told me I should this time!

    Reply
  6. richard

    Now, wait a minute!! I didn’t tell you to do anything!! I, like just about everyone else, would be interested in whatever technology Winston is using to make his websites look good only on computers in San Francisco and crappy everywhere else, but — for the record — I am in no way sanctioning any form of contact with him or anyone else linked to or otherwise mentioned here.

    Reply
  7. Sean

    Of course.

    But you did agree that his web site in particular (2nd link on item #45) would be amusing to ask him about. And so I did ask him if he could design for my large 20″ monitor, as well as small and medium ones. And asked, since his designs “look GOOD! in SF”, if they don’t look so good to me because I’m in Seattle but would look better were I to cross over the Golden Gate bridge.

    But no worries. Unlike the infamous (and much regretted) original comment to Goddessey this time there is no link back to your website.

    Reply
  8. richard

    Well, nice to see that Winston has clarified your question about the use of small- to medium-sized monitors, now specifying that his website is “designed for viewing on a 17-inch monitor”. Since my desk (not located in San Francisco) supports two 20-inch monitors, that must explain why the site still looks really bad.

    He has also clarified that his website printouts “look good on paper”, not just “on A4 paper”. I must be using the wrong paper, because they still don’t look good.

    Reply
  9. richard

    He’s branching out on the equipment he’s using to “test” his web pages:

    Look Great! on IPhone.

    Plus, if you view the HTML source of his page, you’ll see some new devices he’s testing his website on:

    My web pages look GOOD! <!– HP 15xx terminals, look GREAT! on Pacific Coffee store–> in <!–Vancouver, BC; and on the MacBook–>San Francisco.

    And it’s unfortunately impossible to ignore the META tag “Male Companion” and “male entertainment” keywords. Gives a whole new meaning to the quote on his Letters of Recommendation page:

    “Let’s tug on the boots and some leather and go at it.”

    Think I’m kidding? View the source of that page! [In case it ever goes away, you can view the source of an older archive of the page.]

    Reply


Leave a Reply to Jon

  • (will not be published)