SlideShare ist ein Scribd-Unternehmen logo
1 von 33
A PRACTICAL APPROACH TO BUILDING THE ACCESSIBLE WEB
From the Trenches
Jon Reid | Senior Developer
A little about me:
Senior Developer at EffectiveUI
HTML, CSS, and Java Script Lead
• Agencies: EffectiveUI, Crispin Porter + Bogusky, Texturemedia
• Business: Core Business Solutions, Western Union
• Science: Genomica, Joint Institute of Laboratory Astrophysics
From The Trenches | A practical approach to building the accessible web
Web Project Dynamics
From The Trenches | A practical approach to building the accessible web
Traditional Dynamic
Stakeholders1
2
3
Designers
Developers
How does accessibility fall by the wayside?
From The Trenches | A practical approach to building the accessible web
• Discussions become too abstract
• People start throwing up roadblocks
STAKEHOLDER ROADBLOCKS
How does accessibility fall by the wayside?
"It's too expensive"1
2
3
"We don't need to be accessible"
"That's not our audience"
From The Trenches | A practical approach to building the accessible web
DESIGNER ROADBLOCKS
How does accessibility fall by the wayside?
"It’s too limiting"1
2
3
"What about the least common denominator"
"It will be ugly"
4 "It will be boring"
From The Trenches | A practical approach to building the accessible web
DEVELOPER ROADBLOCKS
How does accessibility fall by the wayside?
"No technology support"1
2
3
"Restricts our implementation"
"It’s too hard and takes too long"
From The Trenches | A practical approach to building the accessible web
Bull.You CAN do it all.
From The Trenches | A practical approach to building the accessible web
Keep It Real
• Focus on requirements
• Create achievable goals
• Perfection is unnecessary
From The Trenches | A practical approach to building the accessible web
ADVANTAGES
Keeping it real
Defines the risks and returns1
2
3
Informs decisions
Provides transparency
helps the stakeholder
From The Trenches | A practical approach to building the accessible web
ADVANTAGES
Keeping it real
Defines creative scope1
2 Focuses the design process
helps the designer
From The Trenches | A practical approach to building the accessible web
ADVANTAGES
Keeping it real
Guides technological decisions1
2
3
Defines constraints
Creates tangible goals
helps the developer
From The Trenches | A practical approach to building the accessible web
Progressive Enhancement
From The Trenches | A practical approach to building the accessible web
A useful framework for implementing accessibility
Progressive Enhancement
Internet Explorer 8 | Microsoft
CSS3 example
From The Trenches | A practical approach to building the accessible web
Firefox | Mozilla Chrome | Google
Internet Explorer 8 | Detail Chrome | Detail
Progressive enhancement throughout a project
From The Trenches | A practical approach to building the accessible web
• Define requirements
• Create audit trail
• Focus on specifics
HERE’S HOW IT WOULD GO
Define accessibility requirements1
2
3
Create audit trail
Focus on technological requirements early in project
Progressive Enhancement during the definition phase
From The Trenches | A practical approach to building the accessible web
• Explains decisions
• Demonstrates efforts
HERE’S HOW IT WOULD GO
Maintain audit trail for relevant requirements1
2
3
Simple progressive enhancement notes
Don’t wireframe every progressive state
Progressive Enhancement during design
From The Trenches | A practical approach to building the accessible web
HERE’S HOW IT WOULD GO
Continue to maintain audit trail1
2
3
Implement accessibility requirements
Use audit trail as base for Quality Assurance testing
Progressive Enhancement during development
From The Trenches | A practical approach to building the accessible web
Real Life Example
From The Trenches | A practical approach to building the accessible web
Project Pensacola: a new website for the Blue Angels
Blue Angels | Vision Demo
Blue Angels | Home Page Example
Accessibility Structure | Home Page Example Blue Angels | Home Page Example
Blue Angels | Team Example
Accessibility Structure | Team Example Blue Angels | Team Example
Blue Angels | Media Example
Accessibility Structure | Media Example Blue Angels | Media Example
Blue Angels | Aircraft Example
Accessibility Structure | Home Page Example Blue Angels | Home Page Example
Blue Angels | Informational Example
Accessibility Structure | Informational Example Blue Angels | Informational Example
Thank You and Questions

