SlideShare a Scribd company logo
Quick Tips to Get Started
Making Websites Accessible to
People with Disabilities
Our goals today
• Take a snapshot of web accessibility – what is it,
why does it matter?
• Identify essential techniques
• Answer questions
• Point to what’s next
Facilitated by…
• Sharron Rush, co-founder, Executive Director
Knowbility Inc
• Invited Expert since 2006 for W3C Web Accessibility
Initiative (WAI)
• Currently co-chair for Education and Outreach
Working Group (EOWG)
• Author Maximum Accessibility (2002)
Hi there!
The Web is meant to transcend
barriers
Regardless of differences …
• platform
• operating system
• formats
• browser
• device
• distance
• language
• ability
Web Accessibility Initiative at
W3C
• W3C is global standards maker for the web
• Develop technical standards
• Including accessibility guidelines:
• Content (WCAG)
• Authoring tools (ATAG)
• Browsers and AT (UAAG)
• Dynamic applications (ARIA)
W3C Web Accessibility Initiative logo
Fireman grips firehose
with huge output of
letters of regulations and
guidelines NIMC, DAISY,
WCAG, ATAG. 508, etc –
don’t be overwhelmed!
Accessible
People with disabilities
…can acquire the same information
…participate in the same activities
…actively produce as well as
consume online content
Why advocate for accessibility?
Legal
Technical
Market
Humanitarian
It’s all about People
Short videos from WAI
10 videos with optional captions and
audio description
Four Principles of accessible content
Perceivable, operable, understandable and robust. Cartoon shows four colorful characters. First is a man with dark glasses saying “I can
perceive it.” Next a fellow with one arm in a sling who says “I can use it,” then a woman with a lightbulb over her head saying “I can
grasp it,” and finally a woman holding a smart phone saying “I can access it.”
…across the broadest possible
spectrum
Common Barriers
• Structure
• Reading order
• Keyboard
• Text alternatives
• Color and contrast
• Link text
• Multi-media
Structure
• Use semantic structures as intended
• Use for semantic meaning, not visual presentation
• Explicit form id and label
• Outline structure with HTML 5 regions or ARIA landmarks
Reading and focus order
• Reading order reflects code order
• Logical tab order – top to bottom, left to right
• Page titles uniquely describe page content
• Alerts and error messages receive focus.
Visible Keyboard Operation
• Allow all functional elements to be reached
and activated from the keyboard
(often tab and arrow keys)
• Make keyboard focus as clearly visible as
mouse hover states
Text alternative basics
All image elements must have alt text
(alt attribute of img element)
• Brief informative descriptions for meaningful images
• Empty alt attribute <alt=“”> for decorative images
– or use CSS background
• Identify target of linked images
• Fully describe complex images like charts, graphs
• Decision tree from WAI Tutorial
Color and contrast
 Avoid using color as
ONLY method to denote
a state or requirement
 Provide contrast of text
against background of
4.5 to 1 or higher
Link text
• Specify link target (where the link goes, what it does)
• Text should make sense out of context (not “More” or
“Click here”)
- OR -
• Use aria-describedby to make an association available
to assistive technology
Media
• Keyboard operable media player
• Caption audio content of video and synchronize to
onscreen actions
• Describe meaningful video content in audio
description track or text transcript.
Preliminary Testing
• During develop, QA etc, include accessibility testing
• Easy Checks from W3C
Include People with
disability in usability
tests
• Reach out locally to disability
organizations
• Remote testing using
AccessWorks
Learn so much more from WAI!
• Tips for getting Started
Get started with accessibility. These tips introduce
some basic considerations for making your website
more accessible to people with disabilities, and provide
links to additional guidance.
Tips for Writing, Developing and Design for web
accessibility
https://www.w3.org/WAI/gettingstarted/tips/index.html
Participate …
Community events and programs centered around
equal access
• Accessibility Internet Rally – accessible web
development contest benefits global nonprofits
• AccessWorks – remote user test employs people with
disabilities
• ATSTAR helps teachers apply assistive tech to improve
learning outcomes for kids with disability.
Thank you!
Sharron Rush
srush@knowbility.or
g
@knowbility
@addthis

