SlideShare a Scribd company logo
WordCampUK 2010 Building for Accessibility and Getting Ready for HTML 5 Benjamin Ellis @benjaminellis |  http://benjaminellis.org http://redcatco.com  |  http://socialoptic.com http://milestoneplanner.com/
Accessibility WHY? Be a good web citizen. Legal compliance. Bigger Audience. Better design. SEO benefit.
You  Really  Should   Disability Discrimination Act 1995
NOTE: I'm Being Pragmatic 90/10 beats 100/0 every time > do something that makes a difference <
Not Just, But Also... Sight Hearing Cognitive & Learning Motor  & Mobility And degrees of severity ...there is no one answer
Even More Complexity A Huge Range of Assistive Technologies: Screen Readers Magnification Input Devices - Speech / Switch OS Built in and 3 rd  party
<em> don't Err > the world isn't one size fits all < make your design flexible > the world
Black on  Black  was cool in Hitch Hiker's Guide to the Galaxy. Not on your web site (ps search spiders hate it too) This isn't clever either...
(um... no...) Do place decorative images in the stylesheet But for many of us the visual cues are important I'VE GOT TEXT ONLY I'M GOOD TO GO, RIGHT?
Flash is evil right? Only if you are Steve Jobs Abode have some great features and guidelines, but it does take time and effort!
Running the Race Twice Or run it once. Well.
Guidelines   Web Content Accessibility Guidelines  WCAG 1.0 http://www.w3.org/TR/WCAG20/ but start with:  http://www.w3.org/TR/UNDERSTANDING-WCAG20/ Or maybe try:  http://www.w3.org/WAI/WCAG20/quickref/ Disability Rights Commission (DRC):  Pas 78   Don't lose the will to live!
when the cat comes out the play LWOAM
when the cat comes out the play LWOAM (life without a mouse) Tab index Hovers Access keys
Vague Heuristics look at: your lowest screen resolution black and white without CSS At the source Do you lose the will to live?
Web 2.0 AJAX and all that stuff...
Web 2.0 AJAX and all that stuff... invisible /confusing to screen readers Practice graceful degradation  (Progressive enhancement)
Web 2.0 HTML 5 http://slides.html5rocks.com/
HTML You're doing it already (mostly) Video/Audio (WebM) Page Structure Lots of CSS shiny shiny
WordCampUK 2010 Building for Accessibility and Getting Ready for HTML 5 Benjamin Ellis @benjaminellis |  http://benjaminellis.org http://redcatco.com  |  http://socialoptic.com http://milestoneplanner.com/

More Related Content

What's hot

Senior Exhibition Demo
Senior Exhibition DemoSenior Exhibition Demo
Senior Exhibition Demo
dalep35
 
How you can become an Accessibility Superhero
How you can become an Accessibility SuperheroHow you can become an Accessibility Superhero
How you can become an Accessibility Superhero
robzonenet
 
New Tools for Teachers: Glasgow NQT's
New Tools for Teachers: Glasgow NQT'sNew Tools for Teachers: Glasgow NQT's
New Tools for Teachers: Glasgow NQT's
Ollie Bray
 
Computers of the future
Computers of the futureComputers of the future
Computers of the future
hector082894
 
C 1
C 1C 1
Ei ux through usability testing
Ei ux through usability testingEi ux through usability testing
Ei ux through usability testing
Krista Godfrey
 
Tech comm video
Tech comm videoTech comm video
Tech comm video
Matt Sullivan
 
2017 smartphones scratchconf Budapest
2017 smartphones scratchconf Budapest2017 smartphones scratchconf Budapest
2017 smartphones scratchconf Budapest
Balazs Koren
 
Using Technology to Work Collboratively
Using Technology to Work CollborativelyUsing Technology to Work Collboratively
Using Technology to Work Collboratively
Sarah Glassmeyer
 
Take care of your pixel
Take care of your pixelTake care of your pixel
Take care of your pixel
Davide Di Pumpo
 
GoCoding.Today For Rails - Episode1
GoCoding.Today For Rails - Episode1GoCoding.Today For Rails - Episode1
GoCoding.Today For Rails - Episode1
Brian Hu
 
Unit 9 lesson a
Unit 9  lesson aUnit 9  lesson a
Unit 9 lesson a
watler
 
First Presentation
First PresentationFirst Presentation
First Presentation
Mindy Sullivan
 
Mac book procedures
Mac book proceduresMac book procedures
Mac book procedures
Daniel Gibson
 
Presentación
PresentaciónPresentación
Presentación
Pilar P.C.
 
Will iPads Replace Laptops?
Will iPads Replace Laptops?Will iPads Replace Laptops?
Will iPads Replace Laptops?
Bethany Smith
 
Erase and Rewind - Open Web Camp 2015
Erase and Rewind - Open Web Camp 2015Erase and Rewind - Open Web Camp 2015
Erase and Rewind - Open Web Camp 2015
Christian Heilmann
 
Introduction to Video for Nonprofits
Introduction to Video for NonprofitsIntroduction to Video for Nonprofits
Introduction to Video for Nonprofits
See3 Communications
 
Dream or nightmare
Dream or nightmareDream or nightmare
Dream or nightmare
Genegame1
 

What's hot (19)

Senior Exhibition Demo
Senior Exhibition DemoSenior Exhibition Demo
Senior Exhibition Demo
 
How you can become an Accessibility Superhero
How you can become an Accessibility SuperheroHow you can become an Accessibility Superhero
How you can become an Accessibility Superhero
 