Weitere ähnliche Inhalte

Was ist angesagt?

Was ist angesagt? (14)

Continuous Delivery: Rapid and Reliable Releases with DevOps Practices
Continuous Delivery: Rapid and Reliable Releases with DevOps PracticesContinuous Delivery: Rapid and Reliable Releases with DevOps Practices
Continuous Delivery: Rapid and Reliable Releases with DevOps Practices
 
Responsive to Change
Responsive to ChangeResponsive to Change
Responsive to Change
 
UKSG 2018 Lightning Talk - Assessing impact of educational video content on s...
UKSG 2018 Lightning Talk - Assessing impact of educational video content on s...UKSG 2018 Lightning Talk - Assessing impact of educational video content on s...
UKSG 2018 Lightning Talk - Assessing impact of educational video content on s...
 
Higher Ed Web Conference - Web Project Management
Higher Ed Web Conference - Web Project ManagementHigher Ed Web Conference - Web Project Management
Higher Ed Web Conference - Web Project Management
 
Scaffolding- Lev Vygotsky
Scaffolding- Lev Vygotsky Scaffolding- Lev Vygotsky
Scaffolding- Lev Vygotsky
 
Project live cycle: creating the core
Project live cycle: creating the coreProject live cycle: creating the core
Project live cycle: creating the core
 
The Future of Accessibility - presented at Build the Perfect Council Website ...
The Future of Accessibility - presented at Build the Perfect Council Website ...The Future of Accessibility - presented at Build the Perfect Council Website ...
The Future of Accessibility - presented at Build the Perfect Council Website ...
 
Feedback Loops in Practice
Feedback Loops in PracticeFeedback Loops in Practice
Feedback Loops in Practice
 
Building Lean and Agile in the Real World
Building Lean and Agile in the Real WorldBuilding Lean and Agile in the Real World
Building Lean and Agile in the Real World
 
Designing a Process that Gets Things Done
Designing a Process that Gets Things DoneDesigning a Process that Gets Things Done
Designing a Process that Gets Things Done
 
DevOps - Successful Patterns
DevOps - Successful PatternsDevOps - Successful Patterns
DevOps - Successful Patterns
 
IWMW 2016 Collaborative usability observation workshop intro
IWMW 2016 Collaborative usability observation workshop introIWMW 2016 Collaborative usability observation workshop intro
IWMW 2016 Collaborative usability observation workshop intro
 
Upa2012 ignite pres_l_barnett
Upa2012 ignite pres_l_barnettUpa2012 ignite pres_l_barnett
Upa2012 ignite pres_l_barnett
 
Webinar: Web Design Trends
Webinar: Web Design TrendsWebinar: Web Design Trends
Webinar: Web Design Trends
 

Andere mochten auch

Fiat
FiatFiat
Fiat
Dries
 
Claudia oses, ángela elizalde y paula de la rica
Claudia oses, ángela elizalde y paula de la ricaClaudia oses, ángela elizalde y paula de la rica
Claudia oses, ángela elizalde y paula de la rica
pauladelarica2a
 
Canoe Trip Glebe Outdoor Ed 2009 Gatineau
Canoe Trip Glebe Outdoor Ed 2009 GatineauCanoe Trip Glebe Outdoor Ed 2009 Gatineau
Canoe Trip Glebe Outdoor Ed 2009 Gatineau
Rachel Collishaw
 
Google Docs
Google DocsGoogle Docs
Google Docs
17101994
 

Andere mochten auch (20)

Tech sessie social enterprise
Tech sessie social enterpriseTech sessie social enterprise
Tech sessie social enterprise
 
Introduction to japan
Introduction to japanIntroduction to japan
Introduction to japan
 
Bmd2 opdracht 3 (1)
Bmd2 opdracht 3 (1)Bmd2 opdracht 3 (1)
Bmd2 opdracht 3 (1)
 
Diving Deep with the Flex Component Life Cycle
Diving Deep with the Flex Component Life CycleDiving Deep with the Flex Component Life Cycle
Diving Deep with the Flex Component Life Cycle
 
