the 200ok weblog

ourbrisbane.com is a high-profile community site for my home town (run by the city council), which has just launched a new-look site - probably to coincide with a tv ad campaign. While the look and feel is really just an evolution of their old design, the real success is under the bonnet. Some key points:

• Gone is the old table-based design, hello DIVs and CSS.
• The design scales nicely when you increase the text size - many sites still fail this check.
• There's a skip link to avoid the (quite long) navigation in screen readers.
• The flyout navigation uses real links, not hash links; so if you disable javascript or can't use the flyouts you can still click through to the sections - which have all the flyout options.
• Works in Opera 8 and Firefox 1.0.4 - this should not be a separate item, but considering sites like news.com.au actually launched designs that crashed browsers other than IE... it gets a tick.

It's not perfect though...

• Sub-pages still use layout tables.
• They've made the old classic mistake of forgetting to explicitly set their white background colour. UPDATE: They've now set the background. Either they noticed themselves, or they read their feedback emails :)
• The page doesn't validate, mostly due to a missing quote in an IMG element and a stack of javascript triggers (invalid attributes).
• Some link colour combinations fail contrast checks (tested using the AIS Colour Contrast Analyser), most notably the bright orange What's On section.

All up? Well there are things I'd do differently and a few errors that need fixing, but realistically this is a huge step forward for ourbrisbane.com. It would have to be a high-traffic site, so they should be experiencing faster load times and lower bandwidth usage. Based on a brief evaluation, I'd expect an assistive technology user would be able to use the site quite well; whereas I'd expect they probably would have given up on the old one.

So while it may not be a pure-standards exemplar, ourbrisbane.com is miles ahead of most government-funded websites we have here in Australia.

People seem to think that some things just can't be done in a standards-compliant, accessible manner. They think only boring things can be done with XHTML. I'll be as nice as possible.... that's crap! Let's look at a couple of examples.

Let's start with rock'n'roll. Wild, crazy, loud. Has to look great, so surely it can't be accessible too? Not so, check out RAMMSTEIN... their website both rocks AND validates. Yes, we have a standards-compliant website for a band that regularly uses flame throwers and explosives in their stage show.

Next up, we have a web comic: Volvo vs Astra. I find this particularly amusing since my first car was a Volvo and I traded to an Astra... so I can tell you, all of the points made are true. Including the one about playing chicken (merging in a dinted Volvo is fun!). So anyway, we have a panel-by-panel comic like any other; yet it's XHTML+CSS (ok, so it doesn't validate due to some URL encoding; but we'll look past that).

The speech balloons are text+CSS; and the images have ALT text. Each panel is in its own table cell, grouping them together (ok, a DIV would have worked too). I can think of some display: none tricks to attribute the speech bubbles but that aside it's still an impressive job.

Next... probably the biggest one: drag and drop. Can't be done without a mouse? Think again! [brothercake] Docking boxes (dbx): Docking boxes (dbx) adds animated drag 'n' drop, snap-to-grid, and show/hide-contents functionality to any group of elements. And ... in what might be another world-first for brothercake - dbx is fully accessible to the keyboard as well as the mouse, an action I've dubbed 'press 'n' move'

So there you have it, folks. Three things people probably thought couldn't be done with web standards.

• Mike Davidson: Introducing sIFR: The Healthy Alternative to Browser Text & Mike Davidson: sIFR 2.0 RC 3 is Here... Come Get Some. Now this is cool. As we are all painfully aware, web sites can only use installed fonts right? Well this is a nifty trick to layer whatever you want onto the page with some Flash magic. Still requires plugins etc so it's not the native/robust solution we want, but it's a neat hack in the meantime.
• Ascender Teams With Microsoft, Strips "Core" from Web Fonts || Typographica. No more core fonts, apparently MS stopped caring again. Anyone surprised?
• VisiBone Font Survey Results - Browsershare. By default you can only use what's installed on the user's machine, remember? So you need to know what to expect the majority of users will have...
• Mac OS X 10.3: Fonts list, which is quite an impressive list of fonts. Doesn't help web developers overmuch, except for the odd heading graphic; but it's a sweet deal for print designers.
• Screenfont.ca: All about fonts for captioning and subtitling (2005.04.29). Major point: captioning fonts suck badly right now.