New Tools for Teachers: Glasgow NQT's
New Tools for Teachers: Glasgow NQT'sNew Tools for Teachers: Glasgow NQT's
New Tools for Teachers: Glasgow NQT's
 
Computers of the future
Computers of the futureComputers of the future
Computers of the future
 
C 1
C 1C 1
C 1
 
Ei ux through usability testing
Ei ux through usability testingEi ux through usability testing
Ei ux through usability testing
 
Tech comm video
Tech comm videoTech comm video
Tech comm video
 
2017 smartphones scratchconf Budapest
2017 smartphones scratchconf Budapest2017 smartphones scratchconf Budapest
2017 smartphones scratchconf Budapest
 
Using Technology to Work Collboratively
Using Technology to Work CollborativelyUsing Technology to Work Collboratively
Using Technology to Work Collboratively
 
Take care of your pixel
Take care of your pixelTake care of your pixel
Take care of your pixel
 
GoCoding.Today For Rails - Episode1
GoCoding.Today For Rails - Episode1GoCoding.Today For Rails - Episode1
GoCoding.Today For Rails - Episode1
 
Unit 9 lesson a
Unit 9  lesson aUnit 9  lesson a
Unit 9 lesson a
 
First Presentation
First PresentationFirst Presentation
First Presentation
 
Mac book procedures
Mac book proceduresMac book procedures
Mac book procedures
 
Presentación
PresentaciónPresentación
Presentación
 
Will iPads Replace Laptops?
Will iPads Replace Laptops?Will iPads Replace Laptops?
Will iPads Replace Laptops?
 
Erase and Rewind - Open Web Camp 2015
Erase and Rewind - Open Web Camp 2015Erase and Rewind - Open Web Camp 2015
Erase and Rewind - Open Web Camp 2015
 
Introduction to Video for Nonprofits
Introduction to Video for NonprofitsIntroduction to Video for Nonprofits
Introduction to Video for Nonprofits
 
Dream or nightmare
Dream or nightmareDream or nightmare
Dream or nightmare
 

Viewers also liked

L'opportunità di un mercato e l'incontro con lo strumento giusto
 L'opportunità di un mercato e l'incontro con lo strumento giusto L'opportunità di un mercato e l'incontro con lo strumento giusto
L'opportunità di un mercato e l'incontro con lo strumento giusto
RILEVANT
 
flyer support
flyer supportflyer support
flyer support
Realty Gold World
 
Plaquetteb2c english
Plaquetteb2c englishPlaquetteb2c english
Plaquetteb2c english
Realty Gold World
 
Magazine world is magnifique sept oct 2015
Magazine world is magnifique sept oct 2015Magazine world is magnifique sept oct 2015
Magazine world is magnifique sept oct 2015
Realty Gold World
 
Magazine world is magnifique march 2015
Magazine world is magnifique march 2015Magazine world is magnifique march 2015
Magazine world is magnifique march 2015
Realty Gold World
 
Magazine world is magnifique dec 2014
Magazine world is magnifique dec 2014Magazine world is magnifique dec 2014
Magazine world is magnifique dec 2014
Realty Gold World
 
Accessibility Workshop
Accessibility WorkshopAccessibility Workshop
Accessibility Workshop
Lar Veale
 
Accessibility With WordPress: Accessing Higher Ground 2014
Accessibility With WordPress: Accessing Higher Ground 2014Accessibility With WordPress: Accessing Higher Ground 2014
Accessibility With WordPress: Accessing Higher Ground 2014
Joseph Dolson
 
Kill Accessibility
Kill AccessibilityKill Accessibility
Kill Accessibility
Gary Barber
 
Web Accessibility Workshop
Web Accessibility WorkshopWeb Accessibility Workshop
Web Accessibility Workshop
josodo
 
Applying WAI-ARIA to open-source CMS widgets - practical application and resu...
Applying WAI-ARIA to open-source CMS widgets - practical application and resu...Applying WAI-ARIA to open-source CMS widgets - practical application and resu...
Applying WAI-ARIA to open-source CMS widgets - practical application and resu...
AEGIS-ACCESSIBLE Projects
 
Accessibility 101 @ Webmontag Frankfurt Ignite, 2010-03-01
Accessibility 101 @ Webmontag Frankfurt Ignite, 2010-03-01Accessibility 101 @ Webmontag Frankfurt Ignite, 2010-03-01
Accessibility 101 @ Webmontag Frankfurt Ignite, 2010-03-01
Eric Eggert
 
Building in Accessibility Throughout Your Project Lifecycle
Building in Accessibility Throughout Your Project LifecycleBuilding in Accessibility Throughout Your Project Lifecycle
Building in Accessibility Throughout Your Project Lifecycle
Angela M. Hooker
 
How to improve SEO & accessibility through your CMS
How to improve SEO & accessibility through your CMSHow to improve SEO & accessibility through your CMS
How to improve SEO & accessibility through your CMS
VYRE
 
HTML 5 & Accessibility
HTML 5 & Accessibility HTML 5 & Accessibility
HTML 5 & Accessibility
Ted Drake
 
Real World Web Accessibility
Real World Web AccessibilityReal World Web Accessibility
Real World Web Accessibility
Sean Yo
 
Designing for Accessibility
Designing for AccessibilityDesigning for Accessibility
Designing for Accessibility
Dan Mouyard
 
Best of the web - accessibility & ell - Fall 2013
Best of the web - accessibility & ell - Fall 2013Best of the web - accessibility & ell - Fall 2013
Best of the web - accessibility & ell - Fall 2013
Richard Byrne
 