Social Media in a Corporate Context Manchester 2010 - Kathleen Goh, DHL and S...
Social Media in a Corporate Context Manchester 2010 - Kathleen Goh, DHL and S...Social Media in a Corporate Context Manchester 2010 - Kathleen Goh, DHL and S...
Social Media in a Corporate Context Manchester 2010 - Kathleen Goh, DHL and S...
 
High middle ages
High middle agesHigh middle ages
High middle ages
 
Fiat
FiatFiat
Fiat
 
Today's job market
Today's job marketToday's job market
Today's job market
 
New and improved Katie gear social media portfolio
New and improved Katie gear social media portfolioNew and improved Katie gear social media portfolio
New and improved Katie gear social media portfolio
 
Gt presentation
Gt presentationGt presentation
Gt presentation
 
Corporate Reporting and Human Capital - People and the search for transparenc...
Corporate Reporting and Human Capital - People and the search for transparenc...Corporate Reporting and Human Capital - People and the search for transparenc...
Corporate Reporting and Human Capital - People and the search for transparenc...
 
Jimmy
JimmyJimmy
Jimmy
 
Claudia oses, ángela elizalde y paula de la rica
Claudia oses, ángela elizalde y paula de la ricaClaudia oses, ángela elizalde y paula de la rica
Claudia oses, ángela elizalde y paula de la rica
 
Canoe Trip Glebe Outdoor Ed 2009 Gatineau
Canoe Trip Glebe Outdoor Ed 2009 GatineauCanoe Trip Glebe Outdoor Ed 2009 Gatineau
Canoe Trip Glebe Outdoor Ed 2009 Gatineau
 
Practical Perfect
Practical PerfectPractical Perfect
Practical Perfect
 
Bruce Pollock
Bruce PollockBruce Pollock
Bruce Pollock
 
Putting Twitter to work for you
Putting Twitter to work for youPutting Twitter to work for you
Putting Twitter to work for you
 
LOCOG Olympic Legacy - Alex Balfour
LOCOG Olympic Legacy - Alex BalfourLOCOG Olympic Legacy - Alex Balfour
LOCOG Olympic Legacy - Alex Balfour
 
Google Docs
Google DocsGoogle Docs
Google Docs
 
Ready, Steady, Green! - Corporate Engagment Awards Winner 2015
Ready, Steady, Green! - Corporate Engagment Awards Winner 2015Ready, Steady, Green! - Corporate Engagment Awards Winner 2015
Ready, Steady, Green! - Corporate Engagment Awards Winner 2015
 

Ähnlich wie From the Trenches: Building the Accessible Web

Usability evaluation of the IIT Mandi Website
Usability evaluation of the IIT Mandi WebsiteUsability evaluation of the IIT Mandi Website
Usability evaluation of the IIT Mandi Website
Abhra Basak
 
How do you manage a multi agency 1.8 billion rail bridge design and construct...
How do you manage a multi agency 1.8 billion rail bridge design and construct...How do you manage a multi agency 1.8 billion rail bridge design and construct...
How do you manage a multi agency 1.8 billion rail bridge design and construct...
p6academy
 
Presentation for NUCDC website proposal.pptx
Presentation for NUCDC website proposal.pptxPresentation for NUCDC website proposal.pptx
Presentation for NUCDC website proposal.pptx
i221048
 

Ähnlich wie From the Trenches: Building the Accessible Web (20)

From the Trenches: Building the Accessible Web
From the Trenches: Building the Accessible WebFrom the Trenches: Building the Accessible Web
From the Trenches: Building the Accessible Web
 
Responsive Design Workflow
Responsive Design WorkflowResponsive Design Workflow
Responsive Design Workflow
 
Complementing Accessibility Standards with Evidence of Commitment and Progres...
Complementing Accessibility Standards with Evidence of Commitment and Progres...Complementing Accessibility Standards with Evidence of Commitment and Progres...
Complementing Accessibility Standards with Evidence of Commitment and Progres...
 
DAYALBAGH EDUCATIONAdfgresgL INSTITUTE.pptx
DAYALBAGH EDUCATIONAdfgresgL INSTITUTE.pptxDAYALBAGH EDUCATIONAdfgresgL INSTITUTE.pptx
DAYALBAGH EDUCATIONAdfgresgL INSTITUTE.pptx
 
What’s Next with Accessibility?
What’s Next with Accessibility?What’s Next with Accessibility?
What’s Next with Accessibility?
 
