Understanding Web Accessibility

Andrea Dubravsky
Andrea DubravskyWeb Strategist en ADWebcom
UNDERSTANDING WEB
ACCESSIBILITY
This presentation will help you
understand:
 The legal requirements behind Web Accessibility
 How do people with disabilities use the web and what assistive
technologies they use
 How good usability makes up for better accessibility and improves
site’ SEO
 Financial benefits of having an accessible website
Benefits of an accessible website
 Expand potential market share (1.3 million Ontarians with disabilities
+ seniors and people with cognitive problems)
 Increases findability with search engine optimization (SEO)
 Focuses on better website usability
 Increases positive company image
 Eliminates potentially high legal expenses
Purpose and legislature
 The goal of web accessibility is
to provide a better access to
information for people with
disabilities.
 The government of Ontario has
embarked on the road to make
Ontario a fully accessible
province. The new regulations
are outlined in the
Accessibility for Ontarians With
Disabilities Act (AODA)
Web Accessibility guidelines
 The actual guidelines are outlined in the
Web Content Accessibility Guidelines 2.0 (WCAG 2.0)
 These are established by the
Accessibility Initiative of the World Wide Web Consortium (W3C)
 There are three levels of accessibility
Level A,
Level AA
Level AAA
 Government of Ontario and the Legislative Assembly
 January 1, 2012
New internet and intranet websites must conform with WCAG 2.0
Level AA other than Captions (Live), and Audio Descriptions (Pre-
recorded)
 January 1, 2016
All internet websites and web content must conform with WCAG 2.0
Level AA, other than Captions (Live), and Audio Descriptions (Pre-
recorded).
 January 1, 2020
All internet and intranet websites and web content must conform with
WCAG 2.0 Level AA
AODA - timelines to meet the
requirements
 Public sector organizations, businesses and non-profit
organizations (50+ staff)
 January 1, 2014
All new websites must conform with Web Content Accessibility
Guidelines, Level A
 January 1, 2021
All websites must conform with Web Content Accessibility Guidelines,
Level A A
other than Captions (Live)
and Audio Descriptions (Pre-recorded)
AODA - timelines to meet the
requirements
Who are the people with
disabilities?
Unless we understand how
people with disabilities navigate
websites and what assistive
technologies they use, we
cannot build accessible
websites.
There are four main groups of
disabilities:
visual
audio
motor
cognitive
Visually impaired use screen
magnifying software or screen
readers such as Jaws.
Screen readers read websites in a
linear order - from top to bottom, left
to right. Remember this when
building the information structure of
the website.
Blind, low vision, color-blind
Braille devices allow blind users
read websites.
Just like search engines, screen
readers and Braille devices can
only interpret written text.
Provide alt text for all non-text
elements. This is one of the main
accessibility requirements that will
also improve your site’s SEO.
Blind, low vision, color-blind
Deaf or hard-of-hearing
Users can read text but require
captions and transcript to
interpret audio and video
content.
Always provide transcription for
video and audio content.
Transcriptions add keyword-rich
content to your site which improves
your SEO.
Limited fine motor skills, slow
response time
Trackball mouse is used by
people with shaky hands or
arthritis.
These can be people with
disabilities but also many seniors.
Some people use mouse stick to
tap and navigate sites via
keyboard.
Think about the effort it takes to
navigate the website.
Limited fine motor skills, slow
response time
Head wand works in a similar
way and again, requires
enormous effort to tap through
the website.
Websites must be keyboard
accessible. Aim for a minimum
amount of clicks required to get to
information.
Limited fine motor skills, slow
response time
If a person can move only the
head he can tap on a switch
placed to the side of the head.
The switch connects to a software
that navigates the site.
Limited fine motor skills, slow
response time
Sip and puff device can interpret
users breath patterns to navigate
the web
Limited fine motor skills, slow
response time
Keep in mind that common tasks
take disabled users longer to
complete for. Make sure they are
able extend the time limit e.g. when
filling-out forms.
Eye tracking software follows the
movement of the eye and allows
the person to navigate websites.
Limited fine motor skills, slow
response time
In the past, people with disabilities
depended on others to read them a
paper of fill out an application.
Assistive technologies give them
great independence.
Learning disabilities, distractibility,
inability to remember or focus
 Good usability is paramount for
