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

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
Srinivasu 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
 
Common misconceptions-on-a11y
Common misconceptions-on-a11yCommon misconceptions-on-a11y
Common misconceptions-on-a11y
Srinivasu Chakravarthula
 
Corporate Web Accessibility Implementation Strategies
Corporate Web Accessibility Implementation StrategiesCorporate Web Accessibility Implementation Strategies
Corporate Web Accessibility Implementation Strategies
UA 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 WCAG
Srinivasu Chakravarthula
 
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
 
Web_Accessibility
Web_AccessibilityWeb_Accessibility
Web_Accessibility
Shivani Sachdeva
 
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 Design
DianaGray10
 
Internet--marketing-project
Internet--marketing-projectInternet--marketing-project
Internet--marketing-project
Babasab 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 2016
Matt Pilarski
 
Accessibility Primer Version 2 - UXfrkln meetup
Accessibility Primer Version 2 - UXfrkln meetupAccessibility Primer Version 2 - UXfrkln meetup
Accessibility Primer Version 2 - UXfrkln meetup
Mike Gallers
 
sway_presentation
sway_presentationsway_presentation
sway_presentation
Lauren Hille
 
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
 
Accessibility and Web Technologies @HTML5_Toronto
Accessibility and Web Technologies @HTML5_TorontoAccessibility and Web Technologies @HTML5_Toronto
Accessibility and Web Technologies @HTML5_Toronto
George 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 today
Jeremy Perkins
 
Digital Divide And Accessibility
Digital Divide And AccessibilityDigital Divide And Accessibility
Digital Divide And Accessibility
Glenn McKnight
 
A11y presentation accessibility testing for qa
A11y presentation accessibility testing for qaA11y presentation accessibility testing for qa
A11y presentation accessibility testing for qa
ShraddhaChauhanCPACC
 
Designing 4 Disabilities
Designing 4 DisabilitiesDesigning 4 Disabilities
Designing 4 Disabilities
Richard Appleyard
 

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

Full-RAG: A modern architecture for hyper-personalization
Full-RAG: A modern architecture for hyper-personalizationFull-RAG: A modern architecture for hyper-personalization
Full-RAG: A modern architecture for hyper-personalization
Zilliz
 
Removing Uninteresting Bytes in Software Fuzzing
Removing Uninteresting Bytes in Software FuzzingRemoving Uninteresting Bytes in Software Fuzzing
Removing Uninteresting Bytes in Software Fuzzing
Aftab Hussain
 
UiPath Test Automation using UiPath Test Suite series, part 5
UiPath Test Automation using UiPath Test Suite series, part 5UiPath Test Automation using UiPath Test Suite series, part 5
UiPath Test Automation using UiPath Test Suite series, part 5
DianaGray10
 
20240609 QFM020 Irresponsible AI Reading List May 2024
20240609 QFM020 Irresponsible AI Reading List May 202420240609 QFM020 Irresponsible AI Reading List May 2024
20240609 QFM020 Irresponsible AI Reading List May 2024
Matthew Sinclair
 
TrustArc Webinar - 2024 Global Privacy Survey
TrustArc Webinar - 2024 Global Privacy SurveyTrustArc Webinar - 2024 Global Privacy Survey
TrustArc Webinar - 2024 Global Privacy Survey
TrustArc
 
National Security Agency - NSA mobile device best practices
National Security Agency - NSA mobile device best practicesNational Security Agency - NSA mobile device best practices
National Security Agency - NSA mobile device best practices
Quotidiano Piemontese
 
GraphSummit Singapore | Graphing Success: Revolutionising Organisational Stru...
GraphSummit Singapore | Graphing Success: Revolutionising Organisational Stru...GraphSummit Singapore | Graphing Success: Revolutionising Organisational Stru...
GraphSummit Singapore | Graphing Success: Revolutionising Organisational Stru...
Neo4j
 
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with SlackLet's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
shyamraj55
 
Driving Business Innovation: Latest Generative AI Advancements & Success Story
Driving Business Innovation: Latest Generative AI Advancements & Success StoryDriving Business Innovation: Latest Generative AI Advancements & Success Story
Driving Business Innovation: Latest Generative AI Advancements & Success Story
Safe Software
 
