SlideShare una empresa de Scribd logo
1 de 37
Web AccessibilitYDevelopMent WebDev A11y Tools In Action @seanyo seanyo.ca sean.yo@uoguelph.ca
When is Your Website Accessible?
If a person encounters a barrier  to using your website, then  your website is not accessible A high standard, but one worth striving for
If a person encounters a barrier  to using your website, then  your website is not accessible
If a person encounters a barrier  to using your website, then  your website is not accessible
Web Accessibility is about People
Web Accessibility is a Process
Define Accessibility for your project Be SMART Specific, Measurable, Attainable, Realistic, Timely 
Measuring Web Accessibility
Tools People Expertise
Tools
wave.webaim.org
WAVE toolbar
Wave dreamweaver extension
www.tawdis.net/ingles.html “Web Accessibility Test”
TAW CMS Integration
Taw Standalone
TAW Firefox add-on
 FAE: Functional Accessibility Evaluator http://fae.cita.uiuc.edu/
Firefox accessibility extension
Fangs firefox screen reader emulator
Web Developer Toolbar
NVDA Non-visual Desktop access
Holmes.css
Checkmycolours.com
Readability calculator
Resources
www.w3.org/WAI Web Accessibility Initiative 
Before and after demonstration http://www.w3.org/WAI/demos/bad/
webaim.org
webstandardssherpa.com
Books
Connect @seanyo http://seanyo.ca sean.yo@uoguelph.ca Get in touch. Srsly. I’m very lonely.

Más contenido relacionado

Destacado

A Bright Future for Web Accessibility
A Bright Future for Web AccessibilityA Bright Future for Web Accessibility
A Bright Future for Web AccessibilityDaniel Dafoe
 
Web Accessibility & Web Performance ή πως να Κάνετε το Website σας Ταχύτερο κ...
Web Accessibility & Web Performance ή πως να Κάνετε το Website σας Ταχύτερο κ...Web Accessibility & Web Performance ή πως να Κάνετε το Website σας Ταχύτερο κ...
Web Accessibility & Web Performance ή πως να Κάνετε το Website σας Ταχύτερο κ...Panos Koutsodimitropoulos
 
Enabling an Accessible Web 2.0
Enabling an Accessible Web 2.0Enabling an Accessible Web 2.0
Enabling an Accessible Web 2.0bgibson
 
Challenges with third party tools in Federal Government web apps - A11y Camp ...
Challenges with third party tools in Federal Government web apps - A11y Camp ...Challenges with third party tools in Federal Government web apps - A11y Camp ...
Challenges with third party tools in Federal Government web apps - A11y Camp ...Ross Mullen
 
MCCVLC Webinar - Good Practices in Online Delivery of Developmental Ed
MCCVLC Webinar - Good Practices in Online Delivery of Developmental EdMCCVLC Webinar - Good Practices in Online Delivery of Developmental Ed
MCCVLC Webinar - Good Practices in Online Delivery of Developmental EdBarry Dahl
 
Web accessibility testing methodologies, tools and tips
Web accessibility testing methodologies, tools and tipsWeb accessibility testing methodologies, tools and tips
Web accessibility testing methodologies, tools and tipsHenny Swan
 
Benchmarking Web Accessibility Evaluation Tools: Measuring the Harm of Sole R...
Benchmarking Web Accessibility Evaluation Tools: Measuring the Harm of Sole R...Benchmarking Web Accessibility Evaluation Tools: Measuring the Harm of Sole R...
Benchmarking Web Accessibility Evaluation Tools: Measuring the Harm of Sole R...Markel Vigo
 
Web accessibility workshop 4
Web accessibility workshop 4Web accessibility workshop 4
Web accessibility workshop 4Vladimir Tomberg
 
SharePoint 2010 Web Standards & Accessibility
SharePoint 2010 Web Standards & AccessibilitySharePoint 2010 Web Standards & Accessibility
SharePoint 2010 Web Standards & AccessibilityMavention
 
Website Accessibility
Website AccessibilityWebsite Accessibility
Website AccessibilityNishan Bose
 
The 5 Layers of Web Accessibility
The 5 Layers of Web AccessibilityThe 5 Layers of Web Accessibility
The 5 Layers of Web AccessibilityDirk Ginader
 
Web Accessibility Gone Wild (Now Even MORE Wilder!)
Web Accessibility Gone Wild (Now Even MORE Wilder!)Web Accessibility Gone Wild (Now Even MORE Wilder!)
Web Accessibility Gone Wild (Now Even MORE Wilder!)Jared Smith
 

Destacado (15)

