iMetLion.com

He started off by explaining from personal experience, how autism affects the way people use the web. Autism is about processing. It’s just a different way of thinking. Most people with autism are affected by changes in sensory input. For example, Jamie sometimes can’t read when there’s a background sound. So having an audio file play when your site loads is not only irritating it’s inaccessible.

Language processing can also be a challenge. When people talk very quickly he often can’t keep up. For example, when web videos cut quickly from scene to scene he finds he gets left behind, he has to rewatch them over and over. This can be stressful.

Following a theme from the previous presentation, Jamie expressed an issue with literal commands. His experience is, early in his life when asked to wash his hands ‘in the toilet’, that’s literally what he did. Subtleties in life and on the web can cause problems. For example, when adding friends in Facebook, the function performed by the site can be different depending on the context. On some pages the functionality is to simply add people who are already registered, on other pages you’re expected to enter their email addresses.

After this initial section the presentation changed format. Seeing as it seemed to have worked in the past, Jamie then struck up an interview dialogue with Henny. She posed questions along with the rest of the audience. The next bit follows that format (with a stream of consciousness thrown in).

Q. You said with video you have to rewind. This would be awful when streaming video (e.g. iPlayer), how can this be made more comfortable?

A. Captioning and transcripts. The BBC now has a nice live text captioning system using HTML5. However, sometimes he uses a screen reader when he gets stressed, Jamie explained. In fact, to help him process information he built his own screen reader using a Mac, the inbuilt VoiceOver and some AppleScript. His reader uses Microformats and embedded semantics. He built it because he uses non-sighted navigation quite often to understand a page, but can find this difficult because the visual and code order of the page are often different. This means unmodified VoiceOver can be difficult to understand. Using AppleScript he gets the website to read in the order he wants. Snow Leopard now has intelligent select so VoiceOver has caught up with what he needs.

Q. Is his screen reader source available?

A. Err… Yes but it’s hacky and built specifically for him.

Jamie is keen to break down assumptions on assistive technology, it’s not just blind people who use screen readers. With this in mind, his opinion is that web designers should not use the title attribute. He’s noticed an obsession with using nice long titles. Often web designers use title and ALT text plus the usual copy all at the same time. Jamie hears all of them. An example of this is the Amazon website. It’s really accessible with all of these attributes, perhaps too accessible.

The discussion moves to VoiceOver and any specific features that make it easier for Jamie to use:

• Detection, one to one representation of movement on the keyboard and movement on the screen, this is new with the Mac gestural track pad.

Of note, screen readers can be too fast for Jamie. Also there are some that try to sound clear and others that go for a human voice. So which does he choose? His answer was enlightening, he chooses a human sound if the page is written in a human voice, this helps his understanding. Concatenative speech engines sound better but are less responsive. Most developers are not even aware that there’s more than one voice. One problem with VoiceOver is it can take too long to read keywords.

Q. Did he create his own presentation design?

Yes. ;)

Antonia (hiantonia.wordpress.com) has been working in accessibility for 10 years. She’s a web designer and consultant. See Antonia’s notes at her blog or see her slides.

Her belief is that people are not defined by their disability, partly because they could have many. There are lots of ways to go online, not just one fit. Learning disabled people have increasing control of their lives, and expect to be able to use the web. On the web people like to take their time and not feel judged by their disability. However, many people are locked out of websites. Design is often the key to whether a site is accessible.

Antonia played her first video interview. It features Martin, a man with autism, using the eBay site as Antonia sits beside. Generally he likes it. He likes the wealth of information displayed and the clean layout. He could comfortably associate items with the descriptions. For him the interface fails when he sees the first ‘buy it now’ icon.

He clicks on it, gets confused when nothing happens (it’s not a link) and this stalls his flow. Once he was through to the product page he understood what parts of the page were actionable.

Websites sometimes use context as part of their interface, this causes issues for those who fail to pick up on such subtleties. That’s a cognitive accessibilty problem.