Oct 2014 Siteimprove Stockholm Accessibility Conference
Oct 2014 Siteimprove Stockholm Accessibility ConferenceOct 2014 Siteimprove Stockholm Accessibility Conference
Oct 2014 Siteimprove Stockholm Accessibility Conference
 
Unveiling the World of Web App Development.pptx
Unveiling the World of Web App Development.pptxUnveiling the World of Web App Development.pptx
Unveiling the World of Web App Development.pptx
 
IWMW 2003 b4 QA for web sites (5 - The QA Focus Perspective)
IWMW 2003 b4 QA for web sites (5 - The QA Focus Perspective)IWMW 2003 b4 QA for web sites (5 - The QA Focus Perspective)
IWMW 2003 b4 QA for web sites (5 - The QA Focus Perspective)
 
Usability evaluation of the IIT Mandi Website
Usability evaluation of the IIT Mandi WebsiteUsability evaluation of the IIT Mandi Website
Usability evaluation of the IIT Mandi Website
 
Accessible Web Design
Accessible Web DesignAccessible Web Design
Accessible Web Design
 
Help designers make accessible websites
Help designers make accessible websitesHelp designers make accessible websites
Help designers make accessible websites
 
The Impact of Accessibility
The Impact of AccessibilityThe Impact of Accessibility
The Impact of Accessibility
 
A Proven Software Development Process for the Non Technical Founder
A Proven Software Development Process for the Non Technical FounderA Proven Software Development Process for the Non Technical Founder
A Proven Software Development Process for the Non Technical Founder
 
The Web Guidelines - A battle between project goals and procurement rules
The Web Guidelines - A battle between project goals and procurement rulesThe Web Guidelines - A battle between project goals and procurement rules
The Web Guidelines - A battle between project goals and procurement rules
 
How do you manage a multi agency 1.8 billion rail bridge design and construct...
How do you manage a multi agency 1.8 billion rail bridge design and construct...How do you manage a multi agency 1.8 billion rail bridge design and construct...
How do you manage a multi agency 1.8 billion rail bridge design and construct...
 
Presentation for NUCDC website proposal.pptx
Presentation for NUCDC website proposal.pptxPresentation for NUCDC website proposal.pptx
Presentation for NUCDC website proposal.pptx
 
Network Design Webinar: The Journey of Becoming A Phenomenal Network Architect
Network Design Webinar: The Journey of Becoming A Phenomenal Network ArchitectNetwork Design Webinar: The Journey of Becoming A Phenomenal Network Architect
Network Design Webinar: The Journey of Becoming A Phenomenal Network Architect
 
Creating a consistent web experience across all faculties
Creating a consistent web experience across all facultiesCreating a consistent web experience across all faculties
Creating a consistent web experience across all faculties
 
ATAGTR2017 SPEAKING EYE for differently abled people to see the web content
ATAGTR2017 SPEAKING EYE for differently abled people to see the web contentATAGTR2017 SPEAKING EYE for differently abled people to see the web content
ATAGTR2017 SPEAKING EYE for differently abled people to see the web content
 
Optimize and succeed your next Fixed Budget Project planning process
Optimize and succeed your next Fixed Budget Project planning process Optimize and succeed your next Fixed Budget Project planning process
Optimize and succeed your next Fixed Budget Project planning process
 

Mehr von EffectiveUI

Design essentials For Executives
Design essentials For ExecutivesDesign essentials For Executives
Design essentials For Executives
EffectiveUI
 
Discombobulation, Fire-Breathing Dragons and Wet Noodles: Creating Productive...
Discombobulation, Fire-Breathing Dragons and Wet Noodles: Creating Productive...Discombobulation, Fire-Breathing Dragons and Wet Noodles: Creating Productive...
Discombobulation, Fire-Breathing Dragons and Wet Noodles: Creating Productive...
EffectiveUI
 
Design Essentials for Developers
Design Essentials for DevelopersDesign Essentials for Developers
Design Essentials for Developers
EffectiveUI
 

Mehr von EffectiveUI (20)

Design essentials For Executives
Design essentials For ExecutivesDesign essentials For Executives
Design essentials For Executives
 
Designing an App: From Idea to Market
Designing an App: From Idea to MarketDesigning an App: From Idea to Market
Designing an App: From Idea to Market
 