Web Standards, HTML 5 & Accessibility - What makes a site accessible today?
Web Standards, HTML 5 & Accessibility - What makes a site accessible today?Web Standards, HTML 5 & Accessibility - What makes a site accessible today?
Web Standards, HTML 5 & Accessibility - What makes a site accessible today?
Ted Drake
 

Viewers also liked (20)

L'opportunità di un mercato e l'incontro con lo strumento giusto
 L'opportunità di un mercato e l'incontro con lo strumento giusto L'opportunità di un mercato e l'incontro con lo strumento giusto
L'opportunità di un mercato e l'incontro con lo strumento giusto
 
flyer support
flyer supportflyer support
flyer support
 
Plaquetteb2c english
Plaquetteb2c englishPlaquetteb2c english
Plaquetteb2c english
 
Magazine world is magnifique sept oct 2015
Magazine world is magnifique sept oct 2015Magazine world is magnifique sept oct 2015
Magazine world is magnifique sept oct 2015
 
Magazine world is magnifique march 2015
Magazine world is magnifique march 2015Magazine world is magnifique march 2015
Magazine world is magnifique march 2015
 
Magazine world is magnifique dec 2014
Magazine world is magnifique dec 2014Magazine world is magnifique dec 2014
Magazine world is magnifique dec 2014
 
Presentation geneva it
Presentation geneva itPresentation geneva it
Presentation geneva it
 
Accessibility Workshop
Accessibility WorkshopAccessibility Workshop
Accessibility Workshop
 
Accessibility With WordPress: Accessing Higher Ground 2014
Accessibility With WordPress: Accessing Higher Ground 2014Accessibility With WordPress: Accessing Higher Ground 2014
Accessibility With WordPress: Accessing Higher Ground 2014
 
Kill Accessibility
Kill AccessibilityKill Accessibility
Kill Accessibility
 
Web Accessibility Workshop
Web Accessibility WorkshopWeb Accessibility Workshop
Web Accessibility Workshop
 
Applying WAI-ARIA to open-source CMS widgets - practical application and resu...
Applying WAI-ARIA to open-source CMS widgets - practical application and resu...Applying WAI-ARIA to open-source CMS widgets - practical application and resu...
Applying WAI-ARIA to open-source CMS widgets - practical application and resu...
 
Accessibility 101 @ Webmontag Frankfurt Ignite, 2010-03-01
Accessibility 101 @ Webmontag Frankfurt Ignite, 2010-03-01Accessibility 101 @ Webmontag Frankfurt Ignite, 2010-03-01
Accessibility 101 @ Webmontag Frankfurt Ignite, 2010-03-01
 
Building in Accessibility Throughout Your Project Lifecycle
Building in Accessibility Throughout Your Project LifecycleBuilding in Accessibility Throughout Your Project Lifecycle
Building in Accessibility Throughout Your Project Lifecycle
 
How to improve SEO & accessibility through your CMS
How to improve SEO & accessibility through your CMSHow to improve SEO & accessibility through your CMS
How to improve SEO & accessibility through your CMS
 
HTML 5 & Accessibility
HTML 5 & Accessibility HTML 5 & Accessibility
HTML 5 & Accessibility
 
Real World Web Accessibility
Real World Web AccessibilityReal World Web Accessibility
Real World Web Accessibility
 
Designing for Accessibility
Designing for AccessibilityDesigning for Accessibility
Designing for Accessibility
 
Best of the web - accessibility & ell - Fall 2013
Best of the web - accessibility & ell - Fall 2013Best of the web - accessibility & ell - Fall 2013
Best of the web - accessibility & ell - Fall 2013
 
Web Standards, HTML 5 & Accessibility - What makes a site accessible today?
Web Standards, HTML 5 & Accessibility - What makes a site accessible today?Web Standards, HTML 5 & Accessibility - What makes a site accessible today?
Web Standards, HTML 5 & Accessibility - What makes a site accessible today?
 

Similar to WordCamp UK - Accessibility and HTML 5

The Ajax Experience: State Of The Browsers
The Ajax Experience: State Of The BrowsersThe Ajax Experience: State Of The Browsers
The Ajax Experience: State Of The Browsers
Peter-Paul Koch
 
Georgia Tech hacking Accessibility
Georgia Tech hacking AccessibilityGeorgia Tech hacking Accessibility
Georgia Tech hacking Accessibility
Christian Heilmann
 
Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"
Fwdays
 
WebMatrix jQuery Mobile Web
WebMatrix jQuery Mobile WebWebMatrix jQuery Mobile Web
WebMatrix jQuery Mobile Web
Chris Love
 
A Period of Transition
A Period of TransitionA Period of Transition
A Period of Transition
Jens Grochtdreis
 
Why HTML5 is getting on my nerves…
Why HTML5 is getting on my nerves…Why HTML5 is getting on my nerves…
Why HTML5 is getting on my nerves…
Avenga Germany GmbH
 
Accessibility Usability Professional Summry
Accessibility Usability Professional SummryAccessibility Usability Professional Summry
Accessibility Usability Professional Summry
Sur College of Applied Sciences
 
RWD in the Wild
RWD in the WildRWD in the Wild
RWD in the Wild
Rich Quick
 
Tech 20 Session 10
Tech 20 Session 10Tech 20 Session 10
Tech 20 Session 10
Greg Dhuyvetter
 