web accessibility
 People who have problems
using websites that are overly
complex or poorly organized
 Website must be logically
organized, easy to navigate,
written in simple language
 No objects flashing more than
3x per second as it can cause
epileptic seizures
The key web accessibility principles
Perceivable
Content is readable for assistive technologies
Graphics and images have alt text
Audio and video content is accompanied by transcript or captions
Operable
Website is keyboard accessible
It is easy to navigate
Users have enough time to read and use content
Does not cause seizures
Understandable
Structure is logical and follows linear order
Does not contain extraneous text
Robust
Website does not require specific technology and can be used by
assistive technologies
The key web accessibility principles
Perceivable
provide alt text for non-text elements
E.g. alt text for this image would
be:
“venus project by jacques
fresco”
When graphics contain useful
information have this info available in
text form
E.g. Use longdesc=http://www.website.com/graph_explanation
or describe the graphic as part of the content
Do not use alt text for decorative
images
E.g. This image has no meaning
so the alt text should be empty “
“ Our business promises the best
service you will find on the planet.
Our team is professionally trained to
offer excellent customer service
throughout the contract negotiation
process.
Customer satisfaction is our top
priority and is guaranteed, or your
money back.”
Do not rely on color to carry out
meaning
Do not use color to emphasize required
fields in forms
Accessible forms
 Screen readers read forms in linear order
 Form must be keyboard accessible
 Keep labels close to the fields
 Ask for minimum info – too much info means a lot of effort
 Help correct errors
 When offering options (radio buttons, checkboxes) keep them close
together
Use proper color contrast
Contrast ratio for normal-size text should be at least 4.5:1
Operable
 Website is keyboard accessible
 Users can increase font size and adjust color contrast
 Avoid splash pages and intro music
(interfere with screen readers)
 Content does not open in new window
(users can’t find way back)
 Content does not change without direct input
(avoid pop-up windows)
Understandable
 Website is logically organized
 Home page should confirm the company name and the purpose of
the website
 Website with extensive navigation allows for “skip to content”
 Menus have descriptive titles
 Internal pages have consistent layout
Website copy
 Main titles are in H1 heading, are
meaningful and contain keywords
 Subheadings are in H2 heading,
meaningful and contain keywords
 Content is further divided into blocks or
paragraphs constructed around a single
major idea
 Aim for 9th
grade reading skills
 Write clearly using short sentences
Using H1, H2, H3 …
headings helps on-site
SEO and allows users to
scan through the content
as screen readers can be
set to read headings only.
Simple language leads to
better usability and SEO.
 Avoid acronyms and abbreviations;
or explain them
 Avoid slang, industry jargon or
marketing fluff
 Use active voice, use positive terms
 Ensure that every word and
paragraph is necessary
 Give direct instructions
Simple writing helps people
with cognitive problems
better understand the
website. Clear language is
greatly appreciated by most
people.
Website copy
Notice the descriptive menu items, meaningful links and intro
paragraphs on this government website.
Links
 Avoid ‘click here’, ‘go’, ‘read more’ or
images as links as they do not make
sense out of context
 Create meaningful links within text
 Differentiate links
by color and underline
 Don’t place
more than 20 links on a page
 Use enough space between links
Users can have the screen
readers read only the links.
Therefore, links have to
make sense out of context.
Sufficient space, large font,
underlining make clicking on
the link easier.
Meaningful, keyword-rich
links also help your SEO.
Links
Let’s sum up the benefits of an
accessible website
 Expand potential market share. It is estimated that 20% of population
