Understanding And Exploiting Web 2.0: Accessibility, Usability & Interoperability

1. http://www.ukoln.ac.uk/web-focus/events/workshops/stimulate-2006/talk-accessibility/http://www.ukoln.ac.uk/web-focus/events/workshops/stimulate-2006/talk-accessibility/ Understanding And Exploiting Web 2.0: Accessibility, Usability & Interoperability • About This Talk • This talk covers • Importance of accessible and usable of Web resources • Let’s not forget interoperability • A holistic approach to embracing these challenges Brian Kelly UKOLN University of Bath Bath Email B.Kelly@ukoln.ac.uk Resources bookmarked using ‘stimulate-2006-benchmark' tag UKOLN is supported by: This work is licensed under a Attribution-NonCommercial-ShareAlike 2.0 licence (but note caveat)

2. Contents • Web sites might not work! • Spotting problems • Automated tools • Manual testing • Quality Assurance (QA) • Accessibility and usability • Interoperability • A holistic approach

3. Problems • What problems might Web site users encounter when making use of a Web site?

4. Background Tools • Problems • You've identified some problem areas for users of Web sites: • Functionality – it doesn't work • Usability – it's difficult for people to use • Accessibility – it's difficult for people with disabilities to use • Solutions • Now let's look at some solutions to these problems • Tools that can help • Processes that can help • A Quality Assurance (QA) framework

5. Useful tools: • W3C's HTML validator: can spot functionality & accessibility problems • W3C's CSS validator • RSS validator (if you have an RSS newsfeed) • … Tools: Functionality (1) Tools • HTML, CSS, … Validation: • Web page doesn't look right in my browser • First thing: validate page!

6. Tools: Functionality (2) Tools • Link Checking: • Clear need to ensure links work • Many tools available • Validated part of my Web area • Findings: • 12,514 Web pages! • Only checked internal links • Large no. of errors – but vast majority false errors • Some errors found in areas provided by others • Others my fault – and mostly fixed • Issues: • We can't always rely on tools • Why weren't errors spotted previously? • What to do with large no. of errors?

7. Tools: Missing Functionality Tools • A Web site may not be usable because: • The features it provides can't easily be used • It omits features which are needed in order to be used • Example: • A search facility • Issues • Does your Web site have a search facility • How well does it work? • Note that free third party search facilities may be useful if you have limited resources

8. http://www.wave.webaim.org/ http://webxact.watchfire.com/ The WAVE is one other alternative Tools: Accessibility Tools • Many accessibility testing tools are available WebXact (formally known as Bobby) is probably the best known • NOTES • Automated tools can't detect all (many?) accessibility problems • Findings from tools can be inconsistent • Underlying WAI guidelines are open to interpretation

9. Tools: Usability Of The Tools (1) Tools http://www.ukoln.ac.uk/qa-focus/documents/briefings/,rvalidate • There can be usability barriers to regular use of such testing tools: • They require going to Web page, copying and pasting URL, etc • Sometimes only single pages can be tested • Simple solution: • On UKOLN Web site can append ,tools to any URL to run various tools on page • Simple to implement – see QA Focus briefing no. 59 Tools: ,validate ,rvalidate ,checklink ,rchecklink ,cssvalidate …

10. Checky allows: • Validation • Link checking • Access to misc tools These tools are very useful and their use by all is strongly encouraged Tools: Usability Of The Tools (2) Tools • 'Bookmarklets' and Firefox extensions can make use of tools much easier and provide additional features • Web Developer allows: • Features disabled • Additional information to be provided • Tools to be used

11. Tools Aren’t Enough! • Warning: • Tools may lead you to think you have an accessible Web site when this isn't the case! Manual Checking <img src="foo" ..> - no ALT tag: detectable by tools <img src="foo" alt="add alt text here" …> - an inappropriate ALT tag. Needs testing by humans. • What do we need: • An awareness of the strengths and weaknesses of automated testing • An awareness of approaches to use of manual testing • A usable framework for a testing regime

12. Role of Automated Tools • Automated Checking Tools: • Spotting problems which can be found by software • Detecting (then fixing) such errors to allow (scarce) human effort to focus on problems with tools can't detect: • Don't tell your testers to check that links work; link checkers are better for this* • Dangers of Automated Checking Tools: • I use such tools; I don't bother with manual checking because: • I'm a techie and we like software solutions to problems • Checkers are difficult to find; may be expensive; … • It's time-consuming • .. Manual Checking * Is this always true?

13. Approaches To Manual Checking 1 • Hire a profession body: • Organisations such as RNIB and many others can be hired for usability & accessibility checking: • Have a knowledge of the disable community; their needs; the tools they use; etc. • May use people with disabilities to provide realistic feedback and comments • Report can inform organisation and recommendations applied elsewhere • May be expensive • Not always applicable Manual Checking The Logo Issue Should you add an accessibility logo to your Web site? What are the pros and cons?