Targeting Screens with HTML5, Flash & Native
Targeting Screens with HTML5, Flash & NativeTargeting Screens with HTML5, Flash & Native
Targeting Screens with HTML5, Flash & Native
Eric Fickes
 
"Probably, Maybe, No: The State of HTML5 Audio" - Scott Schiller
"Probably, Maybe, No: The State of HTML5 Audio" - Scott Schiller"Probably, Maybe, No: The State of HTML5 Audio" - Scott Schiller
"Probably, Maybe, No: The State of HTML5 Audio" - Scott Schiller
scottschiller
 
HTML 5 vs. Native Mobile Applications
HTML 5 vs. Native Mobile ApplicationsHTML 5 vs. Native Mobile Applications
HTML 5 vs. Native Mobile Applications
glenn.kelman
 
Open and Accessible UI
Open and Accessible UIOpen and Accessible UI
Open and Accessible UI
Mark Meeker
 
Next Generation Apps with Google Chrome-By Dhruv Gohil
Next Generation Apps with Google Chrome-By Dhruv GohilNext Generation Apps with Google Chrome-By Dhruv Gohil
Next Generation Apps with Google Chrome-By Dhruv Gohil
Hardik Upadhyay
 
The road to professional web development
The road to professional web developmentThe road to professional web development
The road to professional web development
Christian Heilmann
 
Reasons to be cheerful - Fronteers 2010
Reasons to be cheerful - Fronteers 2010Reasons to be cheerful - Fronteers 2010
Reasons to be cheerful - Fronteers 2010
Christian Heilmann
 
Closing the gap between Web and Desktop with WinRT
Closing the gap between Web and Desktop with WinRTClosing the gap between Web and Desktop with WinRT
Closing the gap between Web and Desktop with WinRT
Einar Ingebrigtsen
 
Progressing JavaScript and Apps the Web way…
 Progressing JavaScript and Apps the Web way…  Progressing JavaScript and Apps the Web way…
Progressing JavaScript and Apps the Web way…
Christian Heilmann
 
Fashion & Luxury Masterclass 28th Oct 2014 - Acquia: Rise of experience web
Fashion & Luxury Masterclass 28th Oct 2014 - Acquia: Rise of experience webFashion & Luxury Masterclass 28th Oct 2014 - Acquia: Rise of experience web
Fashion & Luxury Masterclass 28th Oct 2014 - Acquia: Rise of experience web
Acquia
 
Creating Your Own Personal Learning Network
Creating Your Own Personal Learning NetworkCreating Your Own Personal Learning Network
Creating Your Own Personal Learning Network
Carl Keller
 

Similar to WordCamp UK - Accessibility and HTML 5 (20)

The Ajax Experience: State Of The Browsers
The Ajax Experience: State Of The BrowsersThe Ajax Experience: State Of The Browsers
The Ajax Experience: State Of The Browsers
 
Georgia Tech hacking Accessibility
Georgia Tech hacking AccessibilityGeorgia Tech hacking Accessibility
Georgia Tech hacking Accessibility
 
Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"
 
WebMatrix jQuery Mobile Web
WebMatrix jQuery Mobile WebWebMatrix jQuery Mobile Web
WebMatrix jQuery Mobile Web
 
A Period of Transition
A Period of TransitionA Period of Transition
A Period of Transition
 
Why HTML5 is getting on my nerves…
Why HTML5 is getting on my nerves…Why HTML5 is getting on my nerves…
Why HTML5 is getting on my nerves…
 
Accessibility Usability Professional Summry
Accessibility Usability Professional SummryAccessibility Usability Professional Summry
Accessibility Usability Professional Summry
 
RWD in the Wild
RWD in the WildRWD in the Wild
RWD in the Wild
 
Tech 20 Session 10
Tech 20 Session 10Tech 20 Session 10
Tech 20 Session 10
 
Targeting Screens with HTML5, Flash & Native
Targeting Screens with HTML5, Flash & NativeTargeting Screens with HTML5, Flash & Native
Targeting Screens with HTML5, Flash & Native
 
"Probably, Maybe, No: The State of HTML5 Audio" - Scott Schiller
"Probably, Maybe, No: The State of HTML5 Audio" - Scott Schiller"Probably, Maybe, No: The State of HTML5 Audio" - Scott Schiller
"Probably, Maybe, No: The State of HTML5 Audio" - Scott Schiller
 
HTML 5 vs. Native Mobile Applications
HTML 5 vs. Native Mobile ApplicationsHTML 5 vs. Native Mobile Applications
HTML 5 vs. Native Mobile Applications
 
Open and Accessible UI
Open and Accessible UIOpen and Accessible UI
Open and Accessible UI
 
Next Generation Apps with Google Chrome-By Dhruv Gohil
Next Generation Apps with Google Chrome-By Dhruv GohilNext Generation Apps with Google Chrome-By Dhruv Gohil
Next Generation Apps with Google Chrome-By Dhruv Gohil
 
The road to professional web development
The road to professional web developmentThe road to professional web development
The road to professional web development
 
Reasons to be cheerful - Fronteers 2010
Reasons to be cheerful - Fronteers 2010Reasons to be cheerful - Fronteers 2010
Reasons to be cheerful - Fronteers 2010
 
Closing the gap between Web and Desktop with WinRT
Closing the gap between Web and Desktop with WinRTClosing the gap between Web and Desktop with WinRT
Closing the gap between Web and Desktop with WinRT
 
Progressing JavaScript and Apps the Web way…
 Progressing JavaScript and Apps the Web way…  Progressing JavaScript and Apps the Web way…