have some kind of disability. These are potential customers.
 Improve your positions in search results (SEO)
 Better website usability
 Positive company image
 Eliminate potentially high legal expenses
 And most importantly – it’s the right thing to do
Penalties for non-compliance with
AODA
Individuals or unincorporated organizations
Impact of
Contravention:
Major Moderate Minor
Major $2,000 $1,000 $500
Moderate $1,000 $500 $250
Minor $500 $250 $200
Corporations
Impact of
Contravention:
Major Moderate Minor
Major $15,000 $10,000 $5,000
Moderate $10,000 $5,000 $2,500
Minor $2,000 $1,000 $500
Tools and resources
 http://webaim.org/
 http://www.w3.org/WAI/
 http://wave.webaim.org/
 http://www.checkmycolours.com/
 http://juicystudio.com/services/luminositycontrastratio.php
#specify
Andrea Dubravsky
www.adwebcom.com
info@adwebcom.com
Phone: 289 428 1100
1 de 38

Recomendados

Understanding and Supporting Web Accessibility por
Understanding and Supporting Web AccessibilityUnderstanding and Supporting Web Accessibility
Understanding and Supporting Web AccessibilityRachel Cherry
4.9K vistas54 diapositivas
Website Accessibility por
Website AccessibilityWebsite Accessibility
Website AccessibilityNishan Bose
1.7K vistas30 diapositivas
Introduction To Web Accessibility por
Introduction To Web AccessibilityIntroduction To Web Accessibility
Introduction To Web AccessibilitySteven Swafford
11K vistas24 diapositivas
Web accessibility por
Web accessibilityWeb accessibility
Web accessibilityPatrick Broens
2.5K vistas28 diapositivas
Basics of Web Accessibility por
Basics of Web AccessibilityBasics of Web Accessibility
Basics of Web AccessibilityMoin Shaikh
520 vistas66 diapositivas
Web accessibility por
Web accessibilityWeb accessibility
Web accessibilityAGILEDROP
9.3K vistas27 diapositivas

Más contenido relacionado

La actualidad más candente

Web accessibility: it’s everyone’s responsibility por
Web accessibility: it’s everyone’s responsibilityWeb accessibility: it’s everyone’s responsibility
Web accessibility: it’s everyone’s responsibilityMedia Access Australia
1.7K vistas26 diapositivas
Web Accessibility por
Web AccessibilityWeb Accessibility
Web AccessibilityZoe Gillenwater
2K vistas65 diapositivas
Web accessibility 101: The why, who, what, and how of "a11y" por
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
4.3K vistas65 diapositivas
A Web for Everyone: Accessibility as a design challenge por
A Web for Everyone: Accessibility as a design challengeA Web for Everyone: Accessibility as a design challenge
A Web for Everyone: Accessibility as a design challengeWhitney Quesenbery
32K vistas41 diapositivas
Accessibilitytesting public por
Accessibilitytesting publicAccessibilitytesting public
Accessibilitytesting publicSivaprasad Paliyath (CUA - HFI)
441 vistas20 diapositivas
Design for accessibility por
Design for accessibilityDesign for accessibility
Design for accessibilityYogeshDaphane
317 vistas28 diapositivas

La actualidad más candente(20)