More Related Content

What's hot

Web Accessibility Testing With Axe
Web Accessibility Testing With AxeWeb Accessibility Testing With Axe
Web Accessibility Testing With Axe
Aparna A Gopalakrishnan
 
Basics of Web Accessibility
Basics of Web AccessibilityBasics of Web Accessibility
Basics of Web Accessibility
Moin Shaikh
 
Accessibility for Fun and Profit
Accessibility for Fun and ProfitAccessibility for Fun and Profit
Accessibility for Fun and Profit
Mike Wilcox
 
Web Accessibility
Web AccessibilityWeb Accessibility
Understanding Web Accessibility
Understanding Web AccessibilityUnderstanding Web Accessibility
Understanding Web Accessibility
Andrea Dubravsky
 
Web Accessibility
Web AccessibilityWeb Accessibility
Web Accessibility
Amal Abduallah
 
Empathy training & the accessible web experience
Empathy training & the accessible web experienceEmpathy training & the accessible web experience
Empathy training & the accessible web experience
Media Access Australia
 
Accessibility
AccessibilityAccessibility
Accessibility
Elizabeth Chesters
 
Accessibility: Proven, easy integration into design and development workflows
Accessibility: Proven, easy integration into design and development workflowsAccessibility: Proven, easy integration into design and development workflows
Accessibility: Proven, easy integration into design and development workflows
Robert Jolly
 
How to create accessible websites - WordCamp Boston
How to create accessible websites - WordCamp BostonHow to create accessible websites - WordCamp Boston
How to create accessible websites - WordCamp Boston
Rachel Cherry
 
Build Accessibly - Community Day 2012
Build Accessibly - Community Day 2012Build Accessibly - Community Day 2012
Build Accessibly - Community Day 2012
Karen Mardahl
 
Web Accessibility 101
Web Accessibility 101Web Accessibility 101
Web Accessibility 101
Eric Malcolm
 
Web accessibility 101: The why, who, what, and how of "a11y"
Web accessibility 101: The why, who, what, and how of "a11y"Web accessibility 101: The why, who, what, and how of "a11y"
Web accessibility 101: The why, who, what, and how of "a11y"
ecentricarts
 
Marketing Without Barriers: Considering Digital Accessibility for Customers a...
Marketing Without Barriers: Considering Digital Accessibility for Customers a...Marketing Without Barriers: Considering Digital Accessibility for Customers a...
Marketing Without Barriers: Considering Digital Accessibility for Customers a...
Whole Brain Group, LLC
 
Designing Inclusive Experiences to Maximize Reach and Satisfaction
Designing Inclusive Experiences to Maximize Reach and SatisfactionDesigning Inclusive Experiences to Maximize Reach and Satisfaction
Designing Inclusive Experiences to Maximize Reach and Satisfaction
Windows Developer
 
Web Accessibility Top 10 - LCC (1/2 day workshop, August 2013)
Web Accessibility Top 10 - LCC (1/2 day workshop, August 2013)Web Accessibility Top 10 - LCC (1/2 day workshop, August 2013)
Web Accessibility Top 10 - LCC (1/2 day workshop, August 2013)
Carrie Anton
 
Understanding and Supporting Web Accessibility
Understanding and Supporting Web AccessibilityUnderstanding and Supporting Web Accessibility
Understanding and Supporting Web Accessibility
Rachel Cherry
 
Including Everyone: Web Accessibility 101
Including Everyone: Web Accessibility 101Including Everyone: Web Accessibility 101
Including Everyone: Web Accessibility 101
Helena Zubkow
 
Introduction to Accessibility
Introduction to AccessibilityIntroduction to Accessibility
Introduction to Accessibility
Elizabeth Gray
 
How to engineer accessible websites
How to engineer accessible websitesHow to engineer accessible websites
How to engineer accessible websites
Rachel Cherry
 

What's hot (20)