Progressing JavaScript and Apps the Web way…
 
Fashion & Luxury Masterclass 28th Oct 2014 - Acquia: Rise of experience web
Fashion & Luxury Masterclass 28th Oct 2014 - Acquia: Rise of experience webFashion & Luxury Masterclass 28th Oct 2014 - Acquia: Rise of experience web
Fashion & Luxury Masterclass 28th Oct 2014 - Acquia: Rise of experience web
 
Creating Your Own Personal Learning Network
Creating Your Own Personal Learning NetworkCreating Your Own Personal Learning Network
Creating Your Own Personal Learning Network
 

Recently uploaded

The Path to General-Purpose Robots - Coatue
The Path to General-Purpose Robots - CoatueThe Path to General-Purpose Robots - Coatue
The Path to General-Purpose Robots - Coatue
Razin Mustafiz
 
Finetuning GenAI For Hacking and Defending
Finetuning GenAI For Hacking and DefendingFinetuning GenAI For Hacking and Defending
Finetuning GenAI For Hacking and Defending
Priyanka Aash
 
Russian Girls Call Navi Mumbai 🎈🔥9920725232 🔥💋🎈 Provide Best And Top Girl Ser...
Russian Girls Call Navi Mumbai 🎈🔥9920725232 🔥💋🎈 Provide Best And Top Girl Ser...Russian Girls Call Navi Mumbai 🎈🔥9920725232 🔥💋🎈 Provide Best And Top Girl Ser...
Russian Girls Call Navi Mumbai 🎈🔥9920725232 🔥💋🎈 Provide Best And Top Girl Ser...
bellared2
 
Redefining Cybersecurity with AI Capabilities
Redefining Cybersecurity with AI CapabilitiesRedefining Cybersecurity with AI Capabilities
Redefining Cybersecurity with AI Capabilities
Priyanka Aash
 
Camunda Chapter NY Meetup July 2024.pptx
Camunda Chapter NY Meetup July 2024.pptxCamunda Chapter NY Meetup July 2024.pptx
Camunda Chapter NY Meetup July 2024.pptx
ZachWylie3
 
The History of Embeddings & Multimodal Embeddings
The History of Embeddings & Multimodal EmbeddingsThe History of Embeddings & Multimodal Embeddings
The History of Embeddings & Multimodal Embeddings
Zilliz
 
Uncharted Together- Navigating AI's New Frontiers in Libraries
Uncharted Together- Navigating AI's New Frontiers in LibrariesUncharted Together- Navigating AI's New Frontiers in Libraries
Uncharted Together- Navigating AI's New Frontiers in Libraries
Brian Pichman
 
Vertex AI Agent Builder - GDG Alicante - Julio 2024
Vertex AI Agent Builder - GDG Alicante - Julio 2024Vertex AI Agent Builder - GDG Alicante - Julio 2024
Vertex AI Agent Builder - GDG Alicante - Julio 2024
Nicolás Lopéz
 
UX Webinar Series: Essentials for Adopting Passkeys as the Foundation of your...
UX Webinar Series: Essentials for Adopting Passkeys as the Foundation of your...UX Webinar Series: Essentials for Adopting Passkeys as the Foundation of your...
UX Webinar Series: Essentials for Adopting Passkeys as the Foundation of your...
FIDO Alliance
 
How UiPath Discovery Suite supports identification of Agentic Process Automat...
How UiPath Discovery Suite supports identification of Agentic Process Automat...How UiPath Discovery Suite supports identification of Agentic Process Automat...
How UiPath Discovery Suite supports identification of Agentic Process Automat...
DianaGray10
 
MAKE MONEY ONLINE Unlock Your Income Potential Today.pptx
MAKE MONEY ONLINE Unlock Your Income Potential Today.pptxMAKE MONEY ONLINE Unlock Your Income Potential Today.pptx
MAKE MONEY ONLINE Unlock Your Income Potential Today.pptx
janagijoythi
 
Communications Mining Series - Zero to Hero - Session 3
Communications Mining Series - Zero to Hero - Session 3Communications Mining Series - Zero to Hero - Session 3
Communications Mining Series - Zero to Hero - Session 3
DianaGray10
 
leewayhertz.com-Generative AI tech stack Frameworks infrastructure models and...
leewayhertz.com-Generative AI tech stack Frameworks infrastructure models and...leewayhertz.com-Generative AI tech stack Frameworks infrastructure models and...
leewayhertz.com-Generative AI tech stack Frameworks infrastructure models and...
alexjohnson7307
 
Google I/O Extended Harare Merged Slides
Google I/O Extended Harare Merged SlidesGoogle I/O Extended Harare Merged Slides
Google I/O Extended Harare Merged Slides
Google Developer Group - Harare
 
Use Cases & Benefits of RPA in Manufacturing in 2024.pptx
Use Cases & Benefits of RPA in Manufacturing in 2024.pptxUse Cases & Benefits of RPA in Manufacturing in 2024.pptx
Use Cases & Benefits of RPA in Manufacturing in 2024.pptx
SynapseIndia
 