14. Approaches To Manual Checking 2 • In-house checking: • Always needed, so let's get in right! • Simple approach: • Email colleagues for comments. What happens? What re the limitations of this approach? • Better approach: • What do you hope to gain? Document this! • Provide structured tasks • Seek a variety of testers, representative of user community • Testing by people with disabilities is desirable but may be difficult • If not possible, provide similar environment for testers (or yourself) e.g. images off, CSS off; … Manual Checking

15. Quality Assurance • The tools aren't sufficient by themselves. Also need: • Documented policies: so we know what we're expected to check for • Systematic procedures: for checking that we are implementing our policies • Enhancements made to workflow processes, and not just fixing individual problems • In addition it can be useful to have: • Audit trails: to spot trends and identify possible problems in workflow processes (e.g. new tools deployed, new staff involved, …) • Sharing experiences, so that we and others can learn Quality Assurance

16. QA Examples (1) • Example of QA policies & procedures for file formats Quality Assurance Policy for QA Focus Web site Policy: The Web site will use XHTML 1.0 and CSS 2.0 standards Architecture:The Web site will be based on XHTML templates and use of SSIs Monitoring: New and updated pages validated using ,validate and ,cssvalidate. Every month ,rvalidate will be used & record kept Exceptions: HTML derived automatically (e.g. Save As HTML in PowerPoint) need not comply with standards. The files will be stored in a standard directory to enable such files to be excluded from checks.

17. QA Examples (2) • Example of QA policies & procedures for links Quality Assurance Policy for QA Focus Web site Policy: QA Focus will seek to ensure that links are functional. Monitoring: New and updated pages checked using ,checklink and ,rchecklink. Every month ,rchecklink will be used & record kept and quarterly Xenu will be used. Exceptions: Links in "publications" (e.g. papers which are formally published) which become broken may not be fixed. If there are large numbers of broken links which would be time-consuming to fix we may not fix them. We make no commitment to fix broken links once the QA Focus funding finishes.

18. Conclusions – Spotting Problems • To conclude: • Tools can help in identifying problems areas • However tools may be flawed, inconsistent and difficult to use • Tools aren’t enough in themselves – manual checking is also need • Systematic application of automated and human checking as part of a QA framework is desirable

19. E Accessibility And Usability • What is accessibility? • What is usability? • What are the differences between usability and accessibility? Accessibility & usability

20. The Debate • No clear consensus: “Increasingly, the issue of the relationship between accessibility and usability in web design is being discussed; at conferences, on mailing lists and websites, and in meetings and discussions between those who work in these fields. However, despite a growing interest in the issue, much of the discussion has suffered from a distinct lack of clarity and depth. This leaves our understanding of the relationship unclear, and practitioners and advocates of either approach unsure about how this could or should impact on our work. ” Accessibility & usability What is the relationship between usability and accessibility, and what should it be? Dex Alexander

21. The Dangers • There are dangers will too much focus on accessibility: • We use accessibility checking tools • We text with disabled users • We fix the problems which are found • But: • The site may not be usable! • Note that: • UK legislation covers usability and accessibility issues (this may not be the case elsewhere) Accessibility & usability There us a clear need to consider both usability and accessibility issues. Institutional policies should address both areas

22. Addressing Usability • Much literature available: • Jacob Neilson • QA Focus briefing documents on: • “Usability and the Web” (no. 86) • “Introduction to Cognitive Walkthrough” (no. 87) • “Task Analysis and Usability”, (no. 88) • “Heuristic Evaluation”, (no. 89) • “Developing User Personas”, (no. 90) Accessibility & usability Unfortunately no time to go into usability issues in any depth.

23. Background • Where Are We? • So far we have: • Identified the potential and limitations of tools • Recognised the importance of user testing to ensure usable & accessible Web site • Is this sufficient? What about: • Supporting new devices e.g. mobile devices in an environment with pervasive WiFi networks? • Access by robots, etc. (e.g. search engines, transformation engines, …) • Repurposing resources • Preserving digital resources • In addition to usability and accessibility we should also be addressing interoperability Interoperability

24. Example of a Web page viewed on a Netgem i-Player digital TV • Note: • Text size increased as TVs viewed from further away • No mouse – so tabbing needed • Example of a Web site viewed on a Palm PDA • Note: • Images switched off (small memory) • No mouse Supporting New Devices • Greater use is being made of devices other than PCs: • PDAs  Mobile phones • Digital TVs  …