Web Accessibility Testing With Axe
Web Accessibility Testing With AxeWeb Accessibility Testing With Axe
Web Accessibility Testing With Axe
 
Basics of Web Accessibility
Basics of Web AccessibilityBasics of Web Accessibility
Basics of Web Accessibility
 
Accessibility for Fun and Profit
Accessibility for Fun and ProfitAccessibility for Fun and Profit
Accessibility for Fun and Profit
 
Web Accessibility
Web AccessibilityWeb Accessibility
Web Accessibility
 
Understanding Web Accessibility
Understanding Web AccessibilityUnderstanding Web Accessibility
Understanding Web Accessibility
 
Web Accessibility
Web AccessibilityWeb Accessibility
Web Accessibility
 
Empathy training & the accessible web experience
Empathy training & the accessible web experienceEmpathy training & the accessible web experience
Empathy training & the accessible web experience
 
Accessibility
AccessibilityAccessibility
Accessibility
 
Accessibility: Proven, easy integration into design and development workflows
Accessibility: Proven, easy integration into design and development workflowsAccessibility: Proven, easy integration into design and development workflows
Accessibility: Proven, easy integration into design and development workflows
 
How to create accessible websites - WordCamp Boston
How to create accessible websites - WordCamp BostonHow to create accessible websites - WordCamp Boston
How to create accessible websites - WordCamp Boston
 
Build Accessibly - Community Day 2012
Build Accessibly - Community Day 2012Build Accessibly - Community Day 2012
Build Accessibly - Community Day 2012
 
Web Accessibility 101
Web Accessibility 101Web Accessibility 101
Web Accessibility 101
 
Web accessibility 101: The why, who, what, and how of "a11y"
Web accessibility 101: The why, who, what, and how of "a11y"Web accessibility 101: The why, who, what, and how of "a11y"
Web accessibility 101: The why, who, what, and how of "a11y"
 
Marketing Without Barriers: Considering Digital Accessibility for Customers a...
Marketing Without Barriers: Considering Digital Accessibility for Customers a...Marketing Without Barriers: Considering Digital Accessibility for Customers a...
Marketing Without Barriers: Considering Digital Accessibility for Customers a...
 
Designing Inclusive Experiences to Maximize Reach and Satisfaction
Designing Inclusive Experiences to Maximize Reach and SatisfactionDesigning Inclusive Experiences to Maximize Reach and Satisfaction
Designing Inclusive Experiences to Maximize Reach and Satisfaction
 
Web Accessibility Top 10 - LCC (1/2 day workshop, August 2013)
Web Accessibility Top 10 - LCC (1/2 day workshop, August 2013)Web Accessibility Top 10 - LCC (1/2 day workshop, August 2013)
Web Accessibility Top 10 - LCC (1/2 day workshop, August 2013)
 
Understanding and Supporting Web Accessibility
Understanding and Supporting Web AccessibilityUnderstanding and Supporting Web Accessibility
Understanding and Supporting Web Accessibility
 
Including Everyone: Web Accessibility 101
Including Everyone: Web Accessibility 101Including Everyone: Web Accessibility 101
Including Everyone: Web Accessibility 101
 
Introduction to Accessibility
Introduction to AccessibilityIntroduction to Accessibility
Introduction to Accessibility
 
How to engineer accessible websites
How to engineer accessible websitesHow to engineer accessible websites
How to engineer accessible websites
 

Viewers also liked

How to Successfully Run Your First Website A/B Test
How to Successfully Run Your First Website A/B TestHow to Successfully Run Your First Website A/B Test
How to Successfully Run Your First Website A/B Test
Kissmetrics on SlideShare
 
Web Trends 2016
Web Trends 2016Web Trends 2016
Web Trends 2016
Tom Osborne
 
What is KISSmetrics?
What is KISSmetrics?What is KISSmetrics?
What is KISSmetrics?
Kissmetrics on SlideShare
 
Tips for Making Your Website Load Faster
Tips for Making Your Website Load FasterTips for Making Your Website Load Faster
Tips for Making Your Website Load Faster
AddThis
 
