JBVoices
Breezing the shoot. Random mutterings of a Web Developer. » How not to build web sites

I moderate on a couple of fora, one of which is aimed at the beginner end of web design. I have to say we’ve had some success leading newbies from the excesses of FrontPage button pushing disasters to some pretty nice CSS layouts, complete with Doctype, that validate. As more and more people jump on the web design bandwagon however, the fight goes on.

I’ve lost count of the number of people who turn up on there asking for help, who freely admit that they’ve just started a new job looking after a company site and have no idea where to start. These are usually beginners who’ve done a hobby page and are now presented with a CMS or something developed with Dreamweaver. How they get these jobs is beyond me, I can only put it down to the recruiting manager not having a clue what he needs, and I’ve seen reasonable professional sites go from near validation to FrontPage bot ridden heaps.

What seems to run through most beginner sites (and those of some pros who’ll never learn) are the “cool” “hey look what I can do” javascripts. We’ve all done it but most of us learned pretty fast that it’s not so cool, in fact it’s usually pretty tacky unless it’s very well done. Here’s a list, and I’m open to further suggestions (polite ones please), of things that in my opinion should be avoided like the plague.

Web Dev No-Nos….

Trap me on your site

If there is one thing guaranteed to send me screaming up the walls and ensure I never go near your site again, it’s trapping me on the home page. If I get to your site and find it’s not quite what I’m after but it’s interesting, I may bookmark it and then hit the back button to get back to my search results. If all that happens is a page refresh that serves your homepage up again, I’ll probably hit the back button again just to make sure that it wasn’t a glitch. If I find I’m still on your homepage there are a couple of things I’ll do after crashing my browser to escape from you.

1. Delete your bookmark to ensure I never accidentally come back
2. Perform another Google search for companies who do deliveries of Semtex

Resize the Browser window

It’s my screen, my browser. I have it set up how I want it and I don’t want you telling me I’m wrong and that I have to have it your way. I don’t care if it’s your site. Have you never heard the saying

The customer is always right

If not then learn it off by heart because even when your customer is clearly wrong, they’re right and if you want their business, swallow it.

Pop Ups, Unders, Overs, Intos

There are occasions when pop-ups make sense. For example, you have a jukebox on your page or there’s some information that would be useful to refer to after you’ve gone to other pages on the site. In both of these cases I provide a link that clearly states it’s a pop-up that you can leave open while you browse the rest of the site. Other than those, pop-ups are a complete annoyance and the reason why pop-up blockers are so popular. The fact that people are blocking them should tell you something about your adverts, witty captions and completely irrelevant “how cool is this” stuff. If it’s that important it should be part of the actual page, and if it needs to stand out then change the design.

Even more annoying are the ‘chromeless’ windows. Those where the provider has made sure you can’t shut the darn things down by taking away all the control buttons. Luckily some browsers have blocked the worst excesses of these for security reasons so you’re wasting your time setting them up in the first place.

Music

If you happen to be Elton John, Puff Daddy, Coldplay or the like then there’s a pretty good chance I’ve come to your site to listen to music. Well maybe not Puff Daddy, but hey, each to their own. If you’re not one of these then I’m visiting your site for information, not to have your favourite band rammed down my throat. Don’t get me wrong, I defend your right to like Rammstein but I’m not a fan and I’d rather like the choice of whether I listen to them or not, especially when your site has nothing whatsoever to do with the band.

Some things you might like to think about:

• Remember that some people sneaky surf the web whilst at work, they’re really going to thank you when the boss gets a loud and clear hint that they’re not doing what he pays them to do.
• Unless you’re using some appalling computer generated wav file then you’re using copyrighted music and you’re asking for trouble. It’s hard to be a fan when the band concerned are suing you for using their music without permission.

Funky backgrounds

When you find yourself searching the web for background gifs to cover your page, STOP! If what you’re looking for is anything more than a soft hint of a texture or to be used for more than an accent on your page then don’t do it. I spend more than enough time ruining my eyesight by staring at the screen whilst working, I really don’t need you supporting my optician in their endeavours to get me to spend mountains of cash. Not only do the colours and patterns hurt your eyes but text can be impossible to read.

A prime example of over the top backgrounds can be seen at the Dokimos site. One of these days the guy responsible for this will change it and the web will be a poorer place for entertainment but until then, it’s used by many schools and colleges as well as Bad Design references to show how not to do it. It also showcases other bad moves such as the dove fluttering around on the page and I believe there’s a black cat in there somewhere as well. Luckily I surf with Firefox which hides those nicely and it takes Internet Explorer to see the full eyeball scrunching effect!