25. Repurposing Resources • Lessons from the past: • We use a great technology (e.g. BBC micro, PC, …) and develop materials for it • Something better comes along – and our resources are trapped in an obsolete technology • We develop a great resource – but others only want to make use of part of the resources • What is needed? • Device and application independence • Ability to: • Make use of resources 'chunks' • Integrate chunks from disparate resources • Find relevant chunks (e.g. relevant content, appropriate technologies, appropriate rights permissions, …) Interoperability

26. http://www.archive.org/ Preserving Resources • Will our Web sites be able to be preserved: • To enrich future generations • To ensure support for FoI, etc. • Internet Archive's Wayback Machine: • Can show what Web site looked like previously • Can help spot problems: • Can images be captured? • Are technologies being used which may cause problems for preservation? • Are obsolete file formats used? • …

27. Addressing Interoperability • How can we address such interoperability challenges? • Use of open standards can help to: • Provide application & device independence • Future-proof resources and services • Use of open standards can help to minimise migration costs • But need to consider such issues from the start • However there may be conflicts with other requirements: • Proprietary formats (e.g. Flash, PDF) may be easy to use and satisfy user needs • There may be cost and resource implications • Open standards may fail to take off • The future may not be as expected! Interoperability

28. Do I want this? (it's an advert for venue) <body onLoad="showPopup()"> <div id="page"> <object classid="clsid:D27C…" ..> <param name="quality" value="high"> <param name="bgcolor" value="#FFFFFF"> <embed src="loader.swf"> <p><a id="subscribe" href="javascript:showDialog();">Subscribe to newsletter</a> <a id="subscribe"">Latest news</a></p></div> </body> No useful text for Google to index Case Study http://www.weetwood.co.uk/weetwood.html • Weetwood Hall: • Web site for good conference venue • Web site is attractive and easy to use • But: • Requires Flash plugin • Can't bookmark pages • Not HTML text to index • One Flash file – so individual resources can't be reused • Text not resizable

29. Need For Clean URLs http://www.rnib.org.uk/xpedio/groups/public/documents/code/InternetHome.hcsp • What are the problems with these URLs? • Usability Problems: • Difficult to type • May be difficult to find (can Google index it?) • Accessibility Problems: • Difficult to remember; • Difficult to use if have problems with keyboard • Interoperability Problems: • Dependent on specific CMS • Difficult to annotate http://www.mla.gov.uk/webdav/harmonise?Page/@id=82&Section%5B @stateId_eq_left_hand_root%5D/@id=4289&Document/@id=24343 See Guidelines For URI Naming Policies, B. Kelly, Ariadne 31

30. Conclusions • To conclude: • We need to consider interoperability issues • Such issues can help: • Service providers • Users of new devices • Users of assistive technologies • … • But: • There may be cost implications • Planning will be important • End users may seem happy with an non-interoperable site

31. TraditionalApproach W3C WAI and WCAG • W3C (World Wide Web Consortium): • Body responsible for coordinating development of Web standards • WAI (Web Accessibility Initiative): • W3C group responsible for developing guidelines which will ensure Web resources are widely accessible • WCAG (Web Content Accessibility Guidelines): • One of three sets of WAI guidelines. WCAG provides advice of accessibility on Web content (e.g. HTML pages) • Other two WAI guidelines cover accessible user agents (UAAG) and accessible authoring tools (ATAG) WAI Approach

32. Which reflects your views most closely? Interpretation of WAI WCAG • How do you interpret WAI WCAG (must use ALT tags for images; HTML must be valid; must use style sheets for presentation; …): • Mandatory, with following characteristics: • Clearly defined rules Objective • Checking mostly objective • Penalties for non-compliance • Similar to checking that HTML complies with the standard • Advisory, with following characteristics: • Useful guidelines, to be interpreted in context • It's about providing useful, usable resources • It's contextual • Checking mostly subjective • It's similar to checking that a Web site is well-designed WAI Approach BK

33. The WAI Model • The WAI model for Web accessibility is based on three components: • Content • Authoring Tools • Browsers • Get all three right and you'll have universal accessibility • But: • We have no control over browsers & authoring tools • The browsers and authoring tools aren't great • The content guidelines are flawed • Is universal accessibility really possible? WAI Approach

34. Limitations of the WAI Model • WAI approach has shortcomings: • WAI model relies on conformant Web sites, conformant authoring tools, conformant user agents • …and conformant users! • WCAG guidelines have flaws ("must use W3C formats; must use latest versions; …") • Has a Web-only view of the world: • What about other IT solutions? • What about blended (real world) solutions? • Has a belief in a single universal solution: • But isn't accessibility a very complex issue • Is it reasonable to expect an ideal solution to be developed at the first attempt? WAI Approach

35. Diversity - Content Alternatives • WAI guidelines focus on informational Web sites: • Here’s the train timetable – I want the information and I want it now • This is reasonable and desirable • But is this approach always relevant to e-learning: • Here’s something – you must interpret it (and being wrong can be part of the learning process) • Or culture: • Here’s the Mona Lisa – you decide why she is smiling

36. Argument: • We need: firstly (A) food and then (B) shelter. Afterwards we want (C) soft furnishing • Can apply “Jordan’s Pleasure Principle” to informational content: • We want information, but we also want it provided in a pleasurable way C B A Jordan’s Pleasure Principle Alternatives • Even for informational resources, we may not always choose to make information readily accessible • “Super Calli Go Ballistic, Celtic Are Atrocious!” • Breaks draft WCAG 2.0 guidelines on “Content must be understandable” • But brings a smile to many (but not all)

37. Articulating the Approach • The "Tangram Metaphor" developed to avoid checklist / automated approach: • W3C model has limitations • Jigsaw model implies single solution • Tangram model seeks to avoid such problems Tangram Model • This approach: • Encourages developers to think about a diversity of solutions • Focus on 'pleasure' it provides to user • Outlined at W4A 2006, May 2006

38. Tangram Model • Model allows us to: • Focuses on end solution rather than individual components • Provided solutions tailored for end user • Doesn't limit scope (can you do better than WAI AAA?) • Make use of automated checking – but ensures emphasis is on user satisfaction Tangram Model • Guidelines/standards for/from: • WAI • Usability • Real world • Organisational • Dyslexic • Learning difficulties • Legal • Management (resources, …) • Interoperability • Accessibility metadata • …

39. Tangram Model & Testability • "WCAG 2.0 success criteria are written as testable statements …" (nb. automated & human testing ) • Issues: • What about WCAG principles that don't have defined success criteria (e.g. "content must be understandable")? • What about 'baselines' – context only known locally • What about differing models or / definitions of 'accessibility'? • Note vendors of accessibility testing services will market WCAG tools e.g. see posting on BSI PAS 78 • Tangram model can be used within WCAG • Distinguish between testable (ALT tags) and subjective (content understandable) • Supports baselines Tangram Model Testable Baseline 1

40. Blended Accessibility • Background • Talk on best practices for public library Web sites • Example given of Flash game: • Aimed at children • Simple to develop • They love it • Question: What about accessibility? • Response: (defensive) Err, we'll have to remove it. Tangram Model Blended solution What's the purpose of the game? To amuse kids, while parents are browsing for books. Would building blocks provide an equivalent alternative? Note this treats kids as users with different learning styles, not as 'something for the blind, …

41. Accessibility 2.0 • Can the term “Accessibility 2.0” help in articulating a blended approach (similar to Web 2.0, e-Learning 2.0, Library 2.0, …)? • Characteristics: • User-focus • Diversity • Blended • Widening participation • Avoidance of dogma • … Accessibility 2.0

42. Tangram Model & Stakeholders • Challenges, legal issues, cultural issues, etc. from various stakeholder communities: • Target user community • Other user communities • Web developer • Content provider • Staff developers • Institution • Funder • Sector • … • The tangram model can be extended to embrace the challenges of working with & dealing with the diversity of priorities, perceptions and cultures of your stakeholder communities Holistic Approach

43. Accessibility 2.0: A Holistic Approach • The holistic approach we have developed: • Focuses on the needs of the user • Acknowledges the value of guidelines: • WAI WCAG Guidelines  Jakob Neilson's guidelines • … • But recognises that: • These are guidelines and not universal standards • Such guidelines can limit what you do • Also recognises that: • Usability, accessibility & interoperability are important • The will be constraints on what you can do • What you should do will be influenced by the area you're involved in, the resources you have, the wider cultural context, … Holistic Approach

44. Accessibility 2.0 & Web 2.0 • The are tensions between aspects of Web 2.0 and accessibility guidelines: • AJAX & JavaScript • Podcasting, etc. If Podcasts are valuable for many (including visually-impaired users) but can’t be heard by deaf users, should be provide them? If AJAX provides better usability and helps users with motor skills difficulties, but may not work with some screen readers, should we use it? • Try to support: • All users • Target users • Ask your users • Be sensible, not dogmatic!

45. Challenges For You • The holistic approach has been developed based on experiences in supporting the UK Higher and Further Education and cultural heritage sectors • There are still issues to be addressed: • How to apply the approach in a range of different contexts • What is a reasonable approach? • How to I embed this approach within my organisation? • …

46. Questions? What Next? • Any questions Note resources cited in the talk are bookmarked in del.icio.us using tag '‘stimulate-2006"