How ClickMechanic Grew Conversions by 20% with Kissmetrics
How ClickMechanic Grew Conversions by 20% with KissmetricsHow ClickMechanic Grew Conversions by 20% with Kissmetrics
How ClickMechanic Grew Conversions by 20% with Kissmetrics
Kissmetrics on SlideShare
 
10 Tips for Creating Accessible Web Content with WCAG 2.0
10 Tips for Creating Accessible Web Content with WCAG 2.010 Tips for Creating Accessible Web Content with WCAG 2.0
10 Tips for Creating Accessible Web Content with WCAG 2.0
3Play Media
 
How to Develop Your Mobile Strategy
How to Develop Your Mobile StrategyHow to Develop Your Mobile Strategy
How to Develop Your Mobile Strategy
AddThis
 
How to Build Data-Driven B2B Growth Strategies
How to Build Data-Driven B2B Growth StrategiesHow to Build Data-Driven B2B Growth Strategies
How to Build Data-Driven B2B Growth Strategies
Kissmetrics on SlideShare
 
Key CRO Metrics to Analyze for Successful Landing Pages
Key CRO Metrics to Analyze for Successful Landing PagesKey CRO Metrics to Analyze for Successful Landing Pages
Key CRO Metrics to Analyze for Successful Landing Pages
Kissmetrics on SlideShare
 
Applying Data Science to Social Proof
Applying Data Science to Social ProofApplying Data Science to Social Proof
Applying Data Science to Social Proof
Kissmetrics on SlideShare
 
The PPC Traffic Thermometer - Why You Should Care About Ice Cubes & Lava
The PPC Traffic Thermometer - Why You Should Care About Ice Cubes & LavaThe PPC Traffic Thermometer - Why You Should Care About Ice Cubes & Lava
The PPC Traffic Thermometer - Why You Should Care About Ice Cubes & Lava
Kissmetrics on SlideShare
 
Exponential Growth: Using Data to Drive Customer Ascension
Exponential Growth: Using Data to Drive Customer AscensionExponential Growth: Using Data to Drive Customer Ascension
Exponential Growth: Using Data to Drive Customer Ascension
Kissmetrics on SlideShare
 
Think Like Your Visitors to Increase Website Conversions
Think Like Your Visitors to Increase Website ConversionsThink Like Your Visitors to Increase Website Conversions
Think Like Your Visitors to Increase Website Conversions
Erik Johnson
 

Viewers also liked (13)

How to Successfully Run Your First Website A/B Test
How to Successfully Run Your First Website A/B TestHow to Successfully Run Your First Website A/B Test
How to Successfully Run Your First Website A/B Test
 
Web Trends 2016
Web Trends 2016Web Trends 2016
Web Trends 2016
 
What is KISSmetrics?
What is KISSmetrics?What is KISSmetrics?
What is KISSmetrics?
 
Tips for Making Your Website Load Faster
Tips for Making Your Website Load FasterTips for Making Your Website Load Faster
Tips for Making Your Website Load Faster
 
How ClickMechanic Grew Conversions by 20% with Kissmetrics
How ClickMechanic Grew Conversions by 20% with KissmetricsHow ClickMechanic Grew Conversions by 20% with Kissmetrics
How ClickMechanic Grew Conversions by 20% with Kissmetrics
 
10 Tips for Creating Accessible Web Content with WCAG 2.0
10 Tips for Creating Accessible Web Content with WCAG 2.010 Tips for Creating Accessible Web Content with WCAG 2.0
10 Tips for Creating Accessible Web Content with WCAG 2.0
 
How to Develop Your Mobile Strategy
How to Develop Your Mobile StrategyHow to Develop Your Mobile Strategy
How to Develop Your Mobile Strategy
 
How to Build Data-Driven B2B Growth Strategies
How to Build Data-Driven B2B Growth StrategiesHow to Build Data-Driven B2B Growth Strategies
How to Build Data-Driven B2B Growth Strategies
 