みなさんこんにちはこれ何文字まで入るの?40文字以下不可とか本当に意味わからないけどこれ限界文字数書いてないからマジでやばい文字数いけるんじゃないの?えこ...
みなさんこんにちはこれ何文字まで入るの?40文字以下不可とか本当に意味わからないけどこれ限界文字数書いてないからマジでやばい文字数いけるんじゃないの?えこ...みなさんこんにちはこれ何文字まで入るの?40文字以下不可とか本当に意味わからないけどこれ限界文字数書いてないからマジでやばい文字数いけるんじゃないの?えこ...
みなさんこんにちはこれ何文字まで入るの?40文字以下不可とか本当に意味わからないけどこれ限界文字数書いてないからマジでやばい文字数いけるんじゃないの?えこ...
名前 です男
 
Why You Should Replace Windows 11 with Nitrux Linux 3.5.0 for enhanced perfor...
Why You Should Replace Windows 11 with Nitrux Linux 3.5.0 for enhanced perfor...Why You Should Replace Windows 11 with Nitrux Linux 3.5.0 for enhanced perfor...
Why You Should Replace Windows 11 with Nitrux Linux 3.5.0 for enhanced perfor...
SOFTTECHHUB
 
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
Speck&Tech
 
Serial Arm Control in Real Time Presentation
Serial Arm Control in Real Time PresentationSerial Arm Control in Real Time Presentation
Serial Arm Control in Real Time Presentation
tolgahangng
 
UiPath Test Automation using UiPath Test Suite series, part 6
UiPath Test Automation using UiPath Test Suite series, part 6UiPath Test Automation using UiPath Test Suite series, part 6
UiPath Test Automation using UiPath Test Suite series, part 6
DianaGray10
 
RESUME BUILDER APPLICATION Project for students
RESUME BUILDER APPLICATION Project for studentsRESUME BUILDER APPLICATION Project for students
RESUME BUILDER APPLICATION Project for students
KAMESHS29
 
GraphSummit Singapore | Enhancing Changi Airport Group's Passenger Experience...
GraphSummit Singapore | Enhancing Changi Airport Group's Passenger Experience...GraphSummit Singapore | Enhancing Changi Airport Group's Passenger Experience...
GraphSummit Singapore | Enhancing Changi Airport Group's Passenger Experience...
Neo4j
 
Mind map of terminologies used in context of Generative AI
Mind map of terminologies used in context of Generative AIMind map of terminologies used in context of Generative AI
Mind map of terminologies used in context of Generative AI
Kumud Singh
 
Communications Mining Series - Zero to Hero - Session 1
Communications Mining Series - Zero to Hero - Session 1Communications Mining Series - Zero to Hero - Session 1
Communications Mining Series - Zero to Hero - Session 1
DianaGray10
 
Pushing the limits of ePRTC: 100ns holdover for 100 days
Pushing the limits of ePRTC: 100ns holdover for 100 daysPushing the limits of ePRTC: 100ns holdover for 100 days
Pushing the limits of ePRTC: 100ns holdover for 100 days
Adtran
 
Mariano G Tinti - Decoding SpaceX
Mariano G Tinti - Decoding SpaceXMariano G Tinti - Decoding SpaceX
Mariano G Tinti - Decoding SpaceX
Mariano Tinti
 

Recently uploaded (20)

Full-RAG: A modern architecture for hyper-personalization
Full-RAG: A modern architecture for hyper-personalizationFull-RAG: A modern architecture for hyper-personalization
Full-RAG: A modern architecture for hyper-personalization
 
Removing Uninteresting Bytes in Software Fuzzing
Removing Uninteresting Bytes in Software FuzzingRemoving Uninteresting Bytes in Software Fuzzing
Removing Uninteresting Bytes in Software Fuzzing
 
UiPath Test Automation using UiPath Test Suite series, part 5
UiPath Test Automation using UiPath Test Suite series, part 5UiPath Test Automation using UiPath Test Suite series, part 5
UiPath Test Automation using UiPath Test Suite series, part 5
 
20240609 QFM020 Irresponsible AI Reading List May 2024
20240609 QFM020 Irresponsible AI Reading List May 202420240609 QFM020 Irresponsible AI Reading List May 2024
20240609 QFM020 Irresponsible AI Reading List May 2024
 