Flash and Flex in an HTML5 / App Store World
Flash and Flex in an HTML5 / App Store WorldFlash and Flex in an HTML5 / App Store World
Flash and Flex in an HTML5 / App Store World
 
Design Essentials for Developers 08.31.11
Design Essentials for Developers 08.31.11Design Essentials for Developers 08.31.11
Design Essentials for Developers 08.31.11
 
Flex4 Component Lifecycle
Flex4 Component LifecycleFlex4 Component Lifecycle
Flex4 Component Lifecycle
 
The Art of Interaction
The Art of InteractionThe Art of Interaction
The Art of Interaction
 
Design Essentials for Developers
Design Essentials for DevelopersDesign Essentials for Developers
Design Essentials for Developers
 
Rails on HBase
Rails on HBaseRails on HBase
Rails on HBase
 
Git for the Android Developer
Git for the Android DeveloperGit for the Android Developer
Git for the Android Developer
 
Microsoft Kinect and Molehill
Microsoft Kinect and MolehillMicrosoft Kinect and Molehill
Microsoft Kinect and Molehill
 
Reasons for Flash: Flash Development in an HTML5 and App Store World
Reasons for Flash: Flash Development in an HTML5 and App Store WorldReasons for Flash: Flash Development in an HTML5 and App Store World
Reasons for Flash: Flash Development in an HTML5 and App Store World
 
Discombobulation, Fire-Breathing Dragons and Wet Noodles: Creating Productive...
Discombobulation, Fire-Breathing Dragons and Wet Noodles: Creating Productive...Discombobulation, Fire-Breathing Dragons and Wet Noodles: Creating Productive...
Discombobulation, Fire-Breathing Dragons and Wet Noodles: Creating Productive...
 
Design Essentials for Developers
Design Essentials for DevelopersDesign Essentials for Developers
Design Essentials for Developers
 
Your Mom Has an iPad
Your Mom Has an iPadYour Mom Has an iPad
Your Mom Has an iPad
 
Human-Centered Design and the Intersection of the Physical and Digital Worlds
Human-Centered Design and the Intersection of the Physical and Digital WorldsHuman-Centered Design and the Intersection of the Physical and Digital Worlds
Human-Centered Design and the Intersection of the Physical and Digital Worlds
 
Flexerific Visual Effects
Flexerific Visual EffectsFlexerific Visual Effects
Flexerific Visual Effects
 
Test-Driven Development
Test-Driven DevelopmentTest-Driven Development
Test-Driven Development
 
An Opinionated Introduction to Mate
An Opinionated Introduction to MateAn Opinionated Introduction to Mate
An Opinionated Introduction to Mate
 
Flex 360 Rules Engine
Flex 360 Rules EngineFlex 360 Rules Engine
Flex 360 Rules Engine
 
Flex 4 Deep Dive
Flex 4 Deep DiveFlex 4 Deep Dive
Flex 4 Deep Dive
 

Kürzlich hochgeladen

Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slideHistor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slide
vu2urc
 

Kürzlich hochgeladen (20)

Evaluating the top large language models.pdf
Evaluating the top large language models.pdfEvaluating the top large language models.pdf
Evaluating the top large language models.pdf
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
 
🐬 The future of MySQL is Postgres 🐘
🐬  The future of MySQL is Postgres   🐘🐬  The future of MySQL is Postgres   🐘
🐬 The future of MySQL is Postgres 🐘
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024
 
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
Tech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdfTech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdf
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
08448380779 Call Girls In Civil Lines Women Seeking Men
08448380779 Call Girls In Civil Lines Women Seeking Men08448380779 Call Girls In Civil Lines Women Seeking Men
08448380779 Call Girls In Civil Lines Women Seeking Men
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
 
GenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdfGenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdf
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
How to convert PDF to text with Nanonets
How to convert PDF to text with NanonetsHow to convert PDF to text with Nanonets
How to convert PDF to text with Nanonets
 
Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slideHistor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slide
 
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...
 