Key CRO Metrics to Analyze for Successful Landing Pages
Key CRO Metrics to Analyze for Successful Landing PagesKey CRO Metrics to Analyze for Successful Landing Pages
Key CRO Metrics to Analyze for Successful Landing Pages
 
Applying Data Science to Social Proof
Applying Data Science to Social ProofApplying Data Science to Social Proof
Applying Data Science to Social Proof
 
The PPC Traffic Thermometer - Why You Should Care About Ice Cubes & Lava
The PPC Traffic Thermometer - Why You Should Care About Ice Cubes & LavaThe PPC Traffic Thermometer - Why You Should Care About Ice Cubes & Lava
The PPC Traffic Thermometer - Why You Should Care About Ice Cubes & Lava
 
Exponential Growth: Using Data to Drive Customer Ascension
Exponential Growth: Using Data to Drive Customer AscensionExponential Growth: Using Data to Drive Customer Ascension
Exponential Growth: Using Data to Drive Customer Ascension
 
Think Like Your Visitors to Increase Website Conversions
Think Like Your Visitors to Increase Website ConversionsThink Like Your Visitors to Increase Website Conversions
Think Like Your Visitors to Increase Website Conversions
 

Similar to Making Websites Accessible to People with Disabilities

Accessibility Isn’t Enough - Designing Digital Properties to be Usable and Ac...
Accessibility Isn’t Enough - Designing Digital Properties to be Usable and Ac...Accessibility Isn’t Enough - Designing Digital Properties to be Usable and Ac...
Accessibility Isn’t Enough - Designing Digital Properties to be Usable and Ac...
UserZoom
 
Accessibility pitch-deck
Accessibility pitch-deckAccessibility pitch-deck
Accessibility pitch-deck
Karthikeyan Dhanasekaran CUA
 
Accessibilitytesting public
Accessibilitytesting publicAccessibilitytesting public
Accessibilitytesting public
Sivaprasad Paliyath (CUA - HFI)
 
Tear Down This Wall! Removing Boundaries to Create an Accessible Website
Tear Down This Wall! Removing Boundaries to Create an Accessible WebsiteTear Down This Wall! Removing Boundaries to Create an Accessible Website
Tear Down This Wall! Removing Boundaries to Create an Accessible Website
Sarah Joy Arnold
 
Web Accessibility and why we need it
Web Accessibility and why we need itWeb Accessibility and why we need it
Web Accessibility and why we need it
Genevieve Nelson
 
Web Accessibility and Design
Web Accessibility and DesignWeb Accessibility and Design
Web Accessibility and Design
colinbdclark
 
Designing Accessible Drupal Themes
Designing Accessible Drupal ThemesDesigning Accessible Drupal Themes
Designing Accessible Drupal Themes
Heather Wozniak
 
Introduction to accessibility
Introduction to accessibilityIntroduction to accessibility
Introduction to accessibility
Joseph McLarty
 
People First Accessibility
People First AccessibilityPeople First Accessibility
People First Accessibility
Trisha Salas
 
Accessibility & Inclusive Design to Enable Success
Accessibility & Inclusive Design to Enable Success Accessibility & Inclusive Design to Enable Success
Accessibility & Inclusive Design to Enable Success
Jacqueline L. Frank
 
Webinar - Web Accessibility 101 - 2016-08-09
Webinar - Web Accessibility 101 - 2016-08-09Webinar - Web Accessibility 101 - 2016-08-09
Webinar - Web Accessibility 101 - 2016-08-09
TechSoup
 
Using Web 2.0 Tools inside Brightspace with an Eye on Accessibility
Using Web 2.0 Tools inside Brightspacewith an Eye on AccessibilityUsing Web 2.0 Tools inside Brightspacewith an Eye on Accessibility
Using Web 2.0 Tools inside Brightspace with an Eye on Accessibility
D2L Barry
 
Improving Your Website's Accessibility
Improving Your Website's AccessibilityImproving Your Website's Accessibility
Accessibility and why it matters
Accessibility and why it mattersAccessibility and why it matters
Accessibility and why it matters
Margarida Sousa
 
