Speakers

• Richard Schwerdtfeger (IBM)
• Marian Oosting (anderslezen.nl)
• Chris Heilmann (Yahoo!)
• Miguel González-Sancho (European Commission)
• Michael Cooper (W3C WAI)
• Dominique Hazaël-Massieux (W3C Mobile Web Initiative)
• Dave Wilton (Legal & General)

Richard Schwerdtfeger works for IBM and is a member of the W3C WAI and the HTML working group, among others. I assume he had been invited because the organizers only knew him for having developed IBM Home Page Reader back in the 1990ies. But his current work involves the W3C working drafts for Accessible Rich Internet Applications (ARIA) and other core technologies that his team developed in cooperation with vendors of Assistive Technologies (AT, e.g. screen readers) and the Mozilla Foundation.

There’s a paradigm shift in the usability and accessibility of Web 2.0 applications. ARIA adds meaning, importance, relationships, fills the gaps in (X)HTML, and increases usability for all users through familiar navigation models from desktop applications.

From Marian Oosting (anderslezen.nl) I learned about DAISY. It’s a library standard mostly used for talking books for the blind. Based on MP3 and the W3C XML standard SMIL, it combines strong compression with superior navigational features. Quite intriguing to use that format for audio books, and since 2006 it’s becoming available and more attractive for non-disabled users. For example, talking books are quite popular with elderly people who constitute about 60-80% of public library users.

In his presentation Chris Heilmann (Yahoo!) emphasized the need to ask people with impairments because they use assistive technologies in other ways than a non-disabled developer might foresee. Don’t assume, integrate their advice!

Miguel González-Sancho (European Commission, Information Society Directorate General) presented the European programs for e-Accessibility, e-Aging, and e-Inclusion. ICT is becoming essential for socio-economic participation, yet 40% of the European population is left behind. Functional limitations and disabilities increase due to aging. About 20% or 100 million of the European population is concerned. Thus accessibility is gaining relevance and becomes a social imperative.

In “Web Accessibility in the Future” Michael Cooper (W3C WAI) was rather giving the big picture and avoided to announce a release date for WCAG 2.0. Although the updated version will definitely play an important role in the future of accessibility, so does the development of a common Accessibility API or authoring interfaces that generate accessible content (ATAG). Think of user contributed content where the authors are usually unaware of accessibility requirements. Moreover, professionalization of accessible design, programming, and manual and semi-automated evaluation will gain importance. We must keep an open eye on developing technologies (MathML?, Second Life?), advocate accessibility in early stages, and keep accessibility awareness in legislation and society.

Dominique Hazaël-Massieux (W3C Mobile Web Initiative) talked about the mobile web, of course. There are more mobile phones than computers, they are cheap, and about 80% of the world population has mobile network coverage. Mobile access is everywhere, will become ubiquitous. There are some limitations like the tiny screen, the lack of a proper keyboard, diversity is large and access slow. In fact mobile and impaired users have so many challenges in common that Dominique estimates an accessible website already meets half the requirements of the Mobile Web Best Practices. Bad news for militant accessibility advocates who keep emphasizing the differences between accessibility, universal access and device independence.

Dave Wilton from the large British financial services supplier Legal & General gave some real world examples why it literally pays to become accessible:

There are nine million people with disabilities in the UK. If 1% just bought a £300 policy, his company will make £27 million: “The cost of making the site accessible pales into insignificance.” If people can’t buy from Legal & General, they will go to their competitors. In surveys, helpdesk and logfile analyses they found 10% of their visitors don’t make it past the home page. That’s equivalent to slamming the door into the faces of 20,000 visitors each month. 30% never open a PDF file. Besides, every third Briton is older than 50, and as we have heard before, the incidence of disabilities increase with age. There are not only people with cognitive impairments, but also 3 million people who speak English as a second language, 1.5 million people lacking basic language skills, and 5.2 million adults who have sub-GCSE level English.