Enormous Images

I’m not referring to the size they appear on the page although if they’re bigger than the viewport and I have to scroll to see the whole thing then I don’t see the point. I’m referring to file weight, i.e. kilobytes, or worse, megabytes. I was recently asked to review a site. Now I’m on very fast broadband and it took the page over 2 minutes to load. Not one image on there was under 90kb, the header was just over 1 Gigabyte!!!

The site owner couldn’t understand it. The image was only 800 pixels wide. She’d used FrontPage and just dragged the box handles to shrink it. Always, always optimise your images in a graphics package before adding them to your site. Oh, and by graphics package I don’t mean Word or PowerPoint, neither of which are graphics packages and use of which is a whole other issue.

Lay your page out with text boxes

I’m no longer using tables to lay out my pages. I use style sheets and, for accessibility as well as ease of maintenance, I advise against the use of tables but heck, even tables have to be a better way forward than text boxes.

Why on earth Microsoft even thought it was sensible to stick drawing tools into FrontPage I will never know. They result in code bloat on a massive scale, result in text that isn’t text, the search engines can’t read it and neither can the person you’re asking for help when your page is completely broken. I beg you, don’t touch the drawing toolbar, turn it off in the toolbar options. I’ll even get on my knees if it’ll help persuade you.

Make your site with Word, Excel or Powerpoint

Another faux pas but this time, whoever came up with it at Microsoft and thought it was even remotely sensible, should in my humble opinion be hung, drawn and quartered. They should then hand over the remains to me so I can jump up and down on the bits.

Word is a word processor, it’s great for letters, reports in fact anything that traditionally got put on paper. Excel is a spreadsheet. It’s for figures and graphs and making things add up and calculations and extrapolations and soooo much more. Powerpoint is for slideshows, to be beamed onto a screen from an overhead projector to make people fall asleep and Publisher is for documents such as brochures. None of them should have a “save as HTML” button anywhere near them.

The excuse for providing this was so that hobbyists could set up a web page if they couldn’t afford to buy FrontPage. It’s a poor excuse. There are many free web editors around that you can grab, some are very good. If you insist on using any of the Office products to do your sites please remember the following:

• Much of what you have done will only show up properly in Internet Explorer 6 or below. Even Microsoft have started to see the light and have released IE7 which is much more in line with the other browsers and does some odd things with badly developed pages.
• When you get problems, and you will, if you go onto a forum to ask for help, unless you can find one that specialises in this mess, the likelihood is you’ll either be laughed off the page or told to go do the site properly. The volunteers on these fora usually go straight for the code behind the page to track the fault. When they see the pigs ear that’s been produced, few will happily spend hours downloading your code, setting it up on their own machine and trying to work out the fixes. If you find one that does then buy them a large drink as they’ll need it.

This site best viewed in…..

Aaaaaaaaaaaarrrrrrrrrrrrrrrrrgggggggggggggghhhhhhhhhhhhhhh!!!!!!!

You can guarantee that whatever this site is best viewed in is not what I’m viewing in. Furthermore I have absolutely no intention of downloading or setting up whatever you suggest. If you can’t be bothered to make your site look reasonable in the major browsers at different resolutions then why the heck should I bother to look at it? It’s not difficult, really it isn’t. It’s just a case of looking at it in something other than Internet Explorer whilst you’re developing it.

I’m not saying it needs to look identical. In some cases that can’t be done but it should at least be usable. Let’s face it, the only people doing direct comparisons with more than one browser open are us anally retentive web devs. Anyone else will only notice there’s something amiss if they see a flaming great notice telling them there is. Kill it.

So what should you do?

If you are guilty of any of the above but have seen the light and are ready to clean up your act then I can’t do more than suggest this book to you.

You might also like to take a trip over to Mike Cherim’s excellent article titled Stop writing Garbage Code

Enjoy, I look forward to visiting your site.

This entry was posted on Sunday, April 8th, 2007 at 5:15 pm and is filed under Web Development. You can follow responses to this entry through the Comments RSS Feed. You can leave a response or trackback from your site.

Bookmarking Links » del.icio.us | Digg | Furl | Reddit | BlinkList | Ma.gnolia | StumbleUpon | Technorati | Help |

These posts may be related:

How not to build web sites….. Part 2 »

Ask Auntie Jaybee »

Inaccessible sites. Who’s to blame? »