Web accessibility 101: The why, who, what, and how of "a11y" por ecentricarts
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"
ecentricarts4.3K vistas
A Web for Everyone: Accessibility as a design challenge por Whitney Quesenbery
A Web for Everyone: Accessibility as a design challengeA Web for Everyone: Accessibility as a design challenge
A Web for Everyone: Accessibility as a design challenge
Whitney Quesenbery32K vistas
Design for accessibility por YogeshDaphane
Design for accessibilityDesign for accessibility
Design for accessibility
YogeshDaphane317 vistas
What is accessibility? por Russ Weakley
What is accessibility?What is accessibility?
What is accessibility?
Russ Weakley5.3K vistas
Accessibility Testing 101 por Patrick Dunphy
Accessibility Testing 101Accessibility Testing 101
Accessibility Testing 101
Patrick Dunphy4.3K vistas
What Is Accessibility Testing? por QA InfoTech
What Is Accessibility Testing?What Is Accessibility Testing?
What Is Accessibility Testing?
QA InfoTech3.2K vistas
ADA Compliance and Website Accessibility por SilverTech
ADA Compliance and Website AccessibilityADA Compliance and Website Accessibility
ADA Compliance and Website Accessibility
SilverTech558 vistas
Accessible Design Presentation por Topher Kanyuga
Accessible Design PresentationAccessible Design Presentation
Accessible Design Presentation
Topher Kanyuga824 vistas
Design for Accessibility por qixingz
Design for AccessibilityDesign for Accessibility
Design for Accessibility
qixingz5K vistas

Destacado

Empathy training & the accessible web experience por
Empathy training & the accessible web experienceEmpathy training & the accessible web experience
Empathy training & the accessible web experienceMedia Access Australia
1.1K vistas24 diapositivas
Web a11y beyond guidelines por
Web a11y beyond guidelinesWeb a11y beyond guidelines
Web a11y beyond guidelinesrach123
805 vistas16 diapositivas
Web accessibility testing methodologies, tools and tips por
Web accessibility testing methodologies, tools and tipsWeb accessibility testing methodologies, tools and tips
Web accessibility testing methodologies, tools and tipsHenny Swan
2.2K vistas48 diapositivas
Introduction to Accessibility Testing - CSUN14 por
Introduction to Accessibility Testing - CSUN14Introduction to Accessibility Testing - CSUN14
Introduction to Accessibility Testing - CSUN14Patrick Dunphy
5.4K vistas55 diapositivas
Social networking presentation por
Social networking presentationSocial networking presentation
Social networking presentationuarkgradstudent
29.9K vistas36 diapositivas
Social Networking Presentation por
Social Networking PresentationSocial Networking Presentation
Social Networking PresentationAnusorn Kansap
153.2K vistas22 diapositivas

Destacado(9)

Web a11y beyond guidelines por rach123
Web a11y beyond guidelinesWeb a11y beyond guidelines
Web a11y beyond guidelines
rach123805 vistas
Web accessibility testing methodologies, tools and tips por Henny Swan
Web accessibility testing methodologies, tools and tipsWeb accessibility testing methodologies, tools and tips
Web accessibility testing methodologies, tools and tips
Henny Swan2.2K vistas
Introduction to Accessibility Testing - CSUN14 por Patrick Dunphy
Introduction to Accessibility Testing - CSUN14Introduction to Accessibility Testing - CSUN14
Introduction to Accessibility Testing - CSUN14
Patrick Dunphy5.4K vistas
Social networking presentation por uarkgradstudent
Social networking presentationSocial networking presentation
Social networking presentation
uarkgradstudent29.9K vistas
Social Networking Presentation por Anusorn Kansap
Social Networking PresentationSocial Networking Presentation
Social Networking Presentation
Anusorn Kansap153.2K vistas
The 10 responsibilities of marketing departments por Sales Layer
The 10 responsibilities of marketing departmentsThe 10 responsibilities of marketing departments
The 10 responsibilities of marketing departments
Sales Layer190.6K vistas
Case Study: Mastering digital disruption in retail por Scopernia
Case Study: Mastering digital disruption in retailCase Study: Mastering digital disruption in retail
Case Study: Mastering digital disruption in retail
Scopernia80.3K vistas

Similar a Understanding Web Accessibility