Next time somebody tells you “disabled people are not our target group” show ‘em these results:

• Online traffic surged with a 50% increase in natural search engine listings.
• The number of visitors receiving quotes increased by 100% within three months.
• The new content management system cut site maintenance costs by 66% with an annual saving of £200k.
• Without changing products or prices, conversion rates improved substantially, ranging between 26% and 300% increase with an average of 200% (something Jakob Nielsen seconds).
• The entire project delivered 100% return-on-investment (ROI) within just 12 months.
• Customer satisfaction was improved (not one accessibility complaint!)
• It was great PR!

1. The geek meeting in Frankfurt known as Webmontag will be held for the seventh time at the Brotfabrik. So far there are short lectures about a social photosharing network, semantic webworking P2P transactions, and a wireless match maker, but you are free to present your own work and research.

   After all, this is an informal meeting organized through a Wiki where you can participate and share your knowledge. Not necessarily technical knowledge, also designers, project managers, and information architects have been spotted — I wish they would speak up more often. Admission is free, so if you are in the Frankfurt area you have no excuse not to attend.

2. The second conference almost slipped my radar: it’s the First European e-Accessibility Forum in Paris, organized by the French accessibility entity BrailleNet and EDeAN (European Design for All e-Accessibility Network). While I can’t say much about BrailleNet, EDeAN is the official accessibility outreach organization of the EU. So far they have kept a low profile doing politics and research in the background, but it’s about time more people learn about their existence.

   For only € 90 you get a day packed with high quality accessibility information from industry leaders: Microsoft’s French Technical Director speaks about accessibility in the Web 2.0 context. IBMs Rich Schwerdtfeger, member of both the WAI Protocols and Formats Working Group and the HTML Working Group, is next with accessible rich internet applications (ARIA). Among other speakers, there will be Christian Heilmann (Yahoo!), Michael Cooper (W3C / WAI), Steven Faulkner (developer of the Web Accessibility Toolbar), Dave Wilton (Legal & General, the insurance company that got best practice credits in the UK’s PAS 78), Julie Howell (former accessibility champion of the Royal National Institute of the Blind), Dominique Hazaël-Massieux (W3C), and Miguel González-Sancho (European Commission). They will talk about accessibility and the Mobile Web, the UbiWeb, harmonization of European accessibility and a European label, or present a couple of case studies from print, banking, and job websites.

   You better be fast for that one, registration is only open until Saturday, January 20th.

3. Last but not least the website for the @media conference has been updated yesterday, so you can register for the event in London, June 7th and 8th, or earlier in Asia and the US. Last year’s event was fun and inspirational, so start fast-talking your employer now!

In this post:

• Dan Cederholm: Bulletproof web design
• Robin Christopherson: Beyond a code audit
• Cameron Moll: Mobile web design
• Nate Koechley: Yahoo! vs. Yahoo! vs. Yahoo!
• Tantek Çelik: Microformats: evolving the web
• “Hot topics” panel
• More presentations

The evening:before featured another get-together in a fancy work:after club, which can be summed up like this: Sweden won against Paraguay, and it was hard to talk to others because some notorious DJ wouldn’t turn down the volume. He desperately tried to get somebody on the dance floor switching from house music to r&b pop, but didn’t realize that was not what the audience wanted.

Bulletproof web design

If there was an award for best presentation, Dan Cederholm would get my vote! His slides were so well-designed, so clean, and the special effects (not seen in the PDF version) contributed to clarify the scope.

It was like Jeremy Keith’s presentation the day before, where you knew all the things he was talking about, still something made “click” and shifted your perception — and if it’s only that you think “that’s what I always needed to show to my designers!”

Scene from the early computer game Dig Dug (Atari 1983), where you pump up monsters until they explode

His example for thinking ahead showed a photo of a new warehouse in San Francisco, where the windows had been inserted to be future proof, but cemented over for the current use. So think ahead, because content amount and text size may vary, content changes and needs to be maintained, and because the environment can change. Take something off, like images, CSS, or JavaScript, and make sure the website still functions.