Wave training
Wave trainingWave training
Wave training
Sean Yo
 
The what, why, and how of accessibility
The what, why, and how of accessibilityThe what, why, and how of accessibility
The what, why, and how of accessibility
3Play Media
 
Prototyping Accessibility: Booster 2019
Prototyping Accessibility: Booster 2019Prototyping Accessibility: Booster 2019
Prototyping Accessibility: Booster 2019
Adrian Roselli
 
Accessibility Best Practices for Online Learning Content
Accessibility Best Practices for Online Learning ContentAccessibility Best Practices for Online Learning Content
Accessibility Best Practices for Online Learning Content
Jacqueline L. Frank
 
Accessibility Tips: How to create accessible learning content
Accessibility Tips: How to create accessible learning contentAccessibility Tips: How to create accessible learning content
Accessibility Tips: How to create accessible learning content
Jacqueline L. Frank
 
Accessibility Quick Wins
Accessibility Quick WinsAccessibility Quick Wins
Accessibility Quick Wins
Jeff Reynolds
 

Similar to Making Websites Accessible to People with Disabilities (20)

Accessibility Isn’t Enough - Designing Digital Properties to be Usable and Ac...
Accessibility Isn’t Enough - Designing Digital Properties to be Usable and Ac...Accessibility Isn’t Enough - Designing Digital Properties to be Usable and Ac...
Accessibility Isn’t Enough - Designing Digital Properties to be Usable and Ac...
 
Accessibility pitch-deck
Accessibility pitch-deckAccessibility pitch-deck
Accessibility pitch-deck
 
Accessibilitytesting public
Accessibilitytesting publicAccessibilitytesting public
Accessibilitytesting public
 
Tear Down This Wall! Removing Boundaries to Create an Accessible Website
Tear Down This Wall! Removing Boundaries to Create an Accessible WebsiteTear Down This Wall! Removing Boundaries to Create an Accessible Website
Tear Down This Wall! Removing Boundaries to Create an Accessible Website
 
Web Accessibility and why we need it
Web Accessibility and why we need itWeb Accessibility and why we need it
Web Accessibility and why we need it
 
Web Accessibility and Design
Web Accessibility and DesignWeb Accessibility and Design
Web Accessibility and Design
 
Designing Accessible Drupal Themes
Designing Accessible Drupal ThemesDesigning Accessible Drupal Themes
Designing Accessible Drupal Themes
 
Introduction to accessibility
Introduction to accessibilityIntroduction to accessibility
Introduction to accessibility
 
People First Accessibility
People First AccessibilityPeople First Accessibility
People First Accessibility
 
Accessibility & Inclusive Design to Enable Success
Accessibility & Inclusive Design to Enable Success Accessibility & Inclusive Design to Enable Success
Accessibility & Inclusive Design to Enable Success
 
Webinar - Web Accessibility 101 - 2016-08-09
Webinar - Web Accessibility 101 - 2016-08-09Webinar - Web Accessibility 101 - 2016-08-09
Webinar - Web Accessibility 101 - 2016-08-09
 
Using Web 2.0 Tools inside Brightspace with an Eye on Accessibility
Using Web 2.0 Tools inside Brightspacewith an Eye on AccessibilityUsing Web 2.0 Tools inside Brightspacewith an Eye on Accessibility
Using Web 2.0 Tools inside Brightspace with an Eye on Accessibility
 
Improving Your Website's Accessibility
Improving Your Website's AccessibilityImproving Your Website's Accessibility
Improving Your Website's Accessibility
 
Accessibility and why it matters
Accessibility and why it mattersAccessibility and why it matters
Accessibility and why it matters
 
Wave training
Wave trainingWave training
Wave training
 
The what, why, and how of accessibility
The what, why, and how of accessibilityThe what, why, and how of accessibility
The what, why, and how of accessibility
 
Prototyping Accessibility: Booster 2019
Prototyping Accessibility: Booster 2019Prototyping Accessibility: Booster 2019
Prototyping Accessibility: Booster 2019
 