Web Accessibility por
Web AccessibilityWeb Accessibility
Web AccessibilityADA Site Compliance
6 vistas6 diapositivas
Silicon Halton Meetup 57 - Website Accessibility por
Silicon Halton  Meetup 57 - Website Accessibility Silicon Halton  Meetup 57 - Website Accessibility
Silicon Halton Meetup 57 - Website Accessibility Silicon Halton
983 vistas54 diapositivas
corePHP Usability Accessibility by Steven Pignataro por
corePHP Usability Accessibility by Steven PignatarocorePHP Usability Accessibility by Steven Pignataro
corePHP Usability Accessibility by Steven PignataroJohn Coonen
1.1K vistas60 diapositivas
SEO through Accessibility- How designing accessible websites leads to automat... por
SEO through Accessibility- How designing accessible websites leads to automat...SEO through Accessibility- How designing accessible websites leads to automat...
SEO through Accessibility- How designing accessible websites leads to automat...Abhay Rautela
6.7K vistas37 diapositivas
RBC Royal Bank : An Accessibility Evaluation & Recommendations por
RBC Royal Bank : An Accessibility Evaluation & RecommendationsRBC Royal Bank : An Accessibility Evaluation & Recommendations
RBC Royal Bank : An Accessibility Evaluation & RecommendationsSivaprasad Paliyath (CUA - HFI)
533 vistas32 diapositivas
Skip to Content ↵ENTER Skip to Menu ↵ENTER Skip to Footer ↵ por
 Skip to Content ↵ENTER   Skip to Menu ↵ENTER   Skip to Footer ↵ Skip to Content ↵ENTER   Skip to Menu ↵ENTER   Skip to Footer ↵
Skip to Content ↵ENTER Skip to Menu ↵ENTER Skip to Footer ↵MoseStaton39
4 vistas53 diapositivas

Similar a Understanding Web Accessibility(20)

Silicon Halton Meetup 57 - Website Accessibility por Silicon Halton
Silicon Halton  Meetup 57 - Website Accessibility Silicon Halton  Meetup 57 - Website Accessibility
Silicon Halton Meetup 57 - Website Accessibility
Silicon Halton983 vistas
corePHP Usability Accessibility by Steven Pignataro por John Coonen
corePHP Usability Accessibility by Steven PignatarocorePHP Usability Accessibility by Steven Pignataro
corePHP Usability Accessibility by Steven Pignataro
John Coonen1.1K vistas
SEO through Accessibility- How designing accessible websites leads to automat... por Abhay Rautela
SEO through Accessibility- How designing accessible websites leads to automat...SEO through Accessibility- How designing accessible websites leads to automat...
SEO through Accessibility- How designing accessible websites leads to automat...
Abhay Rautela6.7K vistas
Skip to Content ↵ENTER Skip to Menu ↵ENTER Skip to Footer ↵ por MoseStaton39
 Skip to Content ↵ENTER   Skip to Menu ↵ENTER   Skip to Footer ↵ Skip to Content ↵ENTER   Skip to Menu ↵ENTER   Skip to Footer ↵
Skip to Content ↵ENTER Skip to Menu ↵ENTER Skip to Footer ↵
MoseStaton394 vistas
Accessibility and why it matters por Margarida Sousa
Accessibility and why it mattersAccessibility and why it matters
Accessibility and why it matters
Margarida Sousa311 vistas
Web accessibility: An overview por Webcredible
Web accessibility: An overviewWeb accessibility: An overview
Web accessibility: An overview
Webcredible831 vistas
Website usability ideas for business growth por James Smith
Website usability ideas for business growthWebsite usability ideas for business growth
Website usability ideas for business growth
James Smith615 vistas
A11yLDN 2011 - Introduction to Web Accessibility por Graham Armfield
A11yLDN 2011 - Introduction to Web AccessibilityA11yLDN 2011 - Introduction to Web Accessibility
A11yLDN 2011 - Introduction to Web Accessibility
Graham Armfield929 vistas
Basic webpage layout and design por Andz Bass
Basic webpage layout and designBasic webpage layout and design
Basic webpage layout and design
Andz Bass836 vistas
User Experience and Accessibility - BrightonSEO March 2021 por Niki Mosier
User Experience and Accessibility  - BrightonSEO March 2021User Experience and Accessibility  - BrightonSEO March 2021
User Experience and Accessibility - BrightonSEO March 2021
Niki Mosier1.2K vistas
Intro to Web Accessibility por Ashley Dzick
Intro to Web Accessibility Intro to Web Accessibility
Intro to Web Accessibility
Ashley Dzick89 vistas
Marketing in the disability services sector por samantha singer
Marketing in the disability services sectorMarketing in the disability services sector
Marketing in the disability services sector
samantha singer115 vistas
Guide to Designing a User Friendly Website por Aciron Consulting
Guide to Designing a User Friendly Website Guide to Designing a User Friendly Website
Guide to Designing a User Friendly Website
Aciron Consulting102 vistas