From the Trenches: Building the Accessible Web

  • 1.
  • 2. A PRACTICAL APPROACH TO BUILDING THE ACCESSIBLE WEB From the Trenches Jon Reid | Senior Developer
  • 3. A little about me: Senior Developer at EffectiveUI HTML, CSS, and Java Script Lead • Agencies: EffectiveUI, Crispin Porter + Bogusky, Texturemedia • Business: Core Business Solutions, Western Union • Science: Genomica, Joint Institute of Laboratory Astrophysics From The Trenches | A practical approach to building the accessible web
  • 4. Web Project Dynamics From The Trenches | A practical approach to building the accessible web Traditional Dynamic Stakeholders1 2 3 Designers Developers
  • 5. How does accessibility fall by the wayside? From The Trenches | A practical approach to building the accessible web • Discussions become too abstract • People start throwing up roadblocks
  • 6. STAKEHOLDER ROADBLOCKS How does accessibility fall by the wayside? "It's too expensive"1 2 3 "We don't need to be accessible" "That's not our audience" From The Trenches | A practical approach to building the accessible web
  • 7. DESIGNER ROADBLOCKS How does accessibility fall by the wayside? "It’s too limiting"1 2 3 "What about the least common denominator" "It will be ugly" 4 "It will be boring" From The Trenches | A practical approach to building the accessible web
  • 8. DEVELOPER ROADBLOCKS How does accessibility fall by the wayside? "No technology support"1 2 3 "Restricts our implementation" "It’s too hard and takes too long" From The Trenches | A practical approach to building the accessible web
  • 9. Bull.You CAN do it all. From The Trenches | A practical approach to building the accessible web
  • 10. Keep It Real • Focus on requirements • Create achievable goals • Perfection is unnecessary From The Trenches | A practical approach to building the accessible web
  • 11. ADVANTAGES Keeping it real Defines the risks and returns1 2 3 Informs decisions Provides transparency helps the stakeholder From The Trenches | A practical approach to building the accessible web
  • 12. ADVANTAGES Keeping it real Defines creative scope1 2 Focuses the design process helps the designer From The Trenches | A practical approach to building the accessible web
  • 13. ADVANTAGES Keeping it real Guides technological decisions1 2 3 Defines constraints Creates tangible goals helps the developer From The Trenches | A practical approach to building the accessible web
  • 14. Progressive Enhancement From The Trenches | A practical approach to building the accessible web A useful framework for implementing accessibility
  • 15. Progressive Enhancement Internet Explorer 8 | Microsoft CSS3 example From The Trenches | A practical approach to building the accessible web Firefox | Mozilla Chrome | Google
  • 16. Internet Explorer 8 | Detail Chrome | Detail
  • 17. Progressive enhancement throughout a project From The Trenches | A practical approach to building the accessible web • Define requirements • Create audit trail • Focus on specifics
  • 18. HERE’S HOW IT WOULD GO Define accessibility requirements1 2 3 Create audit trail Focus on technological requirements early in project Progressive Enhancement during the definition phase From The Trenches | A practical approach to building the accessible web • Explains decisions • Demonstrates efforts
  • 19. HERE’S HOW IT WOULD GO Maintain audit trail for relevant requirements1 2 3 Simple progressive enhancement notes Don’t wireframe every progressive state Progressive Enhancement during design From The Trenches | A practical approach to building the accessible web
  • 20. HERE’S HOW IT WOULD GO Continue to maintain audit trail1 2 3 Implement accessibility requirements Use audit trail as base for Quality Assurance testing Progressive Enhancement during development From The Trenches | A practical approach to building the accessible web
  • 21. Real Life Example From The Trenches | A practical approach to building the accessible web Project Pensacola: a new website for the Blue Angels
  • 22. Blue Angels | Vision Demo
  • 23. Blue Angels | Home Page Example
  • 24. Accessibility Structure | Home Page Example Blue Angels | Home Page Example
  • 25. Blue Angels | Team Example
  • 26. Accessibility Structure | Team Example Blue Angels | Team Example
  • 27. Blue Angels | Media Example
  • 28. Accessibility Structure | Media Example Blue Angels | Media Example
  • 29. Blue Angels | Aircraft Example
  • 30. Accessibility Structure | Home Page Example Blue Angels | Home Page Example
  • 31. Blue Angels | Informational Example
  • 32. Accessibility Structure | Informational Example Blue Angels | Informational Example
  • 33. Thank You and Questions