Web design rant

Dear web site designers,

Don’t design your whole site in Flash. Use it sparingly. Use it when you have to. If you use it, there’d better be a non-Flash way of looking at the same information, for people who can’t see Flash and for search engines (you know, those things which bring people to your site). Which means you might as well not bother.

Your mission statement and other such guff doesn’t matter to most people. Don’t show it as a splash screen.

In fact, don’t have a splash screen. They just slow people down. It’s like making people wait 30 seconds at the front door before letting them into your shop.

Don’t make people download pictures as ZIP files. JPGs and GIFs are compressed formats. You’re just making people jump through an extra hoop to see the picture, without saving any disk space or bandwidth.

Don’t use long web addresses (URIs) with lots of meaningless gibberish. Make them short enough to e-mail without problems — 70 characters or less. Make them easy to remember, pass verbally and dissect. (Most CMS writers still need to figure this out). Ideally URIs should not include long meaningless numbers like GUIDs.

Hide the trailing /index.shtml /default.aspx and /index.jsp etc filenames. They’re utterly pointless, make your URIs unnecessarily long, and easily avoided with some fiddling of your web server. .htaccess is your friend.

Get your URIs right, because if your pages live forever, so should your URLs.

Don’t write your pages in such a way that font size options in web browsers don’t work, or people using screen readers can’t figure out what’s going on.

Make it legible. No garish colours. Or at least make it work if the user switches your garish colours off.

Stop assuming people are using IE on Windows, and barring anybody else. You’re pissing off a small but significant (and growing) number of your potential customers.

Popup/under/over/whatever windows are evil. No matter how much ad revenue you might be getting from them.

If you’ve got sound on your site, you’d better have a dead easy way of turning it off. Without the user browsing to elsewhere.

Use Form Post for pages that change things or actually require field values to be hidden; use Get for pages that don’t. That’s what they were designed for.

You’d better have a good reason for using frames.

Tables and individual font tags are dead. Viva la CSS.

How many damn pages give me script errors? Test them, make sure they work, or don’t use them.

What are your biggest web page gripes? Any suggestions, additions, corrections?

And okay, so I haven’t quite achieved all these points on my web sites… especially the older ones. But I’m getting there… gradually. Eagle-eyed geeks might notice I’ve changed the Permalinks to make them friendlier. The old ones (post 1/1/04) will continue to work. Oh yeah, and I have the day off today. Nyah nyah etc.

By Daniel Bowen

Transport blogger / campaigner and spokesperson for the Public Transport Users Association / professional geek.
Bunurong land, Melbourne, Australia.
Opinions on this blog are all mine.

22 replies on “Web design rant”

Great points there. Just learning HTML right now(jeez after 5 yrs in IT I’m finally doing this ? Yikes), but those have always ticked me off for no good reason, esp. the full-on flash sites.

I’ve got you beat on the days off, of course I’ve been laid off so that may not count.

Sorry Daniel but the bugbear of “Don’t write your pages in such a way that font size options in web browsers don’t work, or people using screen readers can’t figure out what’s going on.” – it doesn’t work on your site either – not in IE6 on Windows 2000 which I am forced to use at work. :)

And, though it’s hard when using external code, you are using depeecated HTML tags – you could probably strip them out at CSS them. :)

My site isn’t perfect either. Most sites aren’t – a most are designed with IE in mind because that’s all a lot of webmasters have access to and the notion is that ‘everyone’ uses them – I personally use Safari at home which is way superior :)

I won’t pick any more holes in your site save that you do it to mine. Have a good day.

DON’T have music playing on your site. At all. I don’t even want the option of turning it off. If it’s playing music, I am OUTTA there. DON’T post multiple animated gifs all over the place, they’re too distracting. Small fonts are cool – though due to their nature of being small, they are VERY hard to read. Don’t use them. DON’T tell anyone your site looks better with SuchAndSuch a font as an excuse for laziness, design your site so that it looks good with ALL basic font types. DON’T make every link on your site open in a new window (ie, everything on YOUR site, I don’t care about links to outside sites). DON’T hotlink pictures from any site but your own, just just pisses everyone off at both ends. DON’T listen to your clients – blue and green should NEVER be seen (I have learnt this from experience, ugh).

Andy, I know, I know… one day I’ll fix everything. That’s why I included the disclaimer!
Ren, some browsers (including IE) have the option to ignore sounds. Hitting Escape also often works. But yeah, no arguments from me on your points.

Fully agreed with all that – I hate sites that were clearly designed by marketroids instead of real people. Everyone’s already said what I was going to, so I’ll finish on a high note.

“Laaaaaaaaaaaa !!”

With you there on nearly everything, particularly on Flash and splash screens, but … as a CMS writer myself, sometimes long URIs are unavoidable and you can’t always guarantee that .htaccess is going to be there to help you. Not everyone runs Apache, you know.

As for the table tag, it is most assuredly not dead. Apart from inconsistent standards support across the most popular browsers, the CSS standard doesn’t offer a viable alternative to tables for non-trivial layouts. I agree that it should be considered ‘deprecated’ for layout purposes, but it’s going to be around for a long time to come.

Aaargh. I just noticed that you linked “CMS” to PHP Nuke. I stopped using it last year because of endemic SQL injection vulnerabilities. I don’t know what the current version is like, but I read about a fresh batch of exploits a few months back.

John, yeah there’s long okay-ish URIs like The Age, but crap ones like the PHPNuke one I linked to. Chances of getting a user to pass that verbally, so someone can type it? Zero. It should have been or something.