Accessibility Best Practices for Online Learning Content
Accessibility Best Practices for Online Learning ContentAccessibility Best Practices for Online Learning Content
Accessibility Best Practices for Online Learning Content
 
Accessibility Tips: How to create accessible learning content
Accessibility Tips: How to create accessible learning contentAccessibility Tips: How to create accessible learning content
Accessibility Tips: How to create accessible learning content
 
Accessibility Quick Wins
Accessibility Quick WinsAccessibility Quick Wins
Accessibility Quick Wins
 

Recently uploaded

Essentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with ParametersEssentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with Parameters
Safe Software
 
The Future of Platform Engineering
The Future of Platform EngineeringThe Future of Platform Engineering
The Future of Platform Engineering
Jemma Hussein Allen
 
When stars align: studies in data quality, knowledge graphs, and machine lear...
When stars align: studies in data quality, knowledge graphs, and machine lear...When stars align: studies in data quality, knowledge graphs, and machine lear...
When stars align: studies in data quality, knowledge graphs, and machine lear...
Elena Simperl
 
ODC, Data Fabric and Architecture User Group
ODC, Data Fabric and Architecture User GroupODC, Data Fabric and Architecture User Group
ODC, Data Fabric and Architecture User Group
CatarinaPereira64715
 
Search and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical FuturesSearch and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical Futures
Bhaskar Mitra
 
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Thierry Lestable
 
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptxIOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
Abida Shariff
 
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
Product School
 
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
Sri Ambati
 
Connector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a buttonConnector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a button
DianaGray10
 
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdfFIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance
 
Accelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish CachingAccelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish Caching
Thijs Feryn
 
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdfSmart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
91mobiles
 
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
UiPathCommunity
 
Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...
Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...
Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...
Product School
 
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Tobias Schneck
 
Neuro-symbolic is not enough, we need neuro-*semantic*
Neuro-symbolic is not enough, we need neuro-*semantic*Neuro-symbolic is not enough, we need neuro-*semantic*
Neuro-symbolic is not enough, we need neuro-*semantic*
Frank van Harmelen
 
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Jeffrey Haguewood
 
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Ramesh Iyer
 
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdfFIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance
 

Recently uploaded (20)

Essentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with ParametersEssentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with Parameters
 
The Future of Platform Engineering
The Future of Platform EngineeringThe Future of Platform Engineering
The Future of Platform Engineering
 
When stars align: studies in data quality, knowledge graphs, and machine lear...
When stars align: studies in data quality, knowledge graphs, and machine lear...When stars align: studies in data quality, knowledge graphs, and machine lear...
When stars align: studies in data quality, knowledge graphs, and machine lear...
 
ODC, Data Fabric and Architecture User Group
ODC, Data Fabric and Architecture User GroupODC, Data Fabric and Architecture User Group
ODC, Data Fabric and Architecture User Group
 
Search and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical FuturesSearch and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical Futures
 
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
 
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptxIOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
 
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
 
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
 
Connector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a buttonConnector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a button
 
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdfFIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
 
Accelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish CachingAccelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish Caching
 
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdfSmart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
 
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
 
Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...
Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...
Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...
 
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
 
Neuro-symbolic is not enough, we need neuro-*semantic*
Neuro-symbolic is not enough, we need neuro-*semantic*Neuro-symbolic is not enough, we need neuro-*semantic*
Neuro-symbolic is not enough, we need neuro-*semantic*
 
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
 
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
 
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdfFIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
 