A Bright Future for Web Accessibility
A Bright Future for Web AccessibilityA Bright Future for Web Accessibility
A Bright Future for Web Accessibility
 
Web Accessibility & Web Performance ή πως να Κάνετε το Website σας Ταχύτερο κ...
Web Accessibility & Web Performance ή πως να Κάνετε το Website σας Ταχύτερο κ...Web Accessibility & Web Performance ή πως να Κάνετε το Website σας Ταχύτερο κ...
Web Accessibility & Web Performance ή πως να Κάνετε το Website σας Ταχύτερο κ...
 
Enabling an Accessible Web 2.0
Enabling an Accessible Web 2.0Enabling an Accessible Web 2.0
Enabling an Accessible Web 2.0
 
Challenges with third party tools in Federal Government web apps - A11y Camp ...
Challenges with third party tools in Federal Government web apps - A11y Camp ...Challenges with third party tools in Federal Government web apps - A11y Camp ...
Challenges with third party tools in Federal Government web apps - A11y Camp ...
 
MCCVLC Webinar - Good Practices in Online Delivery of Developmental Ed
MCCVLC Webinar - Good Practices in Online Delivery of Developmental EdMCCVLC Webinar - Good Practices in Online Delivery of Developmental Ed
MCCVLC Webinar - Good Practices in Online Delivery of Developmental Ed
 
Web accessibility testing methodologies, tools and tips
Web accessibility testing methodologies, tools and tipsWeb accessibility testing methodologies, tools and tips
Web accessibility testing methodologies, tools and tips
 
Benchmarking Web Accessibility Evaluation Tools: Measuring the Harm of Sole R...
Benchmarking Web Accessibility Evaluation Tools: Measuring the Harm of Sole R...Benchmarking Web Accessibility Evaluation Tools: Measuring the Harm of Sole R...
Benchmarking Web Accessibility Evaluation Tools: Measuring the Harm of Sole R...
 
Web accessibility workshop 4
Web accessibility workshop 4Web accessibility workshop 4
Web accessibility workshop 4
 
Web Accessibility
Web AccessibilityWeb Accessibility
Web Accessibility
 
SharePoint 2010 Web Standards & Accessibility
SharePoint 2010 Web Standards & AccessibilitySharePoint 2010 Web Standards & Accessibility
SharePoint 2010 Web Standards & Accessibility
 
Web Accessibility
Web AccessibilityWeb Accessibility
Web Accessibility
 
Website Accessibility
Website AccessibilityWebsite Accessibility
Website Accessibility
 
The 5 Layers of Web Accessibility
The 5 Layers of Web AccessibilityThe 5 Layers of Web Accessibility
The 5 Layers of Web Accessibility
 
Web Accessibility Gone Wild (Now Even MORE Wilder!)
Web Accessibility Gone Wild (Now Even MORE Wilder!)Web Accessibility Gone Wild (Now Even MORE Wilder!)
Web Accessibility Gone Wild (Now Even MORE Wilder!)
 
Anamika.Chauhan
Anamika.ChauhanAnamika.Chauhan
Anamika.Chauhan
 

Similar a Web accessibility Development Tools In Action

Getting Started With Web Accessibility
Getting Started With Web AccessibilityGetting Started With Web Accessibility
Getting Started With Web AccessibilitySean Yo
 
Wave training
Wave trainingWave training
Wave trainingSean Yo
 
Practical Accessibility Testing
Practical Accessibility TestingPractical Accessibility Testing
Practical Accessibility TestingGlenda Sims
 
Wordcamp buffalo
Wordcamp buffaloWordcamp buffalo
Wordcamp buffalothegeniusca
 
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
 
Wordcamp Toronto 2013
Wordcamp Toronto 2013Wordcamp Toronto 2013
Wordcamp Toronto 2013thegeniusca
 
Accessibility And 508 Compliance In 2009
Accessibility And 508 Compliance In 2009Accessibility And 508 Compliance In 2009
Accessibility And 508 Compliance In 2009Emagination ®
 
A Half Day Workshop on Building Accessible Websites For People With Disabilities
A Half Day Workshop on Building Accessible Websites For People With DisabilitiesA Half Day Workshop on Building Accessible Websites For People With Disabilities
A Half Day Workshop on Building Accessible Websites For People With DisabilitiesAayush Shrestha
 
Web Accessibility Demystified, by Penny Harding, Hannon Hill Corporation
Web Accessibility Demystified, by Penny Harding, Hannon Hill CorporationWeb Accessibility Demystified, by Penny Harding, Hannon Hill Corporation
Web Accessibility Demystified, by Penny Harding, Hannon Hill Corporationhannonhill
 
