SlideShare ist ein Scribd-Unternehmen logo
1 von 28
Web Accessibility & WCAG 2.0
           Srinivasu Chakravarthula




                                 f




YAHOO! CONFIDENTIAL
Areas that internet is used
 Education
 Work
 Research
 Entertainment
 Shopping
 Find a place
 Social networking
 Marketing
 Communication
Statistics – Internet users world wide –
                             28.7%
Source: http://www.internetworldstats.com/stats.htm

                            WORLD INTERNET USAGE AND POPULATION STATISTICS

                       Population        Internet Users     Internet Users      Penetration        Growth         Users %
   World Regions
                       ( 2010 Est.)       Dec. 31, 2000       Latest Data      (% Population)     2000-2010       of Table


 Africa                 1,013,779,050           4,514,400        110,931,700             10.9 %       2,357.3 %              5.6 %

 Asia                             Source:
                        3,834,792,852     114,304,000 825,094,396  21.5 %                               621.8 %          42.0 %

 Europe                           http://www.internetworldstats.com/stats.ht
                          813,319,511     105,096,093 475,069,448  58.4 %                               352.0 %          24.2 %

 Middle East
                                  m
                          212,336,924       3,284,800  63,240,946  29.8 %                             1,825.3 %              3.2 %

 North America            344,124,450         108,096,800        266,224,500             77.4 %         146.3 %          13.5 %



 Latin
                          592,556,972          18,068,919        204,689,836             34.5 %       1,032.8 %          10.4 %
 America/Caribbean



 Oceania / Australia        34,700,201          7,620,480         21,263,990             61.3 %         179.0 %              1.1 %


 WORLD TOTAL            6,845,609,960         360,985,492      1,966,514,816             28.7 %         444.8 %        100.0 %
Asia has 825.1 million Internet users
People with disabilities
 Situation
 Functional
How do they use computers and
          internet?
Disability statistics
 Approximately, there are about 78 million people with disabilities
  Source: http://codi.buffalo.edu/graph_based/.demographics/.statistics.htm
 There would be reasonably good number of people with disabilities use the Computers
  and Internet, because
  ›   There is a rapid development in the area of assistive technology

  ›   There is AT for every disability
People with disabilities benefit from
   Offers more independence
                             Internet
 Need not to worry about inaccessible infrastructure and inaccessible transport
 Get things done right from home
What’s the issue?



  97% of websites
  are inaccessible!
              Source: 456BEREAST – Posted in December 2006
http://www.456bereastreet.com/archive/200612/97_of_websites_still_inaccessible/
UN Global Audit of Web Accessibility conducted a survey on Web Accessibility!
Accessibility is not just for people with
disabilities but also…
• Low band width users
• Senior citizens
• Search engines
• Mobile users
Some of the common misconceptions…
 Accessibility is an additional effort
 Accessibility is just for visually impaired users
 Accessibility is an expensive task
 Need to provide a separate text version of the website
Solution…
 Consider accessibility right at the initial stage of the project
 Web Content Accessibility Guidelines (WCAG) 2.0 – http://w3.org/tr/wcag20/
 Accessible Rich Internet Applications (ARIA) - http://www.w3.org/WAI/intro/aria.php
 Authoring Tool Accessibility Guidelines (ATAG) - http://www.w3.org/WAI/intro/atag.php
Web Content Accessibility
 Guidelines (WCAG) 2.0
Definitions
 Principle 1: Perceivable
  ›   Information and user interface components must be presentable to users in ways they can
      perceive.

 Principle 2: Operable
  ›   User interface components and navigation must be operable.

 Principle 3: Understandable
  ›   Information and the operation of user interface must be understandable

 Principle 4: Robust
  ›   Content must be robust enough that it can be interpreted reliably by a wide variety of user agents,
      including assistive technologies.
Guideline 1: Perception
 Non-text content
  ›   Images

  ›   CAPTCHA

  ›   Audio / Video
Guideline 1: Perceivable – contd.,
 Sufficient Color Contrast
Guideline 2: Operable
 Keyboard access – all information and functionality should be available to access via
  keyboard including:
  ›   Links

  ›   Headings

  ›   Form fields

  ›   Lists

  ›   Tables
Principle 3: Understandable
 Use of Natural Language – unless a specific terminology is required
 Predictable – User should be able to predict the result upon his action
 Input assistance – provide adequate help for user to interact with forms etc.
