7 Deadly Web Design Sins

Published 24 Sep 2008


A subjective list of things not to implement in a web design.

  1. When The Stars Are Right Designs

    Websites that say something along Best viewed at 1024x768, in IE 6.105, with one eye squinting, and when Saturn is conjunct with Uranus.

    This cartoon expresses pretty well what I feel about this. It usually means the designer was too lazy to test anywhere apart from their own machine.

    Suggestions:

    • Write standards compliant (X)HTML/CSS and validate (Add the hacks for idiosyncratic browsers later).
    • Avoid fixed-width layouts if you can.
    • Test in as many browsers and on as many machines as possible
    • Accept that you don't have complete control on a how a page will render - that's the nature of (X)HTML.

  2. Sites That Go Bump Scream in the Night

    You're browsing late at night. Earlier on in the day you were playing music on your PC. You innocently click on a link and suddenly BAHM! - music starts blaring full volume out of the speakers, giving you new grey hair, waking the kid(s)/significant other/neighbours and startling the cat.

    What I do is frantically click on my browser's back button. And I don't click forward. In fact, if a website automatically starts playing music or video, I will usually never visit again. This applies doubly if the file in question is an advert.

    Simple solution: autostart=off. Not even YouTube (who's existence is streaming video) starts playing automatically on their homepage.

  3. Page Bloat

    Don't assume everyone has a brand new computer and a super fast connection - broadband isn't even ubiquitous in the 1st world. Any page will load fast when it's coming from your hard drive cache, but it's a different story for your visitors. Read more about this on The Regisiter.

    Worst Offender: MySpace pages

    Solution: Don't go overboard with widgets, CSS and javascript should be external and compressed, consider using gziped output in PHP scripts.

  4. Browser Detection

    Don't do it. Especially don't do it badly and assume there's only FF and IE, thus locking out everone using Safari, Opera, an iPhone, and any browser released after you write the script (e.g. Google's Chrome).

    Particularly funny (as in laughing at you, not with you) are sites they haven't been updated for a while and tell their visitors that they must upgrade their browser to IE 5 when encountering something like Firefox 3.

    If you need a certain capability (e.g. Javascript, Flash), it should degrade gracefully, giving the visitor an alternative way (e.g. <noscript> with a link to plain HTML version) of accessing the content. Ordering people to upgrade their browser or install XYZ plugin is just rude - and often not possible (work machine, library access, unsupported platform, etc.)

    The exception to this rule is IE's conditional comments. It's often necessary to include extra CSS/javscript for IE to render as intended, though to be on the safe side I recommend using version detection - otherwise when IE 10 comes out in a couple of years with the bugs fixed, your site may break.

  5. Using Tables For Layout

    It's the 21st century. It also makes a site less accessible for people using text-to-speech readers for example, and it will take longer for the pages to render. Check out YAML as a good alternative.

  6. Flash Navigation Menu

    Particularly when it makes twinkling noises on every click or mouse-over. It may impress the PHB the first (and often only) time they look at the site, but it'll usually annoy your visitors within seconds.

    Often done with an presumptuous You must install Flash 9 message instead of an alternative HTML menu, which irritates the user and means the search engine robots have no links to follow.

    Alternative: Use CSS menus, or DHTML if you must.

  7. Splash Pages

    Especially Flash splash pages. Thankfully becoming less common than they once were. It's a waste of time for your visitors, and it does your search-engine rankings no good at all.

Tags:

No comments yet   |   post comment Post a comment

Creative Commons License

« Articles Index »