How HTML5 and WAI-ARIA Can Improve Virtual Space of Universities
How HTML5 and WAI-ARIA Can Improve Virtual Space of UniversitiesHow HTML5 and WAI-ARIA Can Improve Virtual Space of Universities
How HTML5 and WAI-ARIA Can Improve Virtual Space of UniversitiesRadek Pavlíček
 
Web accessibility is everyone's job
Web accessibility is everyone's jobWeb accessibility is everyone's job
Web accessibility is everyone's jobRemya Ramesh
 
Tools And Techniques For Evaluating Accessibility
Tools And Techniques For Evaluating AccessibilityTools And Techniques For Evaluating Accessibility
Tools And Techniques For Evaluating AccessibilityRachel Cherry
 
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
 
What’s Next with Accessibility?
What’s Next with Accessibility?What’s Next with Accessibility?
What’s Next with Accessibility?Keana Lynch
 
Testing for Inclusive Web: Accessibility
Testing for Inclusive Web: AccessibilityTesting for Inclusive Web: Accessibility
Testing for Inclusive Web: AccessibilityManoj Kumar Kumar
 

Similar a Web accessibility Development Tools In Action (20)

Getting Started With Web Accessibility
Getting Started With Web AccessibilityGetting Started With Web Accessibility
Getting Started With Web Accessibility
 
Wave training
Wave trainingWave training
Wave training
 
Practical Accessibility Testing
Practical Accessibility TestingPractical Accessibility Testing
Practical Accessibility Testing
 
Wordcamp buffalo
Wordcamp buffaloWordcamp buffalo
Wordcamp buffalo
 
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
 
Fa qs 2016-04-21
Fa qs 2016-04-21Fa qs 2016-04-21
Fa qs 2016-04-21
 
Wordcamp Toronto 2013
Wordcamp Toronto 2013Wordcamp Toronto 2013
Wordcamp Toronto 2013
 
Accessibility part 2
Accessibility part 2Accessibility part 2
Accessibility part 2
 
508 ada-wcag md mustafizur rahman.
508 ada-wcag md mustafizur rahman.508 ada-wcag md mustafizur rahman.
508 ada-wcag md mustafizur rahman.
 
Accessibility And 508 Compliance In 2009
Accessibility And 508 Compliance In 2009Accessibility And 508 Compliance In 2009
Accessibility And 508 Compliance In 2009
 
A Half Day Workshop on Building Accessible Websites For People With Disabilities
A Half Day Workshop on Building Accessible Websites For People With DisabilitiesA Half Day Workshop on Building Accessible Websites For People With Disabilities
A Half Day Workshop on Building Accessible Websites For People With Disabilities
 
Web Accessibility Demystified, by Penny Harding, Hannon Hill Corporation
Web Accessibility Demystified, by Penny Harding, Hannon Hill CorporationWeb Accessibility Demystified, by Penny Harding, Hannon Hill Corporation
Web Accessibility Demystified, by Penny Harding, Hannon Hill Corporation
 
How HTML5 and WAI-ARIA Can Improve Virtual Space of Universities
How HTML5 and WAI-ARIA Can Improve Virtual Space of UniversitiesHow HTML5 and WAI-ARIA Can Improve Virtual Space of Universities
How HTML5 and WAI-ARIA Can Improve Virtual Space of Universities
 
Web accessibility is everyone's job
Web accessibility is everyone's jobWeb accessibility is everyone's job
Web accessibility is everyone's job
 
Tools And Techniques For Evaluating Accessibility
Tools And Techniques For Evaluating AccessibilityTools And Techniques For Evaluating Accessibility
Tools And Techniques For Evaluating Accessibility
 
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
 
Accessibility
AccessibilityAccessibility
Accessibility
 
What’s Next with Accessibility?
What’s Next with Accessibility?What’s Next with Accessibility?
What’s Next with Accessibility?
 
Testing for Inclusive Web: Accessibility
Testing for Inclusive Web: AccessibilityTesting for Inclusive Web: Accessibility
Testing for Inclusive Web: Accessibility
 

Más de Sean Yo

Design Personas - Start With Who
Design Personas - Start With WhoDesign Personas - Start With Who
Design Personas - Start With WhoSean Yo
 
Behind The Curtain: A Vendors Talks About Accessibility
Behind The Curtain: A Vendors Talks About AccessibilityBehind The Curtain: A Vendors Talks About Accessibility
Behind The Curtain: A Vendors Talks About AccessibilitySean Yo
 