Último

PORTFOLIO 1 (Bret Michael Pepito).pdf por
PORTFOLIO 1 (Bret Michael Pepito).pdfPORTFOLIO 1 (Bret Michael Pepito).pdf
PORTFOLIO 1 (Bret Michael Pepito).pdfbrejess0410
8 vistas6 diapositivas
Marketing and Community Building in Web3 por
Marketing and Community Building in Web3Marketing and Community Building in Web3
Marketing and Community Building in Web3Federico Ast
12 vistas64 diapositivas
Building trust in our information ecosystem: who do we trust in an emergency por
Building trust in our information ecosystem: who do we trust in an emergencyBuilding trust in our information ecosystem: who do we trust in an emergency
Building trust in our information ecosystem: who do we trust in an emergencyTina Purnat
106 vistas18 diapositivas
WEB 2.O TOOLS: Empowering education.pptx por
WEB 2.O TOOLS: Empowering education.pptxWEB 2.O TOOLS: Empowering education.pptx
WEB 2.O TOOLS: Empowering education.pptxnarmadhamanohar21
16 vistas16 diapositivas
Affiliate Marketing por
Affiliate MarketingAffiliate Marketing
Affiliate MarketingNavin Dhanuka
16 vistas30 diapositivas
Is Entireweb better than Google por
Is Entireweb better than GoogleIs Entireweb better than Google
Is Entireweb better than Googlesebastianthomasbejan
12 vistas1 diapositiva

Último(9)

PORTFOLIO 1 (Bret Michael Pepito).pdf por brejess0410
PORTFOLIO 1 (Bret Michael Pepito).pdfPORTFOLIO 1 (Bret Michael Pepito).pdf
PORTFOLIO 1 (Bret Michael Pepito).pdf
brejess04108 vistas
Marketing and Community Building in Web3 por Federico Ast
Marketing and Community Building in Web3Marketing and Community Building in Web3
Marketing and Community Building in Web3
Federico Ast12 vistas
Building trust in our information ecosystem: who do we trust in an emergency por Tina Purnat
Building trust in our information ecosystem: who do we trust in an emergencyBuilding trust in our information ecosystem: who do we trust in an emergency
Building trust in our information ecosystem: who do we trust in an emergency
Tina Purnat106 vistas
How to think like a threat actor for Kubernetes.pptx por LibbySchulze1
How to think like a threat actor for Kubernetes.pptxHow to think like a threat actor for Kubernetes.pptx
How to think like a threat actor for Kubernetes.pptx
LibbySchulze15 vistas
IETF 118: Starlink Protocol Performance por APNIC
IETF 118: Starlink Protocol PerformanceIETF 118: Starlink Protocol Performance
IETF 118: Starlink Protocol Performance
APNIC354 vistas

