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 & Understanding WCAG 2.0 Guidelines

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 & Understanding WCAG 2.0 Guidelines (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

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
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsEnterprise Knowledge
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024Rafal Los
 
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of ServiceCNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Servicegiselly40
 
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
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfEnterprise Knowledge
 
FULL ENJOY 🔝 8264348440 🔝 Call Girls in Diplomatic Enclave | Delhi
FULL ENJOY 🔝 8264348440 🔝 Call Girls in Diplomatic Enclave | DelhiFULL ENJOY 🔝 8264348440 🔝 Call Girls in Diplomatic Enclave | Delhi
FULL ENJOY 🔝 8264348440 🔝 Call Girls in Diplomatic Enclave | Delhisoniya singh
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationRadu Cotescu
 
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
 
Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path MountBreaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path MountPuma Security, LLC
 
Injustice - Developers Among Us (SciFiDevCon 2024)
Injustice - Developers Among Us (SciFiDevCon 2024)Injustice - Developers Among Us (SciFiDevCon 2024)
Injustice - Developers Among Us (SciFiDevCon 2024)Allon Mureinik
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonAnna Loughnan Colquhoun
 
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreternaman860154
 
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...HostedbyConfluent
 
🐬 The future of MySQL is Postgres 🐘
🐬  The future of MySQL is Postgres   🐘🐬  The future of MySQL is Postgres   🐘
🐬 The future of MySQL is Postgres 🐘RTylerCroy
 
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...shyamraj55
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptxHampshireHUG
 
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking MenDelhi Call girls
 
A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024Results
 
Understanding the Laravel MVC Architecture
Understanding the Laravel MVC ArchitectureUnderstanding the Laravel MVC Architecture
Understanding the Laravel MVC ArchitecturePixlogix Infotech
 

Kürzlich hochgeladen (20)

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
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI Solutions
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of ServiceCNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Service
 
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
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
 
FULL ENJOY 🔝 8264348440 🔝 Call Girls in Diplomatic Enclave | Delhi
FULL ENJOY 🔝 8264348440 🔝 Call Girls in Diplomatic Enclave | DelhiFULL ENJOY 🔝 8264348440 🔝 Call Girls in Diplomatic Enclave | Delhi
FULL ENJOY 🔝 8264348440 🔝 Call Girls in Diplomatic Enclave | Delhi
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
 
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...
 
Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path MountBreaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path Mount
 
Injustice - Developers Among Us (SciFiDevCon 2024)
Injustice - Developers Among Us (SciFiDevCon 2024)Injustice - Developers Among Us (SciFiDevCon 2024)
Injustice - Developers Among Us (SciFiDevCon 2024)
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
 
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreter
 
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...
 
🐬 The future of MySQL is Postgres 🐘
🐬  The future of MySQL is Postgres   🐘🐬  The future of MySQL is Postgres   🐘
🐬 The future of MySQL is Postgres 🐘
 
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
 
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
 
A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024
 
Understanding the Laravel MVC Architecture
Understanding the Laravel MVC ArchitectureUnderstanding the Laravel MVC Architecture
Understanding the Laravel MVC Architecture
 

Web Accessibility & Understanding WCAG 2.0 Guidelines

  • 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