Principle 4: Robust
 Maximize Compatibility with current and future user agents including assistive
  technologies
 Provide name, role and value to all the elements
Accessible Rich Internet Applications (ARIA)

      ARIA is WAI Recommendation http://www.w3.org/WAI/intro/aria.php
      WAI-ARIA, the Accessible Rich Internet Applications Suite, defines a way to make
       Web content and Web applications more accessible to people with disabilities. It
       especially helps with dynamic content and advanced user interface controls
       developed with Ajax, HTML, JavaScript, and related technologies.
      Creating Accessible widgets with ARIA http://ericmiraglia.com/blog/?p=132
Html 5 and accessibility

 Best resource:
  http://html5accessibilit
  y.com
YUI and Accessibility
 We have a lot of accessible controls in YUI 3 such as TabView, Menu, Calendar and so
  on…
 We have used ARIA to make the widgets accessible
 See the blog with videos at http://yuiblog.com/blog/category/accessibility
Accessibility Testing


Automated Tools                             Manual Testing
(Eg: Wave/ FAE)                 +         (Eg: Screen Reader)



                           =


                  Accessibility Testing
Automated Testing
 WAVE – http://wave.webaim.org/toolbar
 Web Developer Kit - https://addons.mozilla.org/en-US/firefox/addon/60
 Color Contrast Analyzer - http://visionaustralia.org/info.aspx?page=628
Accessibility Testing – Manual
 http://twiki.corp.yahoo.com/view/Accessibility/AccessibilityTwiki#qa_corner
  ›   Easy Testing with NVDA

  ›   Reporting Accessibility Issues in Bugzilla and more…

 Screen Readers
  ›   NVDA – http://www.nvda-project.org

  ›   NVDA with necessary settings from Yahoo! Accessibility Team -
      http://twiki.corp.yahoo.com/view/Accessibility/AccessibilityTrainingClass#install-instructions
Accessibility Testing – Mobile
 iPhone, iPad and iPod touch
  ›   VoiceOver – screen reader that helps users with vision impairment

  ›   Zoom – for low vision users

  ›   Mono Audio – closed captioning and TTY for people who are hard of hearing

  ›   Text prediction – for people who have difficulty in typing

 Symbian OS:
  ›   Provides built in screen reader support

  ›   Need to use third party software like Talks or Mobile Speak for other functionality
Questions?
Thank you!
                  Email: srinivu@yahoo-inc.com
                          Twitter: @VasuTweets
               Yahoo! Accessibility Media Outlet:
             Blog – http://accessibility.yahoo.com
Facebook: http://facebook.com/yahooaccessibility
                          Twitter: @yahooaccess

Weitere ähnliche Inhalte

Ähnlich wie Web Accessibility and WCAG

Role of-engineering-best-practices-to-create-an-inclusive-web final-1
Role of-engineering-best-practices-to-create-an-inclusive-web final-1Role of-engineering-best-practices-to-create-an-inclusive-web final-1
Role of-engineering-best-practices-to-create-an-inclusive-web final-1Srinivasu Chakravarthula
 
Creating inclusive mobile applications - NUX Leeds
Creating inclusive mobile applications - NUX Leeds Creating inclusive mobile applications - NUX Leeds
Creating inclusive mobile applications - NUX Leeds Rebecca Topps
 
Corporate Web Accessibility Implementation Strategies
Corporate Web Accessibility Implementation StrategiesCorporate Web Accessibility Implementation Strategies
Corporate Web Accessibility Implementation StrategiesUA WEB, A.C.
 
Introduction to Web Accessibility and WCAG
Introduction to Web Accessibility and WCAGIntroduction to Web Accessibility and WCAG
Introduction to Web Accessibility and WCAGSrinivasu Chakravarthula
 
Introduction to Web Accessibility and WCAG
Introduction to Web Accessibility and WCAGIntroduction to Web Accessibility and WCAG
Introduction to Web Accessibility and WCAGSrinivasu Chakravarthula
 
Usability ≠ Accessibility. An intro to web accessibility for agencies.
Usability ≠ Accessibility. An intro to web accessibility for agencies.Usability ≠ Accessibility. An intro to web accessibility for agencies.
Usability ≠ Accessibility. An intro to web accessibility for agencies.Kate Horowitz
 
Forms for All: Building Accessibility into UiPath App Design
Forms for All: Building Accessibility into UiPath App DesignForms for All: Building Accessibility into UiPath App Design
Forms for All: Building Accessibility into UiPath App DesignDianaGray10
 
Internet--marketing-project
Internet--marketing-projectInternet--marketing-project
Internet--marketing-projectBabasab Patil
 
How to make your WordPress website Multilingual - WordCamp London 2016
How to make your   WordPress website Multilingual - WordCamp London 2016How to make your   WordPress website Multilingual - WordCamp London 2016
How to make your WordPress website Multilingual - WordCamp London 2016Matt Pilarski
 
Accessibility Primer Version 2 - UXfrkln meetup
Accessibility Primer Version 2 - UXfrkln meetupAccessibility Primer Version 2 - UXfrkln meetup
Accessibility Primer Version 2 - UXfrkln meetupMike Gallers
 
sway_presentation
sway_presentationsway_presentation
sway_presentationSWAYco
 
Global accessibility day untapped minority
Global accessibility day  untapped minorityGlobal accessibility day  untapped minority
Global accessibility day untapped minorityBarbara Starr
 
Accessibility and Web Technologies @HTML5_Toronto
Accessibility and Web Technologies @HTML5_TorontoAccessibility and Web Technologies @HTML5_Toronto
Accessibility and Web Technologies @HTML5_TorontoGeorge Zamfir
 
Web Accessibility: Why it needs to be on your to-do list today
Web Accessibility: Why it needs to be on your to-do list todayWeb Accessibility: Why it needs to be on your to-do list today
Web Accessibility: Why it needs to be on your to-do list todayJeremy Perkins
 
Digital Divide And Accessibility
Digital Divide And AccessibilityDigital Divide And Accessibility
Digital Divide And AccessibilityGlenn McKnight
 
A11y presentation accessibility testing for qa
A11y presentation accessibility testing for qaA11y presentation accessibility testing for qa
A11y presentation accessibility testing for qaShraddhaChauhanCPACC
 

Ähnlich wie Web Accessibility and WCAG (20)

Role of-engineering-best-practices-to-create-an-inclusive-web final-1
Role of-engineering-best-practices-to-create-an-inclusive-web final-1Role of-engineering-best-practices-to-create-an-inclusive-web final-1
Role of-engineering-best-practices-to-create-an-inclusive-web final-1
 
Creating inclusive mobile applications - NUX Leeds
Creating inclusive mobile applications - NUX Leeds Creating inclusive mobile applications - NUX Leeds
Creating inclusive mobile applications - NUX Leeds
 
Common misconceptions-on-a11y
Common misconceptions-on-a11yCommon misconceptions-on-a11y
Common misconceptions-on-a11y
 
Corporate Web Accessibility Implementation Strategies
Corporate Web Accessibility Implementation StrategiesCorporate Web Accessibility Implementation Strategies
Corporate Web Accessibility Implementation Strategies
 
Introduction to Web Accessibility and WCAG
Introduction to Web Accessibility and WCAGIntroduction to Web Accessibility and WCAG
Introduction to Web Accessibility and WCAG
 
Introduction to Web Accessibility and WCAG
Introduction to Web Accessibility and WCAGIntroduction to Web Accessibility and WCAG
Introduction to Web Accessibility and WCAG
 
Web_Accessibility
Web_AccessibilityWeb_Accessibility
Web_Accessibility
 
Usability ≠ Accessibility. An intro to web accessibility for agencies.
Usability ≠ Accessibility. An intro to web accessibility for agencies.Usability ≠ Accessibility. An intro to web accessibility for agencies.
Usability ≠ Accessibility. An intro to web accessibility for agencies.
 
Forms for All: Building Accessibility into UiPath App Design
Forms for All: Building Accessibility into UiPath App DesignForms for All: Building Accessibility into UiPath App Design
Forms for All: Building Accessibility into UiPath App Design
 
Internet--marketing-project
Internet--marketing-projectInternet--marketing-project
Internet--marketing-project
 
How to make your WordPress website Multilingual - WordCamp London 2016
How to make your   WordPress website Multilingual - WordCamp London 2016How to make your   WordPress website Multilingual - WordCamp London 2016
How to make your WordPress website Multilingual - WordCamp London 2016
 
Accessibility Primer Version 2 - UXfrkln meetup
Accessibility Primer Version 2 - UXfrkln meetupAccessibility Primer Version 2 - UXfrkln meetup
Accessibility Primer Version 2 - UXfrkln meetup
 
sway_presentation
sway_presentationsway_presentation
sway_presentation
 
sway_presentation
sway_presentationsway_presentation
sway_presentation
 
Global accessibility day untapped minority
Global accessibility day  untapped minorityGlobal accessibility day  untapped minority
Global accessibility day untapped minority
 
Accessibility and Web Technologies @HTML5_Toronto
Accessibility and Web Technologies @HTML5_TorontoAccessibility and Web Technologies @HTML5_Toronto
Accessibility and Web Technologies @HTML5_Toronto
 
Web Accessibility: Why it needs to be on your to-do list today
Web Accessibility: Why it needs to be on your to-do list todayWeb Accessibility: Why it needs to be on your to-do list today
Web Accessibility: Why it needs to be on your to-do list today
 
Digital Divide And Accessibility
Digital Divide And AccessibilityDigital Divide And Accessibility
Digital Divide And Accessibility
 
A11y presentation accessibility testing for qa
A11y presentation accessibility testing for qaA11y presentation accessibility testing for qa
A11y presentation accessibility testing for qa
 
Designing 4 Disabilities
Designing 4 DisabilitiesDesigning 4 Disabilities
Designing 4 Disabilities
 

Kürzlich hochgeladen

Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...Neo4j
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProduct Anonymous
 
Tech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdfTech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdfhans926745
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...Martijn de Jong
 
What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?Antenna Manufacturer Coco
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Miguel Araújo
 
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Drew Madelung
 
How to convert PDF to text with Nanonets
How to convert PDF to text with NanonetsHow to convert PDF to text with Nanonets
How to convert PDF to text with Nanonetsnaman860154
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processorsdebabhi2
 
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking MenDelhi Call girls
 
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)wesley chun
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)Gabriella Davis
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024The Digital Insurer
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024The Digital Insurer
 
Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slideHistor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slidevu2urc
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationSafe Software
 
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptxEIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptxEarley Information Science
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes
 

Kürzlich hochgeladen (20)

Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
Tech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdfTech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdf
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
 
How to convert PDF to text with Nanonets
How to convert PDF to text with NanonetsHow to convert PDF to text with Nanonets
How to convert PDF to text with Nanonets
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
 
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024
 
Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slideHistor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slide
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
 
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptxEIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 

Web Accessibility and WCAG

  • 1. Web Accessibility & WCAG 2.0 Srinivasu Chakravarthula f YAHOO! CONFIDENTIAL
  • 2. Areas that internet is used  Education  Work  Research  Entertainment  Shopping  Find a place  Social networking  Marketing  Communication
  • 3. Statistics – Internet users world wide – 28.7% Source: http://www.internetworldstats.com/stats.htm WORLD INTERNET USAGE AND POPULATION STATISTICS Population Internet Users Internet Users Penetration Growth Users % World Regions ( 2010 Est.) Dec. 31, 2000 Latest Data (% Population) 2000-2010 of Table Africa 1,013,779,050 4,514,400 110,931,700 10.9 % 2,357.3 % 5.6 % Asia Source: 3,834,792,852 114,304,000 825,094,396 21.5 % 621.8 % 42.0 % Europe http://www.internetworldstats.com/stats.ht 813,319,511 105,096,093 475,069,448 58.4 % 352.0 % 24.2 % Middle East m 212,336,924 3,284,800 63,240,946 29.8 % 1,825.3 % 3.2 % North America 344,124,450 108,096,800 266,224,500 77.4 % 146.3 % 13.5 % Latin 592,556,972 18,068,919 204,689,836 34.5 % 1,032.8 % 10.4 % America/Caribbean Oceania / Australia 34,700,201 7,620,480 21,263,990 61.3 % 179.0 % 1.1 % WORLD TOTAL 6,845,609,960 360,985,492 1,966,514,816 28.7 % 444.8 % 100.0 %
  • 4. Asia has 825.1 million Internet users
  • 5. People with disabilities  Situation  Functional
  • 6. How do they use computers and internet?
  • 7. Disability statistics  Approximately, there are about 78 million people with disabilities Source: http://codi.buffalo.edu/graph_based/.demographics/.statistics.htm  There would be reasonably good number of people with disabilities use the Computers and Internet, because › There is a rapid development in the area of assistive technology › There is AT for every disability
  • 8. People with disabilities benefit from  Offers more independence Internet  Need not to worry about inaccessible infrastructure and inaccessible transport  Get things done right from home
  • 9. What’s the issue? 97% of websites are inaccessible! Source: 456BEREAST – Posted in December 2006 http://www.456bereastreet.com/archive/200612/97_of_websites_still_inaccessible/ UN Global Audit of Web Accessibility conducted a survey on Web Accessibility!
  • 10. Accessibility is not just for people with disabilities but also… • Low band width users • Senior citizens • Search engines • Mobile users
  • 11. Some of the common misconceptions…  Accessibility is an additional effort  Accessibility is just for visually impaired users  Accessibility is an expensive task  Need to provide a separate text version of the website
  • 12. Solution…  Consider accessibility right at the initial stage of the project  Web Content Accessibility Guidelines (WCAG) 2.0 – http://w3.org/tr/wcag20/  Accessible Rich Internet Applications (ARIA) - http://www.w3.org/WAI/intro/aria.php  Authoring Tool Accessibility Guidelines (ATAG) - http://www.w3.org/WAI/intro/atag.php
  • 13. Web Content Accessibility Guidelines (WCAG) 2.0
  • 14. Definitions  Principle 1: Perceivable › Information and user interface components must be presentable to users in ways they can perceive.  Principle 2: Operable › User interface components and navigation must be operable.  Principle 3: Understandable › Information and the operation of user interface must be understandable  Principle 4: Robust › Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies.
  • 15. Guideline 1: Perception  Non-text content › Images › CAPTCHA › Audio / Video
  • 16. Guideline 1: Perceivable – contd.,  Sufficient Color Contrast
  • 17. Guideline 2: Operable  Keyboard access – all information and functionality should be available to access via keyboard including: › Links › Headings › Form fields › Lists › Tables
  • 18. Principle 3: Understandable  Use of Natural Language – unless a specific terminology is required  Predictable – User should be able to predict the result upon his action  Input assistance – provide adequate help for user to interact with forms etc.
  • 19. Principle 4: Robust  Maximize Compatibility with current and future user agents including assistive technologies  Provide name, role and value to all the elements
  • 20. Accessible Rich Internet Applications (ARIA)  ARIA is WAI Recommendation http://www.w3.org/WAI/intro/aria.php  WAI-ARIA, the Accessible Rich Internet Applications Suite, defines a way to make Web content and Web applications more accessible to people with disabilities. It especially helps with dynamic content and advanced user interface controls developed with Ajax, HTML, JavaScript, and related technologies.  Creating Accessible widgets with ARIA http://ericmiraglia.com/blog/?p=132
  • 21. Html 5 and accessibility  Best resource: http://html5accessibilit y.com
  • 22. YUI and Accessibility  We have a lot of accessible controls in YUI 3 such as TabView, Menu, Calendar and so on…  We have used ARIA to make the widgets accessible  See the blog with videos at http://yuiblog.com/blog/category/accessibility
  • 23. Accessibility Testing Automated Tools Manual Testing (Eg: Wave/ FAE) + (Eg: Screen Reader) = Accessibility Testing
  • 24. Automated Testing  WAVE – http://wave.webaim.org/toolbar  Web Developer Kit - https://addons.mozilla.org/en-US/firefox/addon/60  Color Contrast Analyzer - http://visionaustralia.org/info.aspx?page=628
  • 25. Accessibility Testing – Manual  http://twiki.corp.yahoo.com/view/Accessibility/AccessibilityTwiki#qa_corner › Easy Testing with NVDA › Reporting Accessibility Issues in Bugzilla and more…  Screen Readers › NVDA – http://www.nvda-project.org › NVDA with necessary settings from Yahoo! Accessibility Team - http://twiki.corp.yahoo.com/view/Accessibility/AccessibilityTrainingClass#install-instructions
  • 26. Accessibility Testing – Mobile  iPhone, iPad and iPod touch › VoiceOver – screen reader that helps users with vision impairment › Zoom – for low vision users › Mono Audio – closed captioning and TTY for people who are hard of hearing › Text prediction – for people who have difficulty in typing  Symbian OS: › Provides built in screen reader support › Need to use third party software like Talks or Mobile Speak for other functionality
  • 28. Thank you! Email: srinivu@yahoo-inc.com Twitter: @VasuTweets Yahoo! Accessibility Media Outlet: Blog – http://accessibility.yahoo.com Facebook: http://facebook.com/yahooaccessibility Twitter: @yahooaccess