Next Antonia asks Martin to visit the Amazon website. He likes it, it’s nice and bright with lots of colours plus using search is OK. But Antonia asks ‘How would you buy an arsenal shirt?’ He selects a size, this brings up another window with sizes to select. It puts an orange border around the selection, he notices that the information on the right side of the page changes. He knows where the checkout is because the icon looks like a shopping cart. Beyond this he gets frustrated. He thinks the link to account is the ‘go to shopping’ button. He’s right, it’s hard to find. How to logout? He finds this difficult as well. He either wants to close the browser window or use the back button. In the end he had to be told where the sign-out button was.

Generally the Amazon site doesn’t have enough good or meaningful icons, in Martin’s case he only understood the shopping cart. Signposting was not relevant. There was bad typography and poor contrast between elements. Buttons were not defined enough, this denied Martin access to parts of the site.

But won’t catering for people with cognitive disabilities cause more design ‘noise’ on a website?

When designing for cognitive accessibility, making everything literal is key. In the same way as designing for someone with a physical disability, making your site accessible can often benefit everyone. Antonia displayed a poster meant to convey the message not to run on the tube. The poster was less than clear. Making it literal, e.g. with a big red cross over the runner, could’ve improved the explanation for all.

Design advice

• Use a hierarchy of visual language, e.g. headings that decrease in size.
• Group elements of a similar type or function. Sometimes less is more. Anecdotally, Antonia surveyed eight people and only one knew what ‘i’ meant when signifying information, the rest understood ‘?’. Sometimes it’s good to have one link that takes us through to a page that groups things together.
• Sometimes different sized icons are useful. Apple’s Interface Manual uses different colours for different contexts.
• Hovering states are really useful.
• Colour coding is also really useful, despite designers sometimes thinking it will ruin their design.
• Giving users alternative ways to change text size is important. They often can’t remember (for good reason) where to do it in the browser. Education can be the key here, often people don’t know the difference between a browser and a website. Discoverability for preferences is an issue. Just being able to get back to the view window is important, sometimes this becomes a major challenge.
• Use adequate spacing. For example, the BBC homepage is complicated but good because things are grouped with adequate gutters. Putting things into modules makes them look bigger.

Is this my responsibility?

It’s not just down to developers. It’s everyones responsibility, including the browser makers. Cohesion and consistency when working as a team is important. Martin was a confident user, but most people think their inability to use a web interface is their own fault.

Where to go from here?

Where can we get more information?

• Changepeople.co.uk are working on a manual for this kind of accessibility.

With its Symbian OS, I’ve always recommended it with the warning that it’s a bit of a geeks phone. Downloading applications from the net, they don’t go through the same vetting that takes place with the Apple App Store. Some can be a little less stable than others and in some instances they conflict. Feature-wise it’s a solid phone if you’re prepared to perform the odd restart and fault find.

I’ve always thought it’s the utilitarian answer to the iPhone. Where Apple customers are until now unable to copy and paste, you can with an N95, but the button is somewhat hidden. Patches, fixes and apps exist for the Nokia where the system is not as locked down. What’s great about the N95 is that, where the need arises, someone’s usually solved a functionality problem in advance. The answer is hardly ever ‘we don’t support that’.

So before I get swept away in Apple and Palm hype, I thought I’d log my favourite apps. Here goes:

