Understanding Web Accessibility

522
-1

Published on

This presentation will help you understand:
- The legal requirements behind Web Accessibility
- How do people with disabilities use the web and what assistive technologies they use
- How good usability makes up for better accessibility and improves site’ SEO
- Financial benefits of having an accessible website

Published in: Internet, Design, Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
522
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
0
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Understanding Web Accessibility

  1. 1. UNDERSTANDING WEB ACCESSIBILITY
  2. 2. This presentation will help you understand:  The legal requirements behind Web Accessibility  How do people with disabilities use the web and what assistive technologies they use  How good usability makes up for better accessibility and improves site’ SEO  Financial benefits of having an accessible website
  3. 3. Benefits of an accessible website  Expand potential market share (1.3 million Ontarians with disabilities + seniors and people with cognitive problems)  Increases findability with search engine optimization (SEO)  Focuses on better website usability  Increases positive company image  Eliminates potentially high legal expenses
  4. 4. Purpose and legislature  The goal of web accessibility is to provide a better access to information for people with disabilities.  The government of Ontario has embarked on the road to make Ontario a fully accessible province. The new regulations are outlined in the Accessibility for Ontarians With Disabilities Act (AODA)
  5. 5. Web Accessibility guidelines  The actual guidelines are outlined in the Web Content Accessibility Guidelines 2.0 (WCAG 2.0)  These are established by the Accessibility Initiative of the World Wide Web Consortium (W3C)  There are three levels of accessibility Level A, Level AA Level AAA
  6. 6.  Government of Ontario and the Legislative Assembly  January 1, 2012 New internet and intranet websites must conform with WCAG 2.0 Level AA other than Captions (Live), and Audio Descriptions (Pre- recorded)  January 1, 2016 All internet websites and web content must conform with WCAG 2.0 Level AA, other than Captions (Live), and Audio Descriptions (Pre- recorded).  January 1, 2020 All internet and intranet websites and web content must conform with WCAG 2.0 Level AA AODA - timelines to meet the requirements
  7. 7.  Public sector organizations, businesses and non-profit organizations (50+ staff)  January 1, 2014 All new websites must conform with Web Content Accessibility Guidelines, Level A  January 1, 2021 All websites must conform with Web Content Accessibility Guidelines, Level A A other than Captions (Live) and Audio Descriptions (Pre-recorded) AODA - timelines to meet the requirements
  8. 8. Who are the people with disabilities? Unless we understand how people with disabilities navigate websites and what assistive technologies they use, we cannot build accessible websites. There are four main groups of disabilities: visual audio motor cognitive
  9. 9. Visually impaired use screen magnifying software or screen readers such as Jaws. Screen readers read websites in a linear order - from top to bottom, left to right. Remember this when building the information structure of the website. Blind, low vision, color-blind
  10. 10. Braille devices allow blind users read websites. Just like search engines, screen readers and Braille devices can only interpret written text. Provide alt text for all non-text elements. This is one of the main accessibility requirements that will also improve your site’s SEO. Blind, low vision, color-blind
  11. 11. Deaf or hard-of-hearing Users can read text but require captions and transcript to interpret audio and video content. Always provide transcription for video and audio content. Transcriptions add keyword-rich content to your site which improves your SEO.
  12. 12. Limited fine motor skills, slow response time Trackball mouse is used by people with shaky hands or arthritis. These can be people with disabilities but also many seniors.
  13. 13. Some people use mouse stick to tap and navigate sites via keyboard. Think about the effort it takes to navigate the website. Limited fine motor skills, slow response time
  14. 14. Head wand works in a similar way and again, requires enormous effort to tap through the website. Websites must be keyboard accessible. Aim for a minimum amount of clicks required to get to information. Limited fine motor skills, slow response time
  15. 15. If a person can move only the head he can tap on a switch placed to the side of the head. The switch connects to a software that navigates the site. Limited fine motor skills, slow response time
  16. 16. Sip and puff device can interpret users breath patterns to navigate the web Limited fine motor skills, slow response time Keep in mind that common tasks take disabled users longer to complete for. Make sure they are able extend the time limit e.g. when filling-out forms.
  17. 17. Eye tracking software follows the movement of the eye and allows the person to navigate websites. Limited fine motor skills, slow response time In the past, people with disabilities depended on others to read them a paper of fill out an application. Assistive technologies give them great independence.
  18. 18. Learning disabilities, distractibility, inability to remember or focus  Good usability is paramount for web accessibility  People who have problems using websites that are overly complex or poorly organized  Website must be logically organized, easy to navigate, written in simple language  No objects flashing more than 3x per second as it can cause epileptic seizures
  19. 19. The key web accessibility principles Perceivable Content is readable for assistive technologies Graphics and images have alt text Audio and video content is accompanied by transcript or captions Operable Website is keyboard accessible It is easy to navigate Users have enough time to read and use content Does not cause seizures
  20. 20. Understandable Structure is logical and follows linear order Does not contain extraneous text Robust Website does not require specific technology and can be used by assistive technologies The key web accessibility principles
  21. 21. Perceivable provide alt text for non-text elements E.g. alt text for this image would be: “venus project by jacques fresco”
  22. 22. When graphics contain useful information have this info available in text form E.g. Use longdesc=http://www.website.com/graph_explanation or describe the graphic as part of the content
  23. 23. Do not use alt text for decorative images E.g. This image has no meaning so the alt text should be empty “ “ Our business promises the best service you will find on the planet. Our team is professionally trained to offer excellent customer service throughout the contract negotiation process. Customer satisfaction is our top priority and is guaranteed, or your money back.”
  24. 24. Do not rely on color to carry out meaning
  25. 25. Do not use color to emphasize required fields in forms
  26. 26. Accessible forms  Screen readers read forms in linear order  Form must be keyboard accessible  Keep labels close to the fields  Ask for minimum info – too much info means a lot of effort  Help correct errors  When offering options (radio buttons, checkboxes) keep them close together
  27. 27. Use proper color contrast Contrast ratio for normal-size text should be at least 4.5:1
  28. 28. Operable  Website is keyboard accessible  Users can increase font size and adjust color contrast  Avoid splash pages and intro music (interfere with screen readers)  Content does not open in new window (users can’t find way back)  Content does not change without direct input (avoid pop-up windows)
  29. 29. Understandable  Website is logically organized  Home page should confirm the company name and the purpose of the website  Website with extensive navigation allows for “skip to content”  Menus have descriptive titles  Internal pages have consistent layout
  30. 30. Website copy  Main titles are in H1 heading, are meaningful and contain keywords  Subheadings are in H2 heading, meaningful and contain keywords  Content is further divided into blocks or paragraphs constructed around a single major idea  Aim for 9th grade reading skills  Write clearly using short sentences Using H1, H2, H3 … headings helps on-site SEO and allows users to scan through the content as screen readers can be set to read headings only. Simple language leads to better usability and SEO.
  31. 31.  Avoid acronyms and abbreviations; or explain them  Avoid slang, industry jargon or marketing fluff  Use active voice, use positive terms  Ensure that every word and paragraph is necessary  Give direct instructions Simple writing helps people with cognitive problems better understand the website. Clear language is greatly appreciated by most people. Website copy
  32. 32. Notice the descriptive menu items, meaningful links and intro paragraphs on this government website.
  33. 33. Links  Avoid ‘click here’, ‘go’, ‘read more’ or images as links as they do not make sense out of context  Create meaningful links within text  Differentiate links by color and underline  Don’t place more than 20 links on a page  Use enough space between links Users can have the screen readers read only the links. Therefore, links have to make sense out of context. Sufficient space, large font, underlining make clicking on the link easier. Meaningful, keyword-rich links also help your SEO.
  34. 34. Links
  35. 35. Let’s sum up the benefits of an accessible website  Expand potential market share. It is estimated that 20% of population have some kind of disability. These are potential customers.  Improve your positions in search results (SEO)  Better website usability  Positive company image  Eliminate potentially high legal expenses  And most importantly – it’s the right thing to do
  36. 36. Penalties for non-compliance with AODA Individuals or unincorporated organizations Impact of Contravention: Major Moderate Minor Major $2,000 $1,000 $500 Moderate $1,000 $500 $250 Minor $500 $250 $200 Corporations Impact of Contravention: Major Moderate Minor Major $15,000 $10,000 $5,000 Moderate $10,000 $5,000 $2,500 Minor $2,000 $1,000 $500
  37. 37. Tools and resources  http://webaim.org/  http://www.w3.org/WAI/  http://wave.webaim.org/  http://www.checkmycolours.com/  http://juicystudio.com/services/luminositycontrastratio.php #specify
  38. 38. Andrea Dubravsky www.adwebcom.com info@adwebcom.com Phone: 289 428 1100

×