Real World Retrospectives
Real World RetrospectivesReal World Retrospectives
Real World RetrospectivesSean Yo
 
Sean on leave
Sean on leaveSean on leave
Sean on leaveSean Yo
 
Spring it2010keynote
Spring it2010keynoteSpring it2010keynote
Spring it2010keynoteSean Yo
 
Drupal club
Drupal clubDrupal club
Drupal clubSean Yo
 
A Delicious Tale
A Delicious TaleA Delicious Tale
A Delicious TaleSean Yo
 
1000 km later
1000 km later1000 km later
1000 km laterSean Yo
 
Harm reduction & the web
Harm reduction & the webHarm reduction & the web
Harm reduction & the webSean Yo
 
Future Of The Web
Future Of The WebFuture Of The Web
Future Of The WebSean Yo
 
Drupalvs wordpress fsoss2011
Drupalvs wordpress fsoss2011Drupalvs wordpress fsoss2011
Drupalvs wordpress fsoss2011Sean Yo
 
Firefox 5
Firefox 5Firefox 5
Firefox 5Sean Yo
 
Drupal vs. WordPress: Smackdown Edition
Drupal vs. WordPress: Smackdown EditionDrupal vs. WordPress: Smackdown Edition
Drupal vs. WordPress: Smackdown EditionSean Yo
 
Welcome To WordPress
Welcome To WordPressWelcome To WordPress
Welcome To WordPressSean Yo
 
Real World Web Accessibility
Real World Web AccessibilityReal World Web Accessibility
Real World Web AccessibilitySean Yo
 
Web 2.0 Experiential Learning
Web 2.0 Experiential LearningWeb 2.0 Experiential Learning
Web 2.0 Experiential LearningSean Yo
 

Más de Sean Yo (18)

Design Personas - Start With Who
Design Personas - Start With WhoDesign Personas - Start With Who
Design Personas - Start With Who
 
Behind The Curtain: A Vendors Talks About Accessibility
Behind The Curtain: A Vendors Talks About AccessibilityBehind The Curtain: A Vendors Talks About Accessibility
Behind The Curtain: A Vendors Talks About Accessibility
 
Real World Retrospectives
Real World RetrospectivesReal World Retrospectives
Real World Retrospectives
 
Web2013
Web2013Web2013
Web2013
 
Sean on leave
Sean on leaveSean on leave
Sean on leave
 
Spring it2010keynote
Spring it2010keynoteSpring it2010keynote
Spring it2010keynote
 
Drupal club
Drupal clubDrupal club
Drupal club
 
A Delicious Tale
A Delicious TaleA Delicious Tale
A Delicious Tale
 
1000 km later
1000 km later1000 km later
1000 km later
 
Harm reduction & the web
Harm reduction & the webHarm reduction & the web
Harm reduction & the web
 
Future Of The Web
Future Of The WebFuture Of The Web
Future Of The Web
 
Drupalvs wordpress fsoss2011
Drupalvs wordpress fsoss2011Drupalvs wordpress fsoss2011
Drupalvs wordpress fsoss2011
 
Firefox 5
Firefox 5Firefox 5
Firefox 5
 
Drupal vs. WordPress: Smackdown Edition
Drupal vs. WordPress: Smackdown EditionDrupal vs. WordPress: Smackdown Edition
Drupal vs. WordPress: Smackdown Edition
 
Welcome To WordPress
Welcome To WordPressWelcome To WordPress
Welcome To WordPress
 
Real World Web Accessibility
Real World Web AccessibilityReal World Web Accessibility
Real World Web Accessibility
 
Web 2.0 Experiential Learning
Web 2.0 Experiential LearningWeb 2.0 Experiential Learning
Web 2.0 Experiential Learning
 
Wiki Do
Wiki DoWiki Do
Wiki Do
 

Web accessibility Development Tools In Action