• Fring. One of my favourite apps for functionality. It links with Skype and you can have what looks like a normal phone call through WiFi (free if you’re calling someone on their computer). I regularly talk to people in Australia on this and after a few hitches (generally with the net speed at the other end) it now works perfectly. It also works with other social networking sites.
• Gmail. An amazingly fully featured app from Google. It keeps a local copy of your email but syncs with their server. You’ll never lose a message and it has better functionality than the iPhone app. I’m able to search, a feature iPhone users have only had through their web version up until now.
• YouTube. Another Google usability triumph. Although it doesn’t always seem to be as up-to-date as the web version and clicking on browser web links don’t open the app automatically, it does have one killer feature: it’s the only app I have that (without hacking) streams video over the 3G network. Really useful.
• Google Maps. Simply amazing. This app takes advantage of the inbuilt GPS receiver in the phone. With this I’m never lost, I can always find directions to a destination from my location to within a few metres. Coupled with Google Latitude, it’s a great tool for keeping up with people across London. I can also access Google Street View from my phone, I can’t count the number of times this has been really useful.
• WirelessIRC. Despite the name red-herring, I actually use this to access Twitter. Unlike most other Twitter apps, it runs happily in the background. Whenever I want to update myself on other’s activities I can immediately view, rather than take the time to launch an app > connect to the network > download tweets etc etc. I can easily copy and paste text to re-tweet (RT) and using Nokia’s inbuilt functionality, I can copy and paste posted URLs to my web browser. (NOTE: On the N95, the copy and paste functions are found under the key that looks like a pencil on the bottom left below the screen).
• BBC iPlayer (1.5). Although newer versions exist, they seem to have been blocked from working on the N95. Don’t despair, you can still download the app from sources across the web. BBC iPlayer is a fantastic boost to the multimedia capabilities of this phone. As long as you’re not worried about the jump between the listings app and the in-built RealPlayer to stream programmes, you’re never going to miss a programme again. Shame it only works on WiFi (unless hacked) and doesn’t support downloads.
• Opera Mini. A web browsing experience comparable with a PC. I use this mainly to access Google Reader. The Mini browser comes with the ability to create ‘bookmarklets’, something that when mixed with a little Javascript, allows me to post interesting links to Delicious. All of this functionality is a life-saver on long train rides (or even the cramped commute to work).
• Web development apps such as SIC! FTP and s60HTMLed. This combination means I can effectively edit web pages from anywhere. s60HTMLed is a great application but takes some setting up. You need to download Python for S60, the ‘appuifw2′ extension and in my case I had to Symbian Sign the web editor.
• Shozu. A multipurpose photo up-loader that allows me to tag and describe pictures that I upload to Flickr.
• Snaptweet. A service that scans my Flickr account and adds pictures with the ‘snaptweet’ tag to my Twitter stream.
• GooSync. Synchronise your inbuilt calendar with Google Calendar. Simple and effective.
• Last but not least, the other inbuilt features like the WebKit browser (yes, the iPhone isn’t the only one that comes with this); 5Mpixel camera; and accelerometer for quick transition between landscape and portrait display. (NOTE: to set the display, go to Menu > Tools > Setting > General > Personalisation > Display > Rotate screen ‘Automatic’).

My advice for N95 users is to every-so-often, backup everything and look for system updates. I think an amount of this functionality will not work, or would be more buggy with older software. Where lots of phone manufacturers forget about updates only months after release, Nokia have been consistent in their support so you may as well take advantage of this goodwill. The phone isn’t perfect and there’s lots of other software I haven’t mentioned, but I thought I should acknowledge this phone’s 15 months service to me before I upgrade.

Apart from the BBC internet blog and backstage etc. @media 2008 had the fortune of hearing a whistle-stop tour of the redevelopment of the BBC homepage. This site has haunted many web designers since it’s launch with comments from colleagues of “Why can’t we do… {insert name of feature here}… like the BBC homepage?”. It became a shining example of what can be achieved.

Tom Cartwright and Claire Roberts presented their short piece on the development of a site that: took them three months to build; had to cater for 6 million users per month; couldn’t contain loops in the code; couldn’t process XML; had to be accessible; where 5% of users (that’s 300,000) didn’t use Javascript. This is web development at the sharp end.

A point of interest is that they managed to get 60 image requests down to just 3 using sprites. This had the affect of reducing the number of HTTP requests, a big saving on a highly trafficked site.

The size of this project is reflected in the fact that the development team recognised a need to drop JQuery as a Javascript framework and develop their own. Tom described Glow (www.bbc.co.uk/glow), a new framework that supports Safari 1.3 (apparently unlike JQuery). We were told that Glow would be available as open source software towards the end of the year, but judging by the password it looks like this still hasn’t been finalised. They also mentioned that their next project will look towards a pan-BBC identity system for users. The idea is that they’d have implicit and explicit personalisation and that, once logged into one BBC site, your credentials would follow as you traverse the sites. In support of this the BBC joined the OpenID federation, looking at becoming a consumer.

For insights into the future of the BBC homepage see www.bbc.co.uk/home/beta/. They recommended Steve Souders’ High Performance Web Sites (he really knows optimisation).

Eureka! (Sort of). This week the fluoride story broke in the UK, something that could change the way I live for a long time to come. I couldn’t help but see the similarities between these two issues and this prompted the following post (two birds, one stone) – stay with me here…

Contentious

1. Proposal One. Add a tiny meta tag into your code in order to tell IE what iteration of the rendering engine you’d like to use. This is not because you’re doing anything wrong, in fact if you’re reading about it you’re more likely to be a standards aware web developer. It’s catering for the nonconformist (not conforming to accepted rules or standards*). Microsoft has to deal with a lot of fault calls when it updates its browser and would like a cheaper easier option that covers everyone and reduces the size of its headache.
2. Proposal Two. Let the government add a tiny amount of fluoride into your main water supply to help prevent tooth decay. This is not because you’re doing anything wrong, in fact if you’re reading about it you’re more likely to be an individual who’s aware of their dental health. It’s catering for the unaware, those who glug fizzy drinks and forget to brush. British health services have to deal with a lot of the after effects from years of tooth decay. They would like a cheaper and easier option that covers everyone and reduces the size of their headache.

Whether or not you agree with either of these proposals seems less bound with the facts of the situation (or their portrayal) and more reliant on your philosophy of life. Should the conscientious, the responsible make sacrifices to cater for the rest? Should I make small sacrifices with my (as I believe) health or code, to allow for those that can’t look after their own?

The arguments in favour of both are quite compelling. Put simply, implementing these fundamental changes means that in one fell swoop the majority of problems disappear. Web developers no longer need to worry so much about their sites ‘breaking’ in future versions of IE, similarly parents no longer need to worry whether their children are brushing their teeth properly. We’re all now protected due to this change in our environment. Also, it keeps the managers happy. Numerous posts hint to problems (again, see Zeldman’s article) faced by the IE team when trying to justify their apparent divergence from the development path of previous versions of the product (all thanks to ‘web standards’). Given Microsoft’s position in the market and the flak the company seems to get when it releases updates, the ‘standards’ argument is supposedly wearing thin with the management. Similarly, the NHS has limited resources and not enough dentists.

Fluoridation is a small addition to the structure of your daily life, if the experts are to be believed it won’t lead to conditions that compromise your health (although some disagree). In fact, if you compare the cost of fluoridation to the bill incurred correcting dental decay, it’ll be better for society in the long term (I guess). It will get us out of the current situation where dentists and GPs waste time and money trying to fix what should have been prevented in the first place. It will free up resources to improve public health in other areas.

Meta tags really are tiny pieces of code that there’s no point getting upset over. The burden incurred implementing this new tag in future sites should be minimal. If we can help Microsoft produce a better browser by relenting to their proposal, then surely that’ll produce a better web for all.

So where’s the problem?

I’m happy that plans are being made and people less fortunate than myself (I currently have no fillings and the time/patience to code properly) are on the verge of being helped. But, when these large organisations make such plans seemingly in my best interests, they sometimes (arrogantly) miss the point in the implementation. Standing behind bloggers such as Jeremy Keith and hopefully adding to the calls, I think both of these proposals need to be opt-in.

In the case of fluoride, it can be provided in salt as has happened in other countries; with the meta tag, let people find out about it only when their sites break (at least that way they’ll understand there’s a problem). Doing it any other way would cheapen life for all (which is funny because these descisions will have come from the economics originally). At least now dentists and Microsoft technical support will have an easy answer, but let people explicitly agree to be included.

Another option is to medicate the Microsoft offices water supply – instead of fluoride put aspirin in their water, that’ll cure their collective headache in the mean time.   ;)

* However, I don’t want to get sucked into a debate about how to define what ‘rules and standards’ means. Molly’s already doing a good job.

• A general collection of points made about the latest Apple gadget:http://adactio.com/journal/1233
• Good question about the usability of the multi-touch screen:http://www.456bereastreet.com/archive/200701/apple_iphone_is_cool_but_where_is_my_keypad/
• iPhone applications:http://www.43folders.com/2007/01/10/iphone-applications/
• Cameron Moll on why it’s not revolutionary:http://cameronmoll.com/archives/2007/01/why_iphone_wont_revolutionize/
• Resolution Dependent layouts:http://www.simplebits.com/notebook/2007/01/10/iphone.html
• The death of the mobile web? Only if others catch on:http://mezzoblue.com/archives/2007/01/09/imobile/