“The journey begins by letting go of control, and becoming flexible.”

John Allsopp, “A Dao of Web Design”

A lot of his examples worked by setting a 50% value for the horizontal or vertical background-position in combination with overlapping images, and he introduced the term “Dig Dug Text Test” as a metaphor for pumping up text and assuring the design is still not destroyed. Reminder to self: add more references to early 1980’s games in presentations, they are so cool!

Beyond a code audit

Robin Christopherson’s bad karma was that he relied on the unreliable wireless network in the conference center, therefore a few examples from the web refused to work.

But by struggling with the technical constraints he set a real-world example for the attending web developers. Robin is blind, and he did not notice the Windows XP bubbles popping up once in a while trying to alert him that the network was unavailable. He was unable to login on the QE2CC screen, because it was inaccessible and refreshed too often. Also most people I spoke with were deeply impressed by the incredible speed his screen reader was set to.

He had also prepared a couple of educational films about challenges on the web for people beyond the visually impaired, like a woman with learning disabilities who didn’t understand the word “disclaimer,” or a quadriplegic with a mouthstick and a voice recognition system, which was useless when the alt text in images or Flash applications did not match the displayed text. I know what a tremendous amount of work the production of such little films is, and I’m looking forward to access them on Robin’s site. Also check his speaker’s notes.

Mobile web design

Cameron Moll mentioned a few times that he had held this presentation a year ago. Therefore it was very professional, very slick, but a little unemotional and in my opinion not quite up to date.

Okay, there are more mobile phones than computers, more mobiles than landline connections, but he didn’t stress the incredible impact the wide adoption of Opera supporting JavaScript on cellphones will have. That’s finally a common platform for web applications using Ajax, as opposed to hundreds of different implementations of Java which are almost impossible to test. That’s a most remarkable development with the potential of revolutionizing mobile applications — Cameron hardly mentioned it, although this became public in November 2005.

Of course WML is dead, long live XHTML MP! You should serve content from a .mobi domain and concentrate on the contextually relevant information: People might check their eBay watchlist on their cellphone, but they don’t upload items to sell, so ignore features like that when developing for mobile devices.

Also my question about Vodafone and other carriers inserting invalid code in the pages they serve through their proxy might not have been clear enough, because Cameron replied it’s up to the carriers and the browsers how to interpret pages, while developers can control the code.

Unfortunately that’s untrue when carriers compress images more and insert JavaScript to get the original images with higher resolutions with a key combination. One script is inserted with the deprecated language attribute in the header, while the other comes after the closing </html> tag, thus rendering your valid XHTML strict code to tag soup. The problem not only manifests on mobile browsing devices, but also when you surf with a regular notebook using your mobile access. Therefore a @media handheld CSS, browser sniffing, or serving the MIME type depending on the HTTP accept header are all doomed. And there’s no way to prevent the carriers from doing such evil.

Yahoo! vs. Yahoo! vs. Yahoo!

I went to this presentation because Nate Koechley recently published his smart concept paper about graded browser support, which we immediately adopted. What I didn’t expect was a most impressive roller coaster trip through browser performance!

Yahoo! has a beta version out for their new portal, also Yahoo! Photos and Yahoo! Mail is under development. All of them make more or less heavy use of DHTML and Ajax. Yahoo’s goals were increasing performance by 300%, adding interactivity (vulgo: drag & drop), and supporting web standards.

For a fast response they used techniques like CSS sprites, or memory management. In Nate’s words browsers are still “a pain in the ass,” and “the web is the most hostile software engineering environment imaginable.” DHTML leaks memory like a sieve, so for each constructor use a destructor. Instead of adding events to thousands of email objects Yahoo! used the existing document.onmousemove event and checked if the mouse was over an object or white space, then passed the event to that object or drew a rectangular choice box. Key concepts are conservation, destruction, and recycling iFrames (about:blank). Use Drip as a tool for measuring memory leaks, test extreme object counts, test long interactions, and test extensive navigation.