Making Websites Accessible to People with Disabilities

  • 1. Quick Tips to Get Started Making Websites Accessible to People with Disabilities
  • 2. Our goals today • Take a snapshot of web accessibility – what is it, why does it matter? • Identify essential techniques • Answer questions • Point to what’s next
  • 3. Facilitated by… • Sharron Rush, co-founder, Executive Director Knowbility Inc • Invited Expert since 2006 for W3C Web Accessibility Initiative (WAI) • Currently co-chair for Education and Outreach Working Group (EOWG) • Author Maximum Accessibility (2002) Hi there!
  • 4. The Web is meant to transcend barriers Regardless of differences … • platform • operating system • formats • browser • device • distance • language • ability
  • 5. Web Accessibility Initiative at W3C • W3C is global standards maker for the web • Develop technical standards • Including accessibility guidelines: • Content (WCAG) • Authoring tools (ATAG) • Browsers and AT (UAAG) • Dynamic applications (ARIA) W3C Web Accessibility Initiative logo
  • 6. Fireman grips firehose with huge output of letters of regulations and guidelines NIMC, DAISY, WCAG, ATAG. 508, etc – don’t be overwhelmed!
  • 7. Accessible People with disabilities …can acquire the same information …participate in the same activities …actively produce as well as consume online content
  • 8. Why advocate for accessibility? Legal Technical Market Humanitarian
  • 11. 10 videos with optional captions and audio description
  • 12. Four Principles of accessible content Perceivable, operable, understandable and robust. Cartoon shows four colorful characters. First is a man with dark glasses saying “I can perceive it.” Next a fellow with one arm in a sling who says “I can use it,” then a woman with a lightbulb over her head saying “I can grasp it,” and finally a woman holding a smart phone saying “I can access it.” …across the broadest possible spectrum
  • 13. Common Barriers • Structure • Reading order • Keyboard • Text alternatives • Color and contrast • Link text • Multi-media
  • 14. Structure • Use semantic structures as intended • Use for semantic meaning, not visual presentation • Explicit form id and label • Outline structure with HTML 5 regions or ARIA landmarks
  • 15. Reading and focus order • Reading order reflects code order • Logical tab order – top to bottom, left to right • Page titles uniquely describe page content • Alerts and error messages receive focus.
  • 16. Visible Keyboard Operation • Allow all functional elements to be reached and activated from the keyboard (often tab and arrow keys) • Make keyboard focus as clearly visible as mouse hover states
  • 17. Text alternative basics All image elements must have alt text (alt attribute of img element) • Brief informative descriptions for meaningful images • Empty alt attribute <alt=“”> for decorative images – or use CSS background • Identify target of linked images • Fully describe complex images like charts, graphs • Decision tree from WAI Tutorial
  • 18. Color and contrast  Avoid using color as ONLY method to denote a state or requirement  Provide contrast of text against background of 4.5 to 1 or higher
  • 19. Link text • Specify link target (where the link goes, what it does) • Text should make sense out of context (not “More” or “Click here”) - OR - • Use aria-describedby to make an association available to assistive technology
  • 20. Media • Keyboard operable media player • Caption audio content of video and synchronize to onscreen actions • Describe meaningful video content in audio description track or text transcript.
  • 21. Preliminary Testing • During develop, QA etc, include accessibility testing • Easy Checks from W3C
  • 22. Include People with disability in usability tests • Reach out locally to disability organizations • Remote testing using AccessWorks
  • 23. Learn so much more from WAI! • Tips for getting Started Get started with accessibility. These tips introduce some basic considerations for making your website more accessible to people with disabilities, and provide links to additional guidance. Tips for Writing, Developing and Design for web accessibility https://www.w3.org/WAI/gettingstarted/tips/index.html
  • 24. Participate … Community events and programs centered around equal access • Accessibility Internet Rally – accessible web development contest benefits global nonprofits • AccessWorks – remote user test employs people with disabilities • ATSTAR helps teachers apply assistive tech to improve learning outcomes for kids with disability.

Editor's Notes

  1. Accessible vs Inclusive
  2. We often talk of accessibility in terms of adherence to standards. It is good to remember that accessibility is about inclusive design for real people with human needs
  3. Delia, Paul, Ryan, Desiree and Wayne: People with disabilities appear in collage each has access needs and may use assistive technology
  4. Useful for blind visitors and many assistive technology devices that navigate using only the keyboard.
  5. WAI website: http://www.w3.org/WAI/ Getting WAI announcements: http://www.w3.org/WAI/about/announcements Translating WAI documents: http://www.w3.org/WAI/translation Participating in WAI: http://www.w3.org/WAI/participation