Understanding Web Accessibility

  • 2. This presentation will help you understand:  The legal requirements behind Web Accessibility  How do people with disabilities use the web and what assistive technologies they use  How good usability makes up for better accessibility and improves site’ SEO  Financial benefits of having an accessible website
  • 3. Benefits of an accessible website  Expand potential market share (1.3 million Ontarians with disabilities + seniors and people with cognitive problems)  Increases findability with search engine optimization (SEO)  Focuses on better website usability  Increases positive company image  Eliminates potentially high legal expenses
  • 4. Purpose and legislature  The goal of web accessibility is to provide a better access to information for people with disabilities.  The government of Ontario has embarked on the road to make Ontario a fully accessible province. The new regulations are outlined in the Accessibility for Ontarians With Disabilities Act (AODA)
  • 5. Web Accessibility guidelines  The actual guidelines are outlined in the Web Content Accessibility Guidelines 2.0 (WCAG 2.0)  These are established by the Accessibility Initiative of the World Wide Web Consortium (W3C)  There are three levels of accessibility Level A, Level AA Level AAA
  • 6.  Government of Ontario and the Legislative Assembly  January 1, 2012 New internet and intranet websites must conform with WCAG 2.0 Level AA other than Captions (Live), and Audio Descriptions (Pre- recorded)  January 1, 2016 All internet websites and web content must conform with WCAG 2.0 Level AA, other than Captions (Live), and Audio Descriptions (Pre- recorded).  January 1, 2020 All internet and intranet websites and web content must conform with WCAG 2.0 Level AA AODA - timelines to meet the requirements
  • 7.  Public sector organizations, businesses and non-profit organizations (50+ staff)  January 1, 2014 All new websites must conform with Web Content Accessibility Guidelines, Level A  January 1, 2021 All websites must conform with Web Content Accessibility Guidelines, Level A A other than Captions (Live) and Audio Descriptions (Pre-recorded) AODA - timelines to meet the requirements
  • 8. Who are the people with disabilities? Unless we understand how people with disabilities navigate websites and what assistive technologies they use, we cannot build accessible websites. There are four main groups of disabilities: visual audio motor cognitive
  • 9. Visually impaired use screen magnifying software or screen readers such as Jaws. Screen readers read websites in a linear order - from top to bottom, left to right. Remember this when building the information structure of the website. Blind, low vision, color-blind
  • 10. Braille devices allow blind users read websites. Just like search engines, screen readers and Braille devices can only interpret written text. Provide alt text for all non-text elements. This is one of the main accessibility requirements that will also improve your site’s SEO. Blind, low vision, color-blind
  • 11. Deaf or hard-of-hearing Users can read text but require captions and transcript to interpret audio and video content. Always provide transcription for video and audio content. Transcriptions add keyword-rich content to your site which improves your SEO.
  • 12. Limited fine motor skills, slow response time Trackball mouse is used by people with shaky hands or arthritis. These can be people with disabilities but also many seniors.
  • 13. Some people use mouse stick to tap and navigate sites via keyboard. Think about the effort it takes to navigate the website. Limited fine motor skills, slow response time
  • 14. Head wand works in a similar way and again, requires enormous effort to tap through the website. Websites must be keyboard accessible. Aim for a minimum amount of clicks required to get to information. Limited fine motor skills, slow response time
  • 15. If a person can move only the head he can tap on a switch placed to the side of the head. The switch connects to a software that navigates the site. Limited fine motor skills, slow response time
  • 16. Sip and puff device can interpret users breath patterns to navigate the web Limited fine motor skills, slow response time Keep in mind that common tasks take disabled users longer to complete for. Make sure they are able extend the time limit e.g. when filling-out forms.
  • 17. Eye tracking software follows the movement of the eye and allows the person to navigate websites. Limited fine motor skills, slow response time In the past, people with disabilities depended on others to read them a paper of fill out an application. Assistive technologies give them great independence.
  • 18. Learning disabilities, distractibility, inability to remember or focus  Good usability is paramount for web accessibility  People who have problems using websites that are overly complex or poorly organized  Website must be logically organized, easy to navigate, written in simple language  No objects flashing more than 3x per second as it can cause epileptic seizures
  • 19. The key web accessibility principles Perceivable Content is readable for assistive technologies Graphics and images have alt text Audio and video content is accompanied by transcript or captions Operable Website is keyboard accessible It is easy to navigate Users have enough time to read and use content Does not cause seizures
  • 20. Understandable Structure is logical and follows linear order Does not contain extraneous text Robust Website does not require specific technology and can be used by assistive technologies The key web accessibility principles
  • 21. Perceivable provide alt text for non-text elements E.g. alt text for this image would be: “venus project by jacques fresco”
  • 22. When graphics contain useful information have this info available in text form E.g. Use longdesc=http://www.website.com/graph_explanation or describe the graphic as part of the content
  • 23. Do not use alt text for decorative images E.g. This image has no meaning so the alt text should be empty “ “ Our business promises the best service you will find on the planet. Our team is professionally trained to offer excellent customer service throughout the contract negotiation process. Customer satisfaction is our top priority and is guaranteed, or your money back.”
  • 24. Do not rely on color to carry out meaning
  • 25. Do not use color to emphasize required fields in forms
  • 26. Accessible forms  Screen readers read forms in linear order  Form must be keyboard accessible  Keep labels close to the fields  Ask for minimum info – too much info means a lot of effort  Help correct errors  When offering options (radio buttons, checkboxes) keep them close together
  • 27. Use proper color contrast Contrast ratio for normal-size text should be at least 4.5:1
  • 28. Operable  Website is keyboard accessible  Users can increase font size and adjust color contrast  Avoid splash pages and intro music (interfere with screen readers)  Content does not open in new window (users can’t find way back)  Content does not change without direct input (avoid pop-up windows)
  • 29. Understandable  Website is logically organized  Home page should confirm the company name and the purpose of the website  Website with extensive navigation allows for “skip to content”  Menus have descriptive titles  Internal pages have consistent layout
  • 30. Website copy  Main titles are in H1 heading, are meaningful and contain keywords  Subheadings are in H2 heading, meaningful and contain keywords  Content is further divided into blocks or paragraphs constructed around a single major idea  Aim for 9th grade reading skills  Write clearly using short sentences Using H1, H2, H3 … headings helps on-site SEO and allows users to scan through the content as screen readers can be set to read headings only. Simple language leads to better usability and SEO.
  • 31.  Avoid acronyms and abbreviations; or explain them  Avoid slang, industry jargon or marketing fluff  Use active voice, use positive terms  Ensure that every word and paragraph is necessary  Give direct instructions Simple writing helps people with cognitive problems better understand the website. Clear language is greatly appreciated by most people. Website copy
  • 32. Notice the descriptive menu items, meaningful links and intro paragraphs on this government website.
  • 33. Links  Avoid ‘click here’, ‘go’, ‘read more’ or images as links as they do not make sense out of context  Create meaningful links within text  Differentiate links by color and underline  Don’t place more than 20 links on a page  Use enough space between links Users can have the screen readers read only the links. Therefore, links have to make sense out of context. Sufficient space, large font, underlining make clicking on the link easier. Meaningful, keyword-rich links also help your SEO.
  • 34. Links
  • 35. Let’s sum up the benefits of an accessible website  Expand potential market share. It is estimated that 20% of population have some kind of disability. These are potential customers.  Improve your positions in search results (SEO)  Better website usability  Positive company image  Eliminate potentially high legal expenses  And most importantly – it’s the right thing to do
  • 36. Penalties for non-compliance with AODA Individuals or unincorporated organizations Impact of Contravention: Major Moderate Minor Major $2,000 $1,000 $500 Moderate $1,000 $500 $250 Minor $500 $250 $200 Corporations Impact of Contravention: Major Moderate Minor Major $15,000 $10,000 $5,000 Moderate $10,000 $5,000 $2,500 Minor $2,000 $1,000 $500
  • 37. Tools and resources  http://webaim.org/  http://www.w3.org/WAI/  http://wave.webaim.org/  http://www.checkmycolours.com/  http://juicystudio.com/services/luminositycontrastratio.php #specify