Security flaws are certainly another thing to be wary of. And mmmm.. a lot of my older pages use tables and there are much worse sins in web design, it’s true.

I am currently patching the news poster I use as it insists on using mulitple
tags instead of paragraph marks, which also screws things up if I use a list and then go back to normal text. :(

I’d love to use CSS reliably for positioning etc. but as it stands, my three column table has to be. Well it probably doesn’t have to be, but it is.

And as for another day off, that’s just wrong. :)

Me again sorry. I like how your URLs work, and how if you lop off the end bits it shows articles in the larger date range. That is nice. I don’t get that luxury, just stuck with ID numbers. Unless I move news posters but will need to do that sooner than later as I am accruing quite a number of articles that would need transferring. I like your titles being in the URL.

Dan, I posted like I was surprised – I know they should work like that. I am seriously considering changing news poster so I can get your kinda system in place.

Fantastic rules. I wish we could fine sites that didn’t comply. Flash in particular is something I hate. Granted it is occasionally used well but probably less than 1 time in 100. Even on high speed broadband it is still a pain!

Re the constant, brainless abuse of Flash: A-FUCKING-MEN! I also hate the lazy way stuff gets published in pdf format when there’s no important page formatting present. Take a large piece of cardoard, cut a small rectangular hole in it, and then try to read a newspaper by moving it around the page to see what I mean.

Duncan: the Hi-tec site asking for your country… well, that’s functional, so it’s not what I’d call a splash page. I wonder what it looks like with Flash turned off though…

Andy: I’m using WordPress. Nothing is perfect of course, but WordPress is pretty damn good, as far as I’ve seen.

It’s looking pretty good though – got it on a beta page until I fine tune it and get all my old posts over – wow I even got it to XHTML 1.1 compliance – never been there before! Hee-hee. Does mean I can’t use most of the scripts that publish blog-lists and stuff as they’re so badly written! :)

Still, I have spent so long messing around installing stuff that I haven’t actually written a post for a week. D’oh!

>> Make it legible. No garish colours.

I notice you linked this comment to DVD Plaza. You’ll be pleased to hear I revised our colour scheme and relaunched earlier this month. That said, I thought I might take this opportunity to explain why the original colour scheme went so horribly wrong.

It is generally accepted that white on blue is the easiest colour to read – I recall reading many reports on this years back, MS Word back in the days of DOS worked white on blue, WinWord still contains an old option tucked away to show documents white on blue, and my own experience finds white on blue nicer.

During development of my new design I assembled a large test group to thoroughly test every aspect of my new site – although the new site “resembles” our former designs it was actually a total rework from the ground up, not only 100% ditching all former HTML and rewriting in pure XHTML and CSS but I also rewrote all my behind the scenes software (plus the commercial package I use for the forums, vBulletin, I moved up to version 3 and then heavily rewrote it (as I did with prior versions) to integration into our system as well as suite our needs). Anyways (if you’re still awake!), the test group absolutely adored the new colour scheme.

The night before launch, two years since the redevelopment had begun and one year overdue (thanks to IE compatibility issues), I stumbled upon a major problem – the white was extremely washed out against the (what appeared to be) light blue on my CRT display at the office. I had primarily been developing on LCDs (two Apple PowerBooks and several external LCDs) and testing with a handful of CRTs. I immediately commenced testing on a range of CRTs and, out of approximately ten I tested, only two displayed the text so washed out.

Given how incredibly overdue the new site was, and how much I had poured into it, I decided to launch. To my utter horror, I had masses of complaints rolling in immediately throughout that first weekend – a large number of people were experiencing washed out displays – contrast/brightness/saturation/etc settings wrong, who knows the problem was too widespread to dismiss. I immediately began darkening the hell out of the blues, which meant re-rending over 100 graphics in addition to reworking my CSS, and relaunched. I wasn’t 100% happy with it but it was much better.

Unfortunately it turned out that when viewing on my office CRT display again, eg the same washed out appearance so many others had got, the colours looked ABSOLUTELY HORRID!!!!! They looked reasonable on LCDs, looked reasonable on a bunch of CRTs I tested on, but for those that didn’t see the original colours right they weren’t seeing these right either – usable, they could now read the text, but utterly horrid… no, outright atrocious!!!

When I look back on the original colour scheme, but viewing on my PowerBook display, I still can’t help but think it looks great. I learned a number of lessons however:

* Extreme variations in CRT displays mean that you cannot rely on colours being accurate. You must have extreme variations in contrast to ensure legible text – eg plain white on black or black on plain white.

* People with poor eyesight seem to struggle, or outright fail, to focus their eyes on inverse text. They can see black on white just fine, but white against mass black for example they severely struggle with.

* People are outright acustomed to looking at black text against white, plain and simple.

There were a few other design elements that seemed to clash with some people (for example I had large headings for each section that intentionally overlapped two different colour regions, differing opinions on fonts, etc) which I’ve also changed, but overall the relaunch had one major focus – to continue with the new design but integrate a black against white colour sceheme for the main text.

During the month of the original launch I couldn’t go a single day without masses of complaints/abuse in our forums, via private messages, and/or via e-mail – since the relaunch I haven’t received any complaints!

I knew from the start I was being daring with many aspects of my new design – and most of it has all paid off in a very very big way (including significant cost and performance savings through a very cool bandwidth saving system I came up with for all our graphics). However, when it comes to colour I have learned dearly that it is NOT wise to try and be daring/smart. Naturally we learn from our mistakes, but that more of a monumental c#ckup than a mistake!!!

Comments are closed.