Notas del editor

  1. Ask Audience and guide them to the next slide
  2. This isn’t meant to be discouraging, but highlight the gap between checklists and experience.
  3. Most importantly, I want to acknowledge that a11y can be a hard problem to solve, because its centered people. Not a checklist, not success criteria, not even a browser or a screen reader. All those things are important and part of the equation.
  4. The next thing I want to focus on is a person encountering a barrier – I just want to note that this is an active process. This is an experience the person has – one where they make decisions about how to engage our websites that we can’t always predict or anticipate.
  5. At the heart of a11y is connecting people to information. People engaging our websites successfully – and unsuccessfully. When someone encounters a barrier to accessing one of our websites, that is a problem we need to hear about and then work to resolve. So the good news is that if your engaging your users, being authentic and you’re committed to removing barriers on your website then your being accessible.
  6. Never forget we build websites for the people who use them, not the people who build them or even the people who pay for them. If you were a chef and made every recipe the way the owner wanted, but no one liked the food, you wouldn’t be successful.XKCD Comic: Venn Diagram of Things on the Front Page of A University Website and Things People Go To The Site Looking ForCampus Photo SlideshowAlumni In The NewsLetter From The PresidentVirtual TourParking InformationUsable Campus MapAcademic CalendarApplication FormsFull Name of School
  7. We’re going to talk about a lot of tools today – please don’t forget that web a11y is a process – not a tool. Tools are finite…accessibiilty is an ongoing cycle of needs, content, standards and technology.
  8. The any barrier encountered defn is a challengeWe can mitigate this challenge by not trying to use a cookie cutter, one size fits all idea of what it means to be accessible.
  9. We can measure a11y with tools – which is what I’ll be talking about today. Tools are good for baselines and contextWe need to focus our work on people – which means when we’re having conversations with people about their experience with our websites is when we’re measuring a11yAnd in addition to measuring the accessibility experience our users have, we need to develop accessibility expertise in our developers. Think of a cabinet maker who can spot a corner that isn’t square at a glance – she can get a t-square and measure it and confirm the error, but a keen eye and practiced expertise is what is valuable.
  10. Test wave on wavehttp://www.standards-schmandards.com/2009/pitfalls-of-web-accessibility-evaluation-tools/ Seanyo.caThen show hackguelph.ca
  11. Hackguelph.caNote the tight coupling with W3C success criteriaExplicitly provides actions that are only possible by a humanSummary, Marked view, Details, Listing
  12. A11ycamp.org
  13. A11ycamp.org
  14. A11ycamp.org
  15. http://wptalk.org/holmes-css-checker/
  16. A11ycamp.org
  17. http://www.addedbytes.com/lab/readability-score/ Scene:  A cafe.  One table is occupied by a group of Vikings wearing horned helmets.  Whenever the word "spam" is repeated, they begin singing and/or chanting.  A man and his wife enter.  The man is played by Eric Idle, the wife is played by Graham Chapman (in drag), and the waitress is played by Terry Jones, also in drag.Man:You sit here, dear.Wife:Allright.Man:Morning!Waitress:Morning!Man:Well, what've you got?Waitress:Well, there's egg and bacon; egg sausage and bacon; egg and spam; egg bacon and spam; egg bacon sausage and spam; spam bacon sausage and spam; spam egg spam spam bacon and spam; spam sausage spam spam bacon spam tomato and spam;Vikings:Spam spam spamspam...Waitress:...spam spamspam egg and spam; spam spamspamspamspamspam baked beans spam spamspam...Vikings:Spam! Lovely spam! Lovely spam!Waitress:...or Lobster Thermidor a Crevette with a mornay sauce served in a Provencale manner with shallots and aubergines garnished with truffle pate, brandy and with a fried egg on top and spam.Wife:Have you got anything without spam?Waitress:Well, there's spam egg sausage and spam, that's not got much spam in it.Wife:I don't want ANY spam!Man:Why can't she have egg bacon spam and sausage?Wife:THAT'S got spam in it!Man:Hasn't got as much spam in it as spam egg sausage and spam, has it?Vikings:Spam spam spamspam... (Crescendo through next few lines...)Wife:Could you do the egg bacon spam and sausage without the spam then?Waitress:Urgghh!Wife:What do you mean 'Urgghh'? I don't like spam!Vikings:Lovely spam! Wonderful spam!Waitress:Shutup!Vikings:Lovely spam! Wonderful spam!Waitress:Shut up! (Vikings stop) Bloody Vikings! You can't have egg bacon spam and sausage without the spam.Wife:I don't like spam!Man:Sshh, dear, don't cause a fuss. I'll have your spam. I love it. I'm having spam spamspamspamspamspamspam beaked beans spam spamspam and spam!Vikings:Spam spam spamspam. Lovely spam! Wonderful spam!Waitress:Shut up!! Baked beans are off.Man:Well could I have her spam instead of the baked beans then?Waitress:You mean spam spamspamspamspamspam... (but it is too late and the Vikings drown her words)Vikings:(Singing elaborately...) Spam spamspamspam. Lovely spam! Wonderful spam! Spam spa-a-a-a-a-am spam spa-a-a-a-a-am spam. Lovely spam! Lovely spam! Lovely spam! Lovely spam! Lovely spam! Spam spamspamspam!