Garbage In, Garbage Out: Why poor data curation is killing your AI models (an...
Garbage In, Garbage Out: Why poor data curation is killing your AI models (an...Garbage In, Garbage Out: Why poor data curation is killing your AI models (an...
Garbage In, Garbage Out: Why poor data curation is killing your AI models (an...
Zilliz
 
Premium Girls Call Mumbai 9920725232 Unlimited Short Providing Girls Service ...
Premium Girls Call Mumbai 9920725232 Unlimited Short Providing Girls Service ...Premium Girls Call Mumbai 9920725232 Unlimited Short Providing Girls Service ...
Premium Girls Call Mumbai 9920725232 Unlimited Short Providing Girls Service ...
shanihomely
 
LeadMagnet IQ Review: Unlock the Secret to Effortless Traffic and Leads.pdf
LeadMagnet IQ Review:  Unlock the Secret to Effortless Traffic and Leads.pdfLeadMagnet IQ Review:  Unlock the Secret to Effortless Traffic and Leads.pdf
LeadMagnet IQ Review: Unlock the Secret to Effortless Traffic and Leads.pdf
SelfMade bd
 
Gen AI: Privacy Risks of Large Language Models (LLMs)
Gen AI: Privacy Risks of Large Language Models (LLMs)Gen AI: Privacy Risks of Large Language Models (LLMs)
Gen AI: Privacy Risks of Large Language Models (LLMs)
Debmalya Biswas
 
It's your unstructured data: How to get your GenAI app to production (and spe...
It's your unstructured data: How to get your GenAI app to production (and spe...It's your unstructured data: How to get your GenAI app to production (and spe...
It's your unstructured data: How to get your GenAI app to production (and spe...
Zilliz
 

Recently uploaded (20)

The Path to General-Purpose Robots - Coatue
The Path to General-Purpose Robots - CoatueThe Path to General-Purpose Robots - Coatue
The Path to General-Purpose Robots - Coatue
 
Finetuning GenAI For Hacking and Defending
Finetuning GenAI For Hacking and DefendingFinetuning GenAI For Hacking and Defending
Finetuning GenAI For Hacking and Defending
 
Russian Girls Call Navi Mumbai 🎈🔥9920725232 🔥💋🎈 Provide Best And Top Girl Ser...
Russian Girls Call Navi Mumbai 🎈🔥9920725232 🔥💋🎈 Provide Best And Top Girl Ser...Russian Girls Call Navi Mumbai 🎈🔥9920725232 🔥💋🎈 Provide Best And Top Girl Ser...
Russian Girls Call Navi Mumbai 🎈🔥9920725232 🔥💋🎈 Provide Best And Top Girl Ser...
 
Redefining Cybersecurity with AI Capabilities
Redefining Cybersecurity with AI CapabilitiesRedefining Cybersecurity with AI Capabilities
Redefining Cybersecurity with AI Capabilities
 
Camunda Chapter NY Meetup July 2024.pptx
Camunda Chapter NY Meetup July 2024.pptxCamunda Chapter NY Meetup July 2024.pptx
Camunda Chapter NY Meetup July 2024.pptx
 
The History of Embeddings & Multimodal Embeddings
The History of Embeddings & Multimodal EmbeddingsThe History of Embeddings & Multimodal Embeddings
The History of Embeddings & Multimodal Embeddings
 
Uncharted Together- Navigating AI's New Frontiers in Libraries
Uncharted Together- Navigating AI's New Frontiers in LibrariesUncharted Together- Navigating AI's New Frontiers in Libraries
Uncharted Together- Navigating AI's New Frontiers in Libraries
 
Vertex AI Agent Builder - GDG Alicante - Julio 2024
Vertex AI Agent Builder - GDG Alicante - Julio 2024Vertex AI Agent Builder - GDG Alicante - Julio 2024
Vertex AI Agent Builder - GDG Alicante - Julio 2024
 
UX Webinar Series: Essentials for Adopting Passkeys as the Foundation of your...
UX Webinar Series: Essentials for Adopting Passkeys as the Foundation of your...UX Webinar Series: Essentials for Adopting Passkeys as the Foundation of your...
UX Webinar Series: Essentials for Adopting Passkeys as the Foundation of your...
 
How UiPath Discovery Suite supports identification of Agentic Process Automat...
How UiPath Discovery Suite supports identification of Agentic Process Automat...How UiPath Discovery Suite supports identification of Agentic Process Automat...
How UiPath Discovery Suite supports identification of Agentic Process Automat...
 
MAKE MONEY ONLINE Unlock Your Income Potential Today.pptx
MAKE MONEY ONLINE Unlock Your Income Potential Today.pptxMAKE MONEY ONLINE Unlock Your Income Potential Today.pptx
MAKE MONEY ONLINE Unlock Your Income Potential Today.pptx
 
Communications Mining Series - Zero to Hero - Session 3
Communications Mining Series - Zero to Hero - Session 3Communications Mining Series - Zero to Hero - Session 3
Communications Mining Series - Zero to Hero - Session 3
 
leewayhertz.com-Generative AI tech stack Frameworks infrastructure models and...
leewayhertz.com-Generative AI tech stack Frameworks infrastructure models and...leewayhertz.com-Generative AI tech stack Frameworks infrastructure models and...
leewayhertz.com-Generative AI tech stack Frameworks infrastructure models and...
 
Google I/O Extended Harare Merged Slides
Google I/O Extended Harare Merged SlidesGoogle I/O Extended Harare Merged Slides
Google I/O Extended Harare Merged Slides
 
Use Cases & Benefits of RPA in Manufacturing in 2024.pptx
Use Cases & Benefits of RPA in Manufacturing in 2024.pptxUse Cases & Benefits of RPA in Manufacturing in 2024.pptx
Use Cases & Benefits of RPA in Manufacturing in 2024.pptx
 
Garbage In, Garbage Out: Why poor data curation is killing your AI models (an...
Garbage In, Garbage Out: Why poor data curation is killing your AI models (an...Garbage In, Garbage Out: Why poor data curation is killing your AI models (an...
Garbage In, Garbage Out: Why poor data curation is killing your AI models (an...
 
Premium Girls Call Mumbai 9920725232 Unlimited Short Providing Girls Service ...
Premium Girls Call Mumbai 9920725232 Unlimited Short Providing Girls Service ...Premium Girls Call Mumbai 9920725232 Unlimited Short Providing Girls Service ...
Premium Girls Call Mumbai 9920725232 Unlimited Short Providing Girls Service ...
 
LeadMagnet IQ Review: Unlock the Secret to Effortless Traffic and Leads.pdf
LeadMagnet IQ Review:  Unlock the Secret to Effortless Traffic and Leads.pdfLeadMagnet IQ Review:  Unlock the Secret to Effortless Traffic and Leads.pdf
LeadMagnet IQ Review: Unlock the Secret to Effortless Traffic and Leads.pdf
 
Gen AI: Privacy Risks of Large Language Models (LLMs)
Gen AI: Privacy Risks of Large Language Models (LLMs)Gen AI: Privacy Risks of Large Language Models (LLMs)
Gen AI: Privacy Risks of Large Language Models (LLMs)
 
It's your unstructured data: How to get your GenAI app to production (and spe...
It's your unstructured data: How to get your GenAI app to production (and spe...It's your unstructured data: How to get your GenAI app to production (and spe...
It's your unstructured data: How to get your GenAI app to production (and spe...
 

WordCamp UK - Accessibility and HTML 5

  • 1. WordCampUK 2010 Building for Accessibility and Getting Ready for HTML 5 Benjamin Ellis @benjaminellis | http://benjaminellis.org http://redcatco.com | http://socialoptic.com http://milestoneplanner.com/
  • 2. Accessibility WHY? Be a good web citizen. Legal compliance. Bigger Audience. Better design. SEO benefit.
  • 3. You Really Should   Disability Discrimination Act 1995
  • 4. NOTE: I'm Being Pragmatic 90/10 beats 100/0 every time > do something that makes a difference <
  • 5. Not Just, But Also... Sight Hearing Cognitive & Learning Motor & Mobility And degrees of severity ...there is no one answer
  • 6. Even More Complexity A Huge Range of Assistive Technologies: Screen Readers Magnification Input Devices - Speech / Switch OS Built in and 3 rd party
  • 7. <em> don't Err > the world isn't one size fits all < make your design flexible > the world
  • 8. Black on Black was cool in Hitch Hiker's Guide to the Galaxy. Not on your web site (ps search spiders hate it too) This isn't clever either...
  • 9. (um... no...) Do place decorative images in the stylesheet But for many of us the visual cues are important I'VE GOT TEXT ONLY I'M GOOD TO GO, RIGHT?
  • 10. Flash is evil right? Only if you are Steve Jobs Abode have some great features and guidelines, but it does take time and effort!
  • 11. Running the Race Twice Or run it once. Well.
  • 12. Guidelines   Web Content Accessibility Guidelines  WCAG 1.0 http://www.w3.org/TR/WCAG20/ but start with:  http://www.w3.org/TR/UNDERSTANDING-WCAG20/ Or maybe try:  http://www.w3.org/WAI/WCAG20/quickref/ Disability Rights Commission (DRC): Pas 78   Don't lose the will to live!
  • 13. when the cat comes out the play LWOAM
  • 14. when the cat comes out the play LWOAM (life without a mouse) Tab index Hovers Access keys
  • 15. Vague Heuristics look at: your lowest screen resolution black and white without CSS At the source Do you lose the will to live?
  • 16. Web 2.0 AJAX and all that stuff...
  • 17. Web 2.0 AJAX and all that stuff... invisible /confusing to screen readers Practice graceful degradation (Progressive enhancement)
  • 18. Web 2.0 HTML 5 http://slides.html5rocks.com/
  • 19. HTML You're doing it already (mostly) Video/Audio (WebM) Page Structure Lots of CSS shiny shiny
  • 20. WordCampUK 2010 Building for Accessibility and Getting Ready for HTML 5 Benjamin Ellis @benjaminellis | http://benjaminellis.org http://redcatco.com | http://socialoptic.com http://milestoneplanner.com/

Editor's Notes

  1. Do I need to &apos;do&apos; accessibility? The short answer is yes, you do, and for a number of reasons. Firstly, it&apos;s a basic part of being a good web citizen. You wouldn&apos;t ignore someone who came up to you in the street because they were blind or missing their arms, so why build a web site on the net that they can&apos;t get access to? Accessibility leads to better design The process of thinking through accessibility requirements leads to better design. When most people talk about website design, they tend to talk about visual design - the static appearance of the site. However, websites aren&apos;t a static visual. We interact with them, resize them, view them on different browsers and discover them via search engines that view them as raw text. A basic accessibility check list deals with all of these things, and that means better design (in a broader sense, including interaction design) and also inherently includes search engine optimisation.
  2. The reality for most businesses (including in the UK), is that basic web site accessibility is a legal requirement. That said, the UK law is a bit muddy, although new legislation that comes into force in October does make things clearer. By building your website to make it accessible on a broader range of devices, and via a broader range of tools and presentations, you give yourself a bigger audience. That&apos;s just plain good business sense.
  3. 90/10 Beats 100/0 – Every time There is a danger that in striving for 100% perfection, we end up doing nothing. When it comes to accessibility, I&apos;d rather see people do something, and get it 90% or 80% (or even 10%!) right, that do nothing. That may mean some of what I say here offends the purists, but here&apos;s the thing: When I first started looking at accessibility, those purists were the ones that put me off. The dogmatic demand for 100% perfection can result in people deciding that dealing with accessibility is too hard, or too expensive, and that is tragic. Basic accessibility is quick, easy and very rewarding. 
  4. Many Dimensions - No One Answer Disabilities take many many different forms. From vision impairment encountered in old age, to motor issues from birth. Each has their own unique requirements. Sight, hearing, learning, cognitive, motor and mobility impairments occur with a range of severities, and in different combinations. My own experience is through dyslexia. There are many websites that I simply can&apos;t &amp;quot;get a fix on&amp;quot; - the layout and design makes it challenging for me to read them and hard to understand how I am meant to interact with them.
  5. There are many different assistive tools to help, from screen readers and text magnification tools, to input devices. As well as third party tools, most operating systems include universal access technologies. If you&apos;ve never tested them out, fire up systems preferences or control panel and give them a spin. You&apos;ll find screen magnification, black and white / text inversion settings, contrast controls, speech technologies and keyboard for mouse controls.
  6. Em don&apos;t Err When websites are built, there are a number of different ways of specifying the sizes of fonts and devisions on the page. For many years web designers used pixels, but pixels are fickle things. They vary in size from machine to machine, and while it makes it easy to align text to graphics (which are sized in pixels), it means that you loose the ability to let the user&apos;s view make smart choices about how to display your page. Enter &apos;em&apos;s, which are more flexible and the preferred alternative these days. Building a page with ratios, rather than absolute sizes, enables users to use large fonts without breaking your site. Open up your favourite site and use the browser&apos;s view settings to display it in a larger font. Does it still look ok? Then all&apos;s good and well, but if the text goes off screen, or starts to over lap with graphics on the page, all is not well.
  7. Colour blindness affects a huge portion of the population. Poorly contrasting, over opposing primary colour foreground/background combinations don&apos;t only look poor, they are poor. Choose a sensible palette of colours that are discernible, even in black and white. Then stick to them.
  8. The short answer is: No. While a text-only page can help, it is far from a full solution. In some cases, removing the images can make this worse. Well designed images can make navigation more intuitive, and provide important cues for people with reading difficulties. Good web-design separates decorative and functional images and places them in the style sheets or page HTML as appropriate.
  9. Apple’s Steve Jobs might like you to think so, but while the whizzy Adobe Flash animations slapped onto the front page of many sites have been an accessibility (and usability) nightmare, there is no reason for this to be the case. Adobe provide an excellent set of guidelines and tools to make Flash applications that are very accessible. It’s simply a matter of using them. Please make sure that you, or whoever you hire, does. Apple’s HTML 5 fuelled crusade against Flash is going to do little to improve accessibility – you are still embedding video, and still need to provide accessible controls and alternative content.
  10. There is a camp that argues for building a completely separate instance of your site to deal with accessibility issues. Personally I think that is a dangerous road. Firstly, it instantly doubles the amount of work involved in keeping your site up to date. Your site is completely up to date, right? Secondly, the result almost inevitably ends up with web pages that are trying to cater to Dave, with a reading age of 8, who is passionate about your products, and Sue who has a double first from Oxford and is partially sighted. It’s a result that is inevitably downright insulting to everyone involved.
  11. The initial Web Content Accessibility Guidelines  WCAG 1.0 received a mixed welcome.  The 2.0 contribution is a heavy read:  http://www.w3.org/TR/WCAG20/ , you could start with:  http://www.w3.org/TR/UNDERSTANDING-WCAG20/ , although I read the “understanding WCAG20″ document, and didn’t understand that either the first time! You could also try:  http://www.w3.org/WAI/WCAG20/quickref/ . The documents are a challenging read and feel quite onerous. In the UK we have the Disability Rights Commission (DRC): Pas 78 . It used to be a paid for document, but now you can download it for free via that link. Don’t lose the will to live when you read these things! I’ll come back to some easy first steps that you can take, the guidelines are for when you get serious about accessibility – which I strongly urge you to do!
  12. “ Life without a mouse” – from mobile phones to office workers with RSI, it isn’t just cats that are chasing the mice away. Understanding what it feels like to interact with your site without a mouse is a solid way to improve your site’s layout and navigation structure. Make sure you have access keys set ( Twitter does!), that web forms have tab indexes , and that your site isn’t over reliant on hovers.
  13. As a very basic, minimal set of checks, here is what you can do in less than five minutes for your site or sites that you build: View it at your lowest screen resolution View it in black and white View it without stylesheets turned on View the page source If viewing in any of those modes leaves you perplexed, then you probably need to fix it. Make sure your images have ALT text, and that the fonts on the web page scale sensibly and you’ll be making the web experience. There are some on-line testing tools (for example T.A.W. ), although none of them are perfect or instant magic..
  14. Javascript is invisible to many accessibilty tools. Play nice!
  15. Many advocate graceful degredation. I prefer the progressive enhancement model. Build a simple site that works well, then add on the shiny chrome and AJAX wizardly. That way everyone gets a good experience, rather than lots of people getting a poor undesigned one.
  16. Get set of slides – check these out and run through the new CSS HTML and Javasciprt features.
  17. Most wordPress using are already HTML 5 ready, as it were. For the rest, it is relatively simple changes to the theme. WordPress sites tend to follow the right semantic structures. Thankfully!