Your SlideShare is downloading. ×

Web Accessibility

3,583

Published on

A brief overview of the fundamental elements for creating accessible websites. Presented by Robyn Hunt of AccEase Ltd, www.AccEase.com. Read her blog at www.lowvisionary.com

A brief overview of the fundamental elements for creating accessible websites. Presented by Robyn Hunt of AccEase Ltd, www.AccEase.com. Read her blog at www.lowvisionary.com

Published in: Business
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
3,583
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
54
Comments
0
Likes
3
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide
  • Web Accessibility “ The power of the web is in its universality. Access by everyone regardless of disability is an essential aspect.” Tim Berners-Lee W3C Director and inventor of the World Wide Web Robyn Hunt & Mike Osborne - August 2008
  • You have no control over how users access your website. The web is not print. This is one of the key differences between print and web and why taking a print design approach to websites doesn’t work. Different browsers Different technology PCs, Macs, Linux, mobile devices Different Assistive technologies Screen sizes Screen resolutions Mouse/keyboard/voice Colour depth Images on/off Stylesheets on/off User stylesheets Javascript on/off Flash - present or not LCD or CRT Different monitors & settings Ambient light & monitors Bandwidth
  • Why do we need accessible websites? 20% of the population has some disability If we want to reach to 100% of our audience then we need to cater for the 20% that have barriers to using websites Others benefit – lot specs Organsiation’s frontline/shop window – cost effective The law – HR act Faster and easier to use Not just about blind users Benefit everyone – Impairments and disabilities tend to run along a continuum – at one point or other we will all benefit. e.g. If you leave your reading glasses at home can you still work with a website? Business Side: $$$$ - wasted money on web development Time - face to face or call centre time - 39% of a government agency call centre traffic is about information that is on their website Personal grievance Loss of productivity Time dealing with complaints
  • What is assistive technology? Screen readers Magnifiers Braille output Voice input Browser Tools & capabilities (Firefox – addons, Opera...) Big.com – search engine ‘the most readable results on the web’ ‘ 2 nd Speech Center’ – www.zero2000.com Pointers, modified keyboards, switches, online keyboards CMSs & toolsets – proprietary vs. open
  • Impairments (who needs it?) Deaf- signed video Mobility Impaired – mouse, keyboard Blind Low vision Dyslexic & learning Hearing impaired Brain injured Reading impaired – dyslexia, head injury, drugs 57% of disabled people have more than one impairment Note: Also impacts on mobile devices – small screens – and also on dial-up users of which we still have many in NZ
  • Why do they need it? The web offers so many new opportunities in particular to disabled people unavailable through any other medium It provides a means of: Accessing work Accessing information of all kinds, Making purchases online, Communicating with the world, Accessing entertainment, Participating in the democratic process It does not depend on the responsiveness of other people. It offers independence and freedom.
  • Why do they need it? - Quote from paraplegic/quadriplegic doctor “ If anybody asks me what the Internet means to me, I will tell him without hesitation: To me ( a quadriplegic) the Internet occupies the most important part in my life. It is my feet that can take me to any part of the world; it is my hands which help me accomplish my work; it is my best friend – it gives my life meaning.” - Dr. ZhangXu, practising orthopaedic surgeon (via the Internet), Anshan, China
  • Planning Start of section on Planning.
  • Strategy planning – upfront Integrated Comms & Operations – channels Contingency Levels , standards Non-tech alternatives Define site purpose & audiences EXERCISE: Site Purpose and Audiences
  • Design Start of section on design
  • Design Factors PDF documents Customer Centric Intuitive navigation Simple Pages Enlargement – images/text- complex design Authoring process Adequate colour contrast Fonts Navigation Task focused Page complexity – lots of links Clear page hierarchy – www.lukew.com “ Text only” doesn’t do it Multimedia
  • Provide a Rich Experience Traffic Light Example: Catering for all users Crossing Signal -Picture not wording (for people who are illiterate or non English speaking) -Different pictures for people that are colour blind -led lighting so can be seen clearly at night Ramp for wheelchair access Raised bumps on ground for blind people using sensing sticks Large button for people with low vision Large arrow pointing in walking direction White markings on road so walk-way is easy to follow Crossing sound for blind people
  • Build Start of section on building web sites
  • Document Publishing PDF’s are for print inaccessible (not just for the blind) e.g. low vision, low bandwidth magnification Horizontal scrolling Multiple Fonts Spreadsheets
  • Plain English Flesch – www.editcentral.com/gwt/com.editcentral.EC/EC.html – readability analyser Use Subject-Verb-Object construction by default: For example, instead of this: To update (verb) the address lists (object) may be your primary concern (subject), you should use this: Your primary concern (subject) may be to update (verb) the address lists (object). Avoid vocabulary that a good portion of your audience will stumble over: This applies especially to jargon when the idea can be expressed as well using conventional language. Use verbs instead of "nounisms”: A nounism is a verb rendered in its nominal form. For example, use the verb "introduce" instead of "introduction." Compare: "Jim introduced the speaker" to "Jim gave an introduction of the speaker.“ Use active voice instead of passive: " Sometimes the passive hides who the agent is, which can reduce understandability. For example, "Thirty houses were visited in three weeks." Unless you don't know who visited the houses, or it's completely irrelevant, the active is better: "The family visited thirty houses in three weeks.“ Avoid overly-long sentences: By the time you get to the end of some sentences, you have forgotten what came earlier in the sentence. The following sentence combines two poor choices - long, complicated words that serve no purpose, and excessive length: "If there exist any points on which you require explanation or further explication, we shall be glad to furnish such additional details as may be required via telephone." The following is better: "If you have any questions, please call us."
  • Inverted Pyramid Enables skim-reading The most important information is first and the least important is last Applies to the page and to each paragraph Structure: Key Message Supporting Point Supporting Point This is a familiar term for all journalists, and is recommended practice for most business documents. It just means you put the main idea first. Thus, in a report you start with the executive summary. In a business letter, you write a meaningful subject line that gives the essential information -- or at least enough for easy filing. And for a business proposal, you'll dream up a title that summarises the main benefits. When writing web content, stick closely to the inverted pyramid structure. The main idea goes in the html title, and right at the top of the visible page. In fact for web writing, it's not just the page that should start with the main idea. The inverted pyramid applies to every paragraph or little chunk of text. People will scan your web pages by grabbing headlines, captions, and the first words of every paragraph.
  • Alternative Text Provide meaningful information for people who can’t see the image. They need to present the same information that is conveyed by the image including complex images such as charts and graphs. Essential when text is delivered as an image. Purely decorative images need empty “” alts so screen readers will ignore them. Alts should close with a full-stop and a space. Where visible they can also be useful for sighted people http://juicystudio.com/services/readability.php Complexity assessors EXERCISE: Writing Alt Text
  • Test Start of section on testing
  • Testing Technical – Tests conformance to standards, the objective of which is to ensure that the site will work with any assistive technology Observational – To understand how users really interact with the site and software User testing – Testing with a panel of “Real world” disabled testers working in their own environments – using their own technology.
  • Top Faults in Government Websites Text Alternatives – absent or useless Essential public accountability and other important documents on the site in pdf only Poor colour contrast Poor enlargement Failure to use access keys Small navigation points Accessibility statements focused on compliance rather than an understanding of an audience Overly busy (home) pages
  • Alternative Text Provide meaningful information for people who can’t see the image. They need to present the same information that is conveyed by the image including complex images such as charts and graphs. Essential when text is delivered as an image. Purely decorative images need empty “” alts so screen readers will ignore them. Alts should close with a full-stop and a space. Where visible they can also be useful for sighted people http://juicystudio.com/services/readability.php Complexity assessors EXERCISE: Writing Alt Text
  • Alternative Text Provide meaningful information for people who can’t see the image. They need to present the same information that is conveyed by the image including complex images such as charts and graphs. Essential when text is delivered as an image. Purely decorative images need empty “” alts so screen readers will ignore them. Alts should close with a full-stop and a space. Where visible they can also be useful for sighted people http://juicystudio.com/services/readability.php Complexity assessors EXERCISE: Writing Alt Text
  • Contact Robyn or Mike Robyn Hunt AccEase Ltd P. 027 449 3019 E. [email_address] W. www.AccEase.com B. www.LowVisionary.com Mike Osborne AccEase Ltd P. 04 934 2821 M. 021 675 010 E. [email_address] W. www.AccEase.com
  • Transcript

    • 1. Web Accessibility “ The power of the web is in its universality. Access by everyone regardless of disability is an essential aspect.” - Tim Berners-Lee W3C Director and inventor of the World Wide Web Robyn Hunt – March 31 2010
    • 2. You have no control over how users access your website.
      • Different browsers
      • Different technology
        • PCs, Macs, Linux, mobile devices
        • Different Assistive technologies
      • Screen sizes
      • Screen resolutions
      • Mouse/keyboard/voice
      • Colour depth
      • Images on/off
      • Stylesheets on/off
      • User stylesheets
      • Javascript on/off
      • Flash - present or not
      • LCD or CRT
        • Different monitors & settings
      • Ambient light & monitors
      • Bandwidth
      The web is not print.
    • 3. Why do we need accessible websites? Of that 20% - 57% have more than one disability. 20% of the population has some disability.
    • 4. What is assistive technology?
      • Screen Readers
        • and browser plug-ins
      • Magnifiers
      • Braille Output
      • Browser Tools & Capabilities
    • 5. Impairments (who needs it?)
    • 6. Why do they need it?
      • Communicate
      • Access Information
      • Access Study
      • Access Entertainment
      • Access Work
      The internet offers independence and freedom
    • 7. Why do they need it?
      • “ If anybody asks me what the Internet means to me, I will tell him without hesitation: To me ( a quadriplegic) the Internet occupies the most important part in my life. It is my feet that can take me to any part of the world; it is my hands which help me accomplish my work; it is my best friend – it gives my life meaning.”
      • - Dr. ZhangXu, practising orthopaedic surgeon (via the Internet), Anshan, China
    • 8. Planning
    • 9. Strategy planning – upfront
      • Integrated Comms and Operations Contingency Levels, Standards Non-tech alternatives Determine site purpose and audiences
    • 10. Design
    • 11. Design Factors
      • Customer-centric
      • Task focused
      • Clear page hierarchy
      • Intuitive navigation
      • Simple pages
      • Legible type
      • Adequate contrast
    • 12. Provide a Rich Experience
    • 13. Build
    • 14. Document Publishing
      • PDF’s are for print
        • inaccessible (not just for the blind)
          • e.g. low vision, low bandwidth
        • magnification
          • horizontal scrolling
      • Multiple Fonts
      • Spreadsheets
    • 15. Plain English
      • Use Subject-Verb-Object construction by default
      • e.g. “The cat sat on the mat.”, instead of “The mat was sat on by the cat.”
      • Avoid vocabulary that a good portion of your audience will stumble over
      • Use verbs instead of "nounisms”
        • Introduce rather than to make an introduction
      • Use active voice instead of passive
      • Avoid overly long sentences
    • 16. Inverted Pyramid
      • Enables skim-reading
      • The most important information is first and the least important is last
        • Applies to the page and to each paragraph
      • Structure:
      • Key Message
        • Supporting Point
        • Supporting Point
    • 17. Alternative Text
      • Provide meaningful information for people who can’t see the image.
      • They need to present the same information that is conveyed by the image including complex images such as charts and graphs.
      • Essential when text is delivered as an image.
      • Purely decorative images need empty “” alts so screen readers will ignore them.
      • Alts should close with a full-stop and a space.
      • Where visible they can also be useful for sighted people
      Font Factory
    • 18. Test
    • 19. Testing
      • Usability
      • Technical
      • Observational
      • User Testing
    • 20. Top Website Faults
      • Text Alternatives – absent or useless
      • Essential public accountability and other important documents on the site in pdf only
      • Poor colour contrast
      • Poor enlargement
      • Failure to use access keys
      • Small navigation points
      • Accessibility statements focused on compliance rather than an understanding of an audience
      • Overly busy (home) pages
    • 21. In Conclusion - 1
      • Ten points to remember
      • Everyone benefits
      • Focus on the user
      • Decide on the level of accessibility
      • Get buy-in from decision-makers
      • Link to business planning
    • 22. In Conclusion - 2
      • Ten points to remember
      • Don’t leave it to the techies
      • Learn about accessibility
      • Plan for accessibility
      • Insist on standards and best-practice
      • Test for accessibility
    • 23. Contact Robyn
      • Robyn Hunt
      • AccEase Ltd
      • P. 027 449 3019
      • E. [email_address]
      • W. www.AccEase.com
      • B. www.LowVisionary.com

    ×