SlideShare a Scribd company logo
1 of 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

More Related Content

Similar 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
Srinivasu Chakravarthula
 
sway_presentation
sway_presentationsway_presentation
sway_presentation
SWAYco
 
Global accessibility day untapped minority
Global accessibility day  untapped minorityGlobal accessibility day  untapped minority
Global accessibility day untapped minority
Barbara Starr
 

Similar to 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
 

Recently uploaded

Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
panagenda
 
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
?#DUbAI#??##{{(☎️+971_581248768%)**%*]'#abortion pills for sale in dubai@
 

Recently uploaded (20)

Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
 
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin WoodPolkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
 
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu SubbuApidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
GenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdfGenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdf
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 

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