If you're in the Brisbane area and interested in web standards, you should come along to the Web Standards Group - Brisbane June meeting on Tuesday 14 June, 2005 (note the meeting was originally advertised for the 7th, but it's definitely the 14th).

There's this guy, talking about this stuff. It might even be me, talking about advocating web standards and accessibility within your organisation!

Self-promotion aside, WSG is a great group and well worth everyone's attention.

It seems the web standards world is taking time out from the usual witty banter to partake of a musical meme. Andrew Krespanis passed the baton to me earlier today. So, although it's not web related I am going to indulge :)

Total volume of music on my computer

We don't have fair use legislation in Australia just yet, so none. Yes, that does mean iPods have few legal uses in Australia...

Actually now that I think about it, there's quite a few megs worth of songs by local band Tycho Brahe on my hard drive. All entirely legal since I run their website and the website has them up for free download :)

Last CD I purchased

VNV Nation's new album Matter+Form.

Playing right now

Nothing at this precise moment, so I'll have to backtrack to the last thing I played at home (where I am now): Man With No Name's Earth Moving the Sun.

Five songs that mean a lot to me

Only five? :)

• We Stand Alone by Covenant (the industrial band, not the metal band). We Stand Alone is the song that I remember most from our interstate trip to see Covenant play in Sydney last year. I pushed forward through the crowd in anticipation and was only a few rows back from the stage when that awesome lead-in started.
• Honour (Juno version) by VNV Nation. I had to choose from a stack of dancefloor anthems and what the hell, this song kicked off the DJ set I played once that kept the dancefloor packed for the entire timeslot. Now that is a rush.
• Peter Gunn off The Blues Brothers soundtrack (edging out several others). You can't deny it's a great piece of music; with that driving bass line and fat horn section. The Blues Brothers is my enduring favourite movie and the music was a major influence in my choice to learn saxophone at high school.
• London Calling, Rock the Casbah and White Riot by The Clash. I refuse to choose ;)
• Homesick by The Cure was my favourite song through high school (oh the angst, hand-forehead-nail!). It's a beautiful, wistful track which is musically very rich.

Five people to whom I am (not) passing the musical baton

To be honest I'm not going to pass the baton at this stage, since so many people have already answered the quiz. Instead, I'm going to link to five responses I found interesting. Memes evolve and mutate, after all.

• Random Banter: A Musical Baton. Jason Klein apparently had the same immediate thought as me - did the record companies start this meme?
• Jeffrey Veen gets a link because I'd only heard of one of the artists he listed.
• Selfgratification: Meme me up, Scotty! For fooling with the meme and liking Cat Empire. Oh, and for passing the baton to me as well :) [BTW Cam... my first CD purchase - I think - was Songs of Faith and Devotion by Depeche Mode. Next purchase is undecided, I actually keep an entire list of planned purchases.]
• The Man in Blue - Musical baton, purely for thinking of Dave Brubeck when I didn't.
• You know it's driving me nuts, there was a particular response I liked when I read it earlier today but now I can't find it amongst all the webdev sites I've visited. I'd like to observe that half the people who have answered the meme are also planning to be at WE05. Maybe we should all get t-shirts made with our responses on the back.

I'm also wondering if Nick and I are the only web developers who like industrial? :)

Following up on my earlier post about VoiceOver...

First... VoiceOver and Safari: Screen reading on the Mac | 456 Berea Street, which gives a first impression from a (sighted) developer's point of view. The article also makes the point that buying a Mac Mini (with OSX Tiger) is cheaper than buying a license for JAWS.

The cost comparison glosses over purchasing a monitor and other transition costs (eg. other software) if you were leaving a PC environment, however it does highlight just how expensive screen reader software is - development is expensive and the market is small. Does a screen reader user need a monitor? Well, yes, unless they are 100% blind AND nobody else uses the machine AND they do all of their own technical support, they still need a monitor.

Second... Jason Wong | Voiceover - Day 1, which details the experience of setting up the author's blind father with VoiceOver. If nothing else, read this to be reminded that blind users are just as smart and computer savvy as anyone else. By necessity, they also have to have good memories (blind people can't just grab a writing pad, scribble notes down and refer to them later).

The article concludes that more audio support material is required for new users; as well as observing that many programs and websites are not friendly to visually impaired users.

Today everyone seems to be reading Web Standards Group - Ten Questions for Joe Clark. It's an excellent article/interview.

So go read it :)