Also their developers prefer JSON over XML because parsing XML degrades performance greater than linear as XML size increases.

They have identified HTTP requests as a main performance killer. Browsers still only process two or four HTTP requests at a time, especially start pages are not cached as effectively as they imagined, and parsing JavaScript freezes the browser. Therefore they rather serve a single large file with CSS in the header, and JavaScript as close to the </body> tag as possible.

Regarding browsers it is faster to develop for standards, than patch. Browser support must not be binary, and it does not mean “the same.”

Expecting two users using different browser software to have an identical experience fails to embrace or acknowledge the heterogenous essence of the Web.

There are more IE5 browsers out there than IE 5.5, and IE7 “already moved the needle.”

With all the DHTML and Ajax I was concerned about accessibility, but in a sidenote I almost missed Nate mentioned the IBM contribution for DHTML accessibility. Wonderful!

Microformats: evolving the web

When microformats are even on the radar of Bill Gates, how could I ignore them? I had no clue before Tantek Çelik’s presentation @media 2006, and now I’m implementing them in this post. Microformats are virulent.

Basically you insert a few class names into your code, like

1. <p class="vcard">
2. <a class="url fn"
href="http://tantek.com"> Tantek Çelik</a>
3. </p>

There are microformats for contact cards, calendars, reviews, geo information, and many more. Even the Creative Commons license and the PICS label implemented in this page count as microformats. XFN and XOXO, too.

You can parse this page through a Technorati contacts feed service or use a tool like the Tails extension for Firefox, and voilà, there’s a vcard you could import into your address book (if there wasn’t this Thunderbird bug which prevents exactly this). With the hcalendar microformat you synchronize your calendar with event schedules on a website accordingly.

There are a few issues I ran into when I implemented hcards, and the documentation could have more examples, but they are on Tantek’s to-do list. Also sometimes it means extra, non-semantic markup, but as microformats increase semantic meaning, I assume it gets Tim Berners-Lee’s blessing. So go for it, microformats are definitely among the web’s next big things!

“Hot topics” panel

I had the pleasure to meet Molly Holzschlag earlier in a coffee break, and while I was sorry I couldn’t attend her session I18N, awakening the sleeping giant, I’m confident I didn’t miss much information as I am pretty familiar with her old articles in her regular column in WebTechniques and the current activity of the W3C I18N group, where she is a member.

Jens Grochtdreis reports in his blog about the passionate presentation she gave earlier, and although there is more technical experience and awareness in Europe with multilingual websites, rarely they pay respect to cultural differences, like the meaning of colors. Molly gives everything to educate on I18N and promote web standards, she is also a member of WaSP. I’m glad she seems to have found a way to get some help and support, as she is an outstanding, but sensitive person.

Anyway, she was part of the “hot topics” panel, where questions from the audience where considered by a group of experts: Molly, Jon Hicks, Jeremy Keith, Eric Meyer, and Tantek Çelik. They had a lot of fun and agreed CSS has become more mainstream in the last year, as you don’t have to defend CSS against table layout anymore. Well, reading the discussions in German forums and reviewing the code of other websites, there’s still a lot of educational work to be done. Also they talked about the accessibility of Ajax, and mashups as the next big thing, but you can read a decent transcript of the session in Stuart’s blog over at Muffinresearch.

Conclusions

If you have followed me this far, you can see @media was a big inspiration, it was a lot of fun, especially the after event on Saturday, and I can only recommend the conference! There are endless flickr pictures and quite a few blog entries on Technorati if you need further impressions. Um, and never mind the British food …

More presentations

Here are the presentations in the parallel track I couldn’t attend. Also there will be pod- and videocasts available soon.

• Dave Shea: Fine typography on the web
• Andy Budd: Bug hunting
• DOM Scripting: The Next Level
• Andy Clarke: The fine art of web design