Diabolical Design

© 2004, John Calder
http://www.TheEzine.net

You can find guides and tips on good web site design everywhere. In 1998, Vincent Flanders co-authored a book with a unique twist. It was called "Web Pages That Suck", and Mr. Flanders followed that with a similar co-authored book in 2002. In that spirit, we'd like to offer you our top five tips on diabolical design - how to create web pages that look like h-, well, you know.

1. Use javascript and Flash. Lots and lots of it. Make sure you ignore the fact that my browser isn't 100% compatible. If you can, try to crash my browser. It's not always 100% compatible, and I really like the color in that little Windows error box anyway.

2. I like a lot of gratuitous graphics too. Include lots of large files that take a while to download, especially over dialup. A long while. It would be an especially nice touch if you can have some heavy zig-zag and grid backgrounds, something that blends in with your text for that nice, unified look. And whatever you do, don't forget the little animated GIF files! They're cute, and especially distracting, so I'd like a lot of those too, please, all around your page.

3. If I do manage to get to one of your pages, please be certain that you've fixed the font sizes with CSS. Make them, oh, about 8 or 9 pixels high, bolded. That should do it - well, except use lots of different colors and font styles, just to prove to me you can. While you're in the CSS file anyway, try to get rid of some of that extra white space by adjusting the line height (the space between lines of text) so that it's only 1/2 it's normal space. There's no use in my having to scroll down the page - make sure it's all above the fold, OK?

4. Wait a minute - I forgot about the links. Can you use your CSS skills to turn off the underlines in your links, plus make them the same color as the rest of your text? They stand out too much if you don't do that. But, when I hover my mouse over them, I want you to give me a further display of some cool CSS tricks by making the link text turn to italic and get a LOT bigger. Enough to make the other text on the page move around a bit. I've never seen anything like that before.

5. Now to some good stuff - your colors. Be daring here. Forget about the old dark-on-light and light-on-dark basics. Try something like black text on a dark green background. Or maybe purple on red? Either way, just be different. And I don't see any reason to stick with complementary or contrasting colors. Nah, give the old color wheel a spin & see what turns up. Pick 'em and use 'em in 1-2-3 order, it won't matter. If you're using tables, it's nice to change the background color of every single cell. That will prove to me the level of tireless effort you've put into your site just for me.

Bonus tip: If you will put menus and other navigation elements in different places on each page, and not be clear on where a click will take me, that will make me look over each page more thoroughly, and I will want to click on all those links, just because I want to know where they lead. Really I will.

By the way, we hope you know that these tips were all in good fun, and very sarcastic. If you didn't know that, please buy Mr. Flanders' book, or any good book on design. Your visitors' eyes will thank you!