TrustArc Webinar - 2024 Global Privacy Survey
TrustArc Webinar - 2024 Global Privacy SurveyTrustArc Webinar - 2024 Global Privacy Survey
TrustArc Webinar - 2024 Global Privacy Survey
 
National Security Agency - NSA mobile device best practices
National Security Agency - NSA mobile device best practicesNational Security Agency - NSA mobile device best practices
National Security Agency - NSA mobile device best practices
 
GraphSummit Singapore | Graphing Success: Revolutionising Organisational Stru...
GraphSummit Singapore | Graphing Success: Revolutionising Organisational Stru...GraphSummit Singapore | Graphing Success: Revolutionising Organisational Stru...
GraphSummit Singapore | Graphing Success: Revolutionising Organisational Stru...
 
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with SlackLet's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
 
Driving Business Innovation: Latest Generative AI Advancements & Success Story
Driving Business Innovation: Latest Generative AI Advancements & Success StoryDriving Business Innovation: Latest Generative AI Advancements & Success Story
Driving Business Innovation: Latest Generative AI Advancements & Success Story
 
みなさんこんにちはこれ何文字まで入るの?40文字以下不可とか本当に意味わからないけどこれ限界文字数書いてないからマジでやばい文字数いけるんじゃないの?えこ...
みなさんこんにちはこれ何文字まで入るの?40文字以下不可とか本当に意味わからないけどこれ限界文字数書いてないからマジでやばい文字数いけるんじゃないの?えこ...みなさんこんにちはこれ何文字まで入るの?40文字以下不可とか本当に意味わからないけどこれ限界文字数書いてないからマジでやばい文字数いけるんじゃないの?えこ...
みなさんこんにちはこれ何文字まで入るの?40文字以下不可とか本当に意味わからないけどこれ限界文字数書いてないからマジでやばい文字数いけるんじゃないの?えこ...
 
Why You Should Replace Windows 11 with Nitrux Linux 3.5.0 for enhanced perfor...
Why You Should Replace Windows 11 with Nitrux Linux 3.5.0 for enhanced perfor...Why You Should Replace Windows 11 with Nitrux Linux 3.5.0 for enhanced perfor...
Why You Should Replace Windows 11 with Nitrux Linux 3.5.0 for enhanced perfor...
 
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
 
Serial Arm Control in Real Time Presentation
Serial Arm Control in Real Time PresentationSerial Arm Control in Real Time Presentation
Serial Arm Control in Real Time Presentation
 
UiPath Test Automation using UiPath Test Suite series, part 6
UiPath Test Automation using UiPath Test Suite series, part 6UiPath Test Automation using UiPath Test Suite series, part 6
UiPath Test Automation using UiPath Test Suite series, part 6
 
RESUME BUILDER APPLICATION Project for students
RESUME BUILDER APPLICATION Project for studentsRESUME BUILDER APPLICATION Project for students
RESUME BUILDER APPLICATION Project for students
 
GraphSummit Singapore | Enhancing Changi Airport Group's Passenger Experience...
GraphSummit Singapore | Enhancing Changi Airport Group's Passenger Experience...GraphSummit Singapore | Enhancing Changi Airport Group's Passenger Experience...
GraphSummit Singapore | Enhancing Changi Airport Group's Passenger Experience...
 
Mind map of terminologies used in context of Generative AI
Mind map of terminologies used in context of Generative AIMind map of terminologies used in context of Generative AI
Mind map of terminologies used in context of Generative AI
 
Communications Mining Series - Zero to Hero - Session 1
Communications Mining Series - Zero to Hero - Session 1Communications Mining Series - Zero to Hero - Session 1
Communications Mining Series - Zero to Hero - Session 1
 
Pushing the limits of ePRTC: 100ns holdover for 100 days
Pushing the limits of ePRTC: 100ns holdover for 100 daysPushing the limits of ePRTC: 100ns holdover for 100 days
Pushing the limits of ePRTC: 100ns holdover for 100 days
 
Mariano G Tinti - Decoding SpaceX
Mariano G Tinti - Decoding SpaceXMariano G Tinti - Decoding SpaceX
Mariano G Tinti - Decoding SpaceX
 

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