SlideShare a Scribd company logo

How To Build An Accessible Web Application

•
•
Dennis Lembree
Dennis Lembree

Presentation slides for Accessibility DC Meetup, November 15, 2011.

TechnologyDesign
1 of 42
How to Build an Accessible Web Application (Easy Chirp) Presented by Dennis Lembrée Accessibility DC Meet-up Martin Luther King (MLK) Library November 15, 2011
Agenda ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Intro ,[object Object],[object Object],[object Object],[object Object],[object Object]
Foundations ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Foundations ,[object Object],[object Object],[object Object],[object Object]
HTML ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
HTML ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
HTML ,[object Object],[object Object],[object Object],[object Object],[object Object]
HTML ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
HTML ,[object Object]
HTML ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
CSS & Design ,[object Object],[object Object],[object Object],[object Object]
CSS & Design ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
CSS & Design ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
CSS & Design ,[object Object],[object Object]
CSS & Design ,[object Object],[object Object],[object Object],[object Object],[object Object]
CSS & Design ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
JavaScript ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
JavaScript ,[object Object],[object Object],[object Object],[object Object],[object Object]
JavaScript
JavaScript
JavaScript ,[object Object],[object Object],[object Object],[object Object]
ARIA ,[object Object],[object Object],[object Object],[object Object]
ARIA - Landmark Roles ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
ARIA - Landmark Roles role=“banner” role=“navigation” role=“contentinfo” role=“main” role=“complementary” role=“search”
ARIA - States and Properties ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
ARIA - States and Properties ,[object Object],[object Object],[object Object],[object Object]
ARIA – Live Regions ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
ARIA – Live Regions
ARIA – Live Regions ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Writing ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Tips ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Results ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Results ,[object Object],Konquerer (Linux) IE6 Kindle (first release)
Results ,[object Object],[object Object],[object Object]
Results ,[object Object],[object Object],[object Object],[object Object],[object Object]
Other Resources ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Contact Details ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Questions?

Recommended

Angular JS - UI Development Online Training
Angular JS - UI Development Online TrainingAngular JS - UI Development Online Training
Angular JS - UI Development Online TrainingFront End UI Online Training from India
 
Introduction to Web Design
Introduction to Web DesignIntroduction to Web Design
Introduction to Web DesignVictor M. Ortiz
 
Web Design Trends: 2018 Edition
Web Design Trends: 2018 EditionWeb Design Trends: 2018 Edition
Web Design Trends: 2018 EditionSt. Petersburg College
 
Web designing course bangalore
Web designing course bangaloreWeb designing course bangalore
Web designing course bangaloreInfocampus Logics Pvt.Ltd.
 
New microsoft office power point presentation
New microsoft office power point presentationNew microsoft office power point presentation
New microsoft office power point presentationSudhir Yadav
 
New microsoft office power point presentation
New microsoft office power point presentationNew microsoft office power point presentation
New microsoft office power point presentationSudhir Yadav
 
Web site design
Web site designWeb site design
Web site designKingsport City SChools
 
Web Designing
Web Designing Web Designing
Web Designing BALUJAINSTITUTE
 

Recommended

Angular JS - UI Development Online Training
Angular JS - UI Development Online TrainingAngular JS - UI Development Online Training
Angular JS - UI Development Online TrainingFront End UI Online Training from India
 
Introduction to Web Design
Introduction to Web DesignIntroduction to Web Design
Introduction to Web DesignVictor M. Ortiz
 
Web Design Trends: 2018 Edition
Web Design Trends: 2018 EditionWeb Design Trends: 2018 Edition
Web Design Trends: 2018 EditionSt. Petersburg College
 
Web designing course bangalore
Web designing course bangaloreWeb designing course bangalore
Web designing course bangaloreInfocampus Logics Pvt.Ltd.
 
New microsoft office power point presentation
New microsoft office power point presentationNew microsoft office power point presentation
New microsoft office power point presentationSudhir Yadav
 
New microsoft office power point presentation
New microsoft office power point presentationNew microsoft office power point presentation
New microsoft office power point presentationSudhir Yadav
 
Web site design
Web site designWeb site design
Web site designKingsport City SChools
 
Web Designing
Web Designing Web Designing
Web Designing BALUJAINSTITUTE
 
Structuring Content in WordPress using Advanced Custom Fields
Structuring Content in WordPress using Advanced Custom FieldsStructuring Content in WordPress using Advanced Custom Fields
Structuring Content in WordPress using Advanced Custom FieldsJamie Schmid
 
ARC WEB DESIGNING INSTITUTE | ISO Certified Web Designing Course
ARC WEB DESIGNING INSTITUTE | ISO Certified Web Designing CourseARC WEB DESIGNING INSTITUTE | ISO Certified Web Designing Course
ARC WEB DESIGNING INSTITUTE | ISO Certified Web Designing CourseArcEducation Ambala
 
Websites Unlimited - Pay Monthly Websites
Websites Unlimited - Pay Monthly WebsitesWebsites Unlimited - Pay Monthly Websites
Websites Unlimited - Pay Monthly Websiteswebsiteunlimited
 
Top web development tools
Top web development toolsTop web development tools
Top web development toolsBusinessDevelopment35
 
Aria Widgets
Aria WidgetsAria Widgets
Aria Widgetstoddkloots
 
Web Design & Development - Session 1
Web Design & Development - Session 1Web Design & Development - Session 1
Web Design & Development - Session 1Shahrzad Peyman
 
Ppt on Website Planning
Ppt on Website PlanningPpt on Website Planning
Ppt on Website PlanningOm Prakash
 
Website Development Process
Website Development ProcessWebsite Development Process
Website Development ProcessHend Al-Khalifa
 
Customizing the SharePoint 2013 user interface with JavaScript - Chris OBrien
Customizing the SharePoint 2013 user interface with JavaScript - Chris OBrienCustomizing the SharePoint 2013 user interface with JavaScript - Chris OBrien
Customizing the SharePoint 2013 user interface with JavaScript - Chris OBrienChris O'Brien
 
Web App Development Technologies You Should Know
Web App Development Technologies You Should KnowWeb App Development Technologies You Should Know
Web App Development Technologies You Should KnowVishal Sinhasan
 
Ppt of web development
Ppt of web developmentPpt of web development
Ppt of web developmentbethanygfair
 
Web Site Design,
Web Site Design,Web Site Design,
Web Site Design,Deepak Singh Rawat
 
How to Improve the SharePoint UI Using Bootstrap 3
How to Improve the SharePoint UI Using Bootstrap 3How to Improve the SharePoint UI Using Bootstrap 3
How to Improve the SharePoint UI Using Bootstrap 3Ryan McIntyre
 
website planning and creation for beginners
website planning and creation for beginners website planning and creation for beginners
website planning and creation for beginners Shruti Goel
 
"Generating static web sites with Middleman"
"Generating static web sites with Middleman""Generating static web sites with Middleman"
"Generating static web sites with Middleman"Tony Camaiani
 
Responsive Web Design with HTML5 and CSS3
Responsive Web Design with HTML5 and CSS3Responsive Web Design with HTML5 and CSS3
Responsive Web Design with HTML5 and CSS3Kannika Kong
 
Lecture 1 intro to web designing
Lecture 1 intro to web designingLecture 1 intro to web designing
Lecture 1 intro to web designingpalhaftab
 
Amay arodelyn maot
Amay arodelyn maotAmay arodelyn maot
Amay arodelyn maotRodelynRodriguez
 
Style guide for share point 2013 branding
Style guide for share point 2013 brandingStyle guide for share point 2013 branding
Style guide for share point 2013 brandingVinod Dangudubiyyapu
 
Web dev-101
Web dev-101Web dev-101
Web dev-101Andrew Pottenger
 
Kanban Method Change Machine - As a Story Map
Kanban Method Change Machine - As a Story MapKanban Method Change Machine - As a Story Map
Kanban Method Change Machine - As a Story MapYuval Yeret
 
Making JavaScript Accessible
Making JavaScript AccessibleMaking JavaScript Accessible
Making JavaScript AccessibleDennis Lembree
 

More Related Content

What's hot

Structuring Content in WordPress using Advanced Custom Fields
Structuring Content in WordPress using Advanced Custom FieldsStructuring Content in WordPress using Advanced Custom Fields
Structuring Content in WordPress using Advanced Custom FieldsJamie Schmid
 
ARC WEB DESIGNING INSTITUTE | ISO Certified Web Designing Course
ARC WEB DESIGNING INSTITUTE | ISO Certified Web Designing CourseARC WEB DESIGNING INSTITUTE | ISO Certified Web Designing Course
ARC WEB DESIGNING INSTITUTE | ISO Certified Web Designing CourseArcEducation Ambala
 
Websites Unlimited - Pay Monthly Websites
Websites Unlimited - Pay Monthly WebsitesWebsites Unlimited - Pay Monthly Websites
Websites Unlimited - Pay Monthly Websiteswebsiteunlimited
 
Web Design & Development - Session 1
Web Design & Development - Session 1Web Design & Development - Session 1
Web Design & Development - Session 1Shahrzad Peyman
 
Ppt on Website Planning
Ppt on Website PlanningPpt on Website Planning
Ppt on Website PlanningOm Prakash
 
Website Development Process
Website Development ProcessWebsite Development Process
Website Development ProcessHend Al-Khalifa
 
Customizing the SharePoint 2013 user interface with JavaScript - Chris OBrien
Customizing the SharePoint 2013 user interface with JavaScript - Chris OBrienCustomizing the SharePoint 2013 user interface with JavaScript - Chris OBrien
Customizing the SharePoint 2013 user interface with JavaScript - Chris OBrienChris O'Brien
 
Web App Development Technologies You Should Know
Web App Development Technologies You Should KnowWeb App Development Technologies You Should Know
Web App Development Technologies You Should KnowVishal Sinhasan
 
Ppt of web development
Ppt of web developmentPpt of web development
Ppt of web developmentbethanygfair
 
How to Improve the SharePoint UI Using Bootstrap 3
How to Improve the SharePoint UI Using Bootstrap 3How to Improve the SharePoint UI Using Bootstrap 3
How to Improve the SharePoint UI Using Bootstrap 3Ryan McIntyre
 
website planning and creation for beginners
website planning and creation for beginners website planning and creation for beginners
website planning and creation for beginners Shruti Goel
 
"Generating static web sites with Middleman"
"Generating static web sites with Middleman""Generating static web sites with Middleman"
"Generating static web sites with Middleman"Tony Camaiani
 
Responsive Web Design with HTML5 and CSS3
Responsive Web Design with HTML5 and CSS3Responsive Web Design with HTML5 and CSS3
Responsive Web Design with HTML5 and CSS3Kannika Kong
 
Lecture 1 intro to web designing
Lecture 1 intro to web designingLecture 1 intro to web designing
Lecture 1 intro to web designingpalhaftab
 
Style guide for share point 2013 branding
Style guide for share point 2013 brandingStyle guide for share point 2013 branding
Style guide for share point 2013 brandingVinod Dangudubiyyapu
 

What's hot (20)

Structuring Content in WordPress using Advanced Custom Fields
Structuring Content in WordPress using Advanced Custom FieldsStructuring Content in WordPress using Advanced Custom Fields
Structuring Content in WordPress using Advanced Custom Fields
 
ARC WEB DESIGNING INSTITUTE | ISO Certified Web Designing Course
ARC WEB DESIGNING INSTITUTE | ISO Certified Web Designing CourseARC WEB DESIGNING INSTITUTE | ISO Certified Web Designing Course
ARC WEB DESIGNING INSTITUTE | ISO Certified Web Designing Course
 
Websites Unlimited - Pay Monthly Websites
Websites Unlimited - Pay Monthly WebsitesWebsites Unlimited - Pay Monthly Websites
Websites Unlimited - Pay Monthly Websites
 
Top web development tools
Top web development toolsTop web development tools
Top web development tools
 
Aria Widgets
Aria WidgetsAria Widgets
Aria Widgets
 
Web Design & Development - Session 1
Web Design & Development - Session 1Web Design & Development - Session 1
Web Design & Development - Session 1
 
Ppt on Website Planning
Ppt on Website PlanningPpt on Website Planning
Ppt on Website Planning
 
Website Development Process
Website Development ProcessWebsite Development Process
Website Development Process
 
Customizing the SharePoint 2013 user interface with JavaScript - Chris OBrien
Customizing the SharePoint 2013 user interface with JavaScript - Chris OBrienCustomizing the SharePoint 2013 user interface with JavaScript - Chris OBrien
Customizing the SharePoint 2013 user interface with JavaScript - Chris OBrien
 
Web App Development Technologies You Should Know
Web App Development Technologies You Should KnowWeb App Development Technologies You Should Know
Web App Development Technologies You Should Know
 
Ppt of web development
Ppt of web developmentPpt of web development
Ppt of web development
 
Web Site Design,
Web Site Design,Web Site Design,
Web Site Design,
 
How to Improve the SharePoint UI Using Bootstrap 3
How to Improve the SharePoint UI Using Bootstrap 3How to Improve the SharePoint UI Using Bootstrap 3
How to Improve the SharePoint UI Using Bootstrap 3
 
website planning and creation for beginners
website planning and creation for beginners website planning and creation for beginners
website planning and creation for beginners
 
"Generating static web sites with Middleman"
"Generating static web sites with Middleman""Generating static web sites with Middleman"
"Generating static web sites with Middleman"
 
Responsive Web Design with HTML5 and CSS3
Responsive Web Design with HTML5 and CSS3Responsive Web Design with HTML5 and CSS3
Responsive Web Design with HTML5 and CSS3
 
Lecture 1 intro to web designing
Lecture 1 intro to web designingLecture 1 intro to web designing
Lecture 1 intro to web designing
 
Amay arodelyn maot
Amay arodelyn maotAmay arodelyn maot
Amay arodelyn maot
 
Style guide for share point 2013 branding
Style guide for share point 2013 brandingStyle guide for share point 2013 branding
Style guide for share point 2013 branding
 
Web dev-101
Web dev-101Web dev-101
Web dev-101
 

Viewers also liked

Kanban Method Change Machine - As a Story Map
Kanban Method Change Machine - As a Story MapKanban Method Change Machine - As a Story Map
Kanban Method Change Machine - As a Story MapYuval Yeret
 
Making JavaScript Accessible
Making JavaScript AccessibleMaking JavaScript Accessible
Making JavaScript AccessibleDennis Lembree
 
Getting Things Done for Technical Communicators at TCUK14
Getting Things Done for Technical Communicators at TCUK14Getting Things Done for Technical Communicators at TCUK14
Getting Things Done for Technical Communicators at TCUK14Karen Mardahl
 
[Access U 2010] HTML5 & Accessibility
[Access U 2010] HTML5 & Accessibility[Access U 2010] HTML5 & Accessibility
[Access U 2010] HTML5 & AccessibilityChristopher Schmitt
 
Open Web Camp 2014: On Fireproof, Future-Proof, Failure-Proof Things.
Open Web Camp 2014: On Fireproof, Future-Proof, Failure-Proof Things.Open Web Camp 2014: On Fireproof, Future-Proof, Failure-Proof Things.
Open Web Camp 2014: On Fireproof, Future-Proof, Failure-Proof Things.Dylan Wilbanks
 
Anatomy of an accessible carousel: everyone's responsible!
Anatomy of an accessible carousel: everyone's responsible!Anatomy of an accessible carousel: everyone's responsible!
Anatomy of an accessible carousel: everyone's responsible!Access iQ
 
Strategic Approach to IT Accessibility
Strategic Approach to IT AccessibilityStrategic Approach to IT Accessibility
Strategic Approach to IT AccessibilityInnoTech
 
Accessible Video in The Enterprise
Accessible Video in The Enterprise Accessible Video in The Enterprise
Accessible Video in The Enterprise John Foliot
 
HTML5's ARIA and a Web-Accessible Dropdown Widget
HTML5's ARIA and a Web-Accessible Dropdown WidgetHTML5's ARIA and a Web-Accessible Dropdown Widget
HTML5's ARIA and a Web-Accessible Dropdown WidgetDennis Lembree
 
How To Build An Accessible Web Application - a11yBos
How To Build An Accessible Web Application - a11yBosHow To Build An Accessible Web Application - a11yBos
How To Build An Accessible Web Application - a11yBosDennis Lembree
 
Getting Things Done for Technical Communicators
Getting Things Done for Technical CommunicatorsGetting Things Done for Technical Communicators
Getting Things Done for Technical CommunicatorsKaren Mardahl
 
HTML5 Accessibility - Is it ready yet?
HTML5 Accessibility - Is it ready yet?HTML5 Accessibility - Is it ready yet?
HTML5 Accessibility - Is it ready yet?Steven Faulkner
 
Responsible Design: Accountable Accessibility
Responsible Design: Accountable AccessibilityResponsible Design: Accountable Accessibility
Responsible Design: Accountable AccessibilityBilly Gregory
 
Designing with Empathy [Reasons to be Creative 2013]
Designing with Empathy [Reasons to be Creative 2013]Designing with Empathy [Reasons to be Creative 2013]
Designing with Empathy [Reasons to be Creative 2013]Aaron Gustafson
 
Teach your Browser new tricks
Teach your Browser new tricksTeach your Browser new tricks
Teach your Browser new tricksDirk Ginader
 
Create Accessible Infographics
Create Accessible Infographics Create Accessible Infographics
Create Accessible Infographics Ted Drake
 
The Power of the Junior
The Power of the JuniorThe Power of the Junior
The Power of the JuniorYves Hanoulle
 
A Web for Everyone: Accessibility as a design challenge
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
 

Viewers also liked (20)

Kanban Method Change Machine - As a Story Map
Kanban Method Change Machine - As a Story MapKanban Method Change Machine - As a Story Map
Kanban Method Change Machine - As a Story Map
 
Making JavaScript Accessible
Making JavaScript AccessibleMaking JavaScript Accessible
Making JavaScript Accessible
 
Getting Things Done for Technical Communicators at TCUK14
Getting Things Done for Technical Communicators at TCUK14Getting Things Done for Technical Communicators at TCUK14
Getting Things Done for Technical Communicators at TCUK14
 
[Access U 2010] HTML5 & Accessibility
[Access U 2010] HTML5 & Accessibility[Access U 2010] HTML5 & Accessibility
[Access U 2010] HTML5 & Accessibility
 
Open Web Camp 2014: On Fireproof, Future-Proof, Failure-Proof Things.
Open Web Camp 2014: On Fireproof, Future-Proof, Failure-Proof Things.Open Web Camp 2014: On Fireproof, Future-Proof, Failure-Proof Things.
Open Web Camp 2014: On Fireproof, Future-Proof, Failure-Proof Things.
 
Anatomy of an accessible carousel: everyone's responsible!
Anatomy of an accessible carousel: everyone's responsible!Anatomy of an accessible carousel: everyone's responsible!
Anatomy of an accessible carousel: everyone's responsible!
 
Strategic Approach to IT Accessibility
Strategic Approach to IT AccessibilityStrategic Approach to IT Accessibility
Strategic Approach to IT Accessibility
 
Accessible Video in The Enterprise
Accessible Video in The Enterprise Accessible Video in The Enterprise
Accessible Video in The Enterprise
 
HTML5's ARIA and a Web-Accessible Dropdown Widget
HTML5's ARIA and a Web-Accessible Dropdown WidgetHTML5's ARIA and a Web-Accessible Dropdown Widget
HTML5's ARIA and a Web-Accessible Dropdown Widget
 
How To Build An Accessible Web Application - a11yBos
How To Build An Accessible Web Application - a11yBosHow To Build An Accessible Web Application - a11yBos
How To Build An Accessible Web Application - a11yBos
 
Getting Things Done for Technical Communicators
Getting Things Done for Technical CommunicatorsGetting Things Done for Technical Communicators
Getting Things Done for Technical Communicators
 
Usability meets accessibility
Usability meets accessibilityUsability meets accessibility
Usability meets accessibility
 
HTML5 Accessibility - Is it ready yet?
HTML5 Accessibility - Is it ready yet?HTML5 Accessibility - Is it ready yet?
HTML5 Accessibility - Is it ready yet?
 
Responsible Design: Accountable Accessibility
Responsible Design: Accountable AccessibilityResponsible Design: Accountable Accessibility
Responsible Design: Accountable Accessibility
 
Designing with Empathy [Reasons to be Creative 2013]
Designing with Empathy [Reasons to be Creative 2013]Designing with Empathy [Reasons to be Creative 2013]
Designing with Empathy [Reasons to be Creative 2013]
 
Teach your Browser new tricks
Teach your Browser new tricksTeach your Browser new tricks
Teach your Browser new tricks
 
AccessU 2011 Keynote
AccessU 2011 KeynoteAccessU 2011 Keynote
AccessU 2011 Keynote
 
Create Accessible Infographics
Create Accessible Infographics Create Accessible Infographics
Create Accessible Infographics
 
The Power of the Junior
The Power of the JuniorThe Power of the Junior
The Power of the Junior
 
A Web for Everyone: Accessibility as a design challenge
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
 

Similar to How To Build An Accessible Web Application

LATEST_TRENDS_IN_WEBSITE_DEVELOPMENT.pptx
LATEST_TRENDS_IN_WEBSITE_DEVELOPMENT.pptxLATEST_TRENDS_IN_WEBSITE_DEVELOPMENT.pptx
LATEST_TRENDS_IN_WEBSITE_DEVELOPMENT.pptxchitrachauhan21
 
Web designing and publishing computer studies theory lesson
Web designing and publishing computer studies theory lessonWeb designing and publishing computer studies theory lesson
Web designing and publishing computer studies theory lessonMukalele Rogers
 
Familiar Tools, New Possibilities: Leveraging the Power of the Adobe Web Pub...
Familiar Tools, New Possibilities: Leveraging the Power of the Adobe Web Pub...Familiar Tools, New Possibilities: Leveraging the Power of the Adobe Web Pub...
Familiar Tools, New Possibilities: Leveraging the Power of the Adobe Web Pub...John Hartley
 
Architecting RIAs with Silverlight
Architecting RIAs with SilverlightArchitecting RIAs with Silverlight
Architecting RIAs with SilverlightJosh Holmes
 
IBM Rational HATS Customized Amazing Features by Royal Cyber
IBM Rational HATS Customized Amazing Features by Royal CyberIBM Rational HATS Customized Amazing Features by Royal Cyber
IBM Rational HATS Customized Amazing Features by Royal CyberRoyal Cyber Inc.
 
Lean And Clean! Building A Site With Web Standards
Lean And Clean! Building A Site With Web StandardsLean And Clean! Building A Site With Web Standards
Lean And Clean! Building A Site With Web Standardsweb.designer.developer
 
Introduction to silver light
Introduction to silver lightIntroduction to silver light
Introduction to silver lightjayc8586
 
App innovationcircles xamarin
App innovationcircles xamarinApp innovationcircles xamarin
App innovationcircles xamarinMohit Chhabra
 
Front End Development | Introduction
Front End Development | IntroductionFront End Development | Introduction
Front End Development | IntroductionJohnTaieb
 
Doing Modern Web, aka JavaScript and HTML5 in the Enterprise NYC Code Camp
Doing Modern Web, aka JavaScript and HTML5 in the Enterprise NYC Code CampDoing Modern Web, aka JavaScript and HTML5 in the Enterprise NYC Code Camp
Doing Modern Web, aka JavaScript and HTML5 in the Enterprise NYC Code CampChris Love
 
A Complete Guide to Frontend - UI Developer
A Complete Guide to Frontend - UI DeveloperA Complete Guide to Frontend - UI Developer
A Complete Guide to Frontend - UI Developernariyaravi
 
Bruce Lawson Opera Indonesia
Bruce Lawson Opera IndonesiaBruce Lawson Opera Indonesia
Bruce Lawson Opera Indonesiabrucelawson
 
Win j svsphonegap-damyan-petev-mihail-mateev
Win j svsphonegap-damyan-petev-mihail-mateevWin j svsphonegap-damyan-petev-mihail-mateev
Win j svsphonegap-damyan-petev-mihail-mateevMihail Mateev
 
Cross platform mobile app development with Xamarin
Cross platform mobile app development with XamarinCross platform mobile app development with Xamarin
Cross platform mobile app development with XamarinPranav Ainavolu
 

Similar to How To Build An Accessible Web Application (20)

LATEST_TRENDS_IN_WEBSITE_DEVELOPMENT.pptx
LATEST_TRENDS_IN_WEBSITE_DEVELOPMENT.pptxLATEST_TRENDS_IN_WEBSITE_DEVELOPMENT.pptx
LATEST_TRENDS_IN_WEBSITE_DEVELOPMENT.pptx
 
Web Page Design.ppt
Web Page Design.pptWeb Page Design.ppt
Web Page Design.ppt
 
Web Page Design.ppt
Web Page Design.pptWeb Page Design.ppt
Web Page Design.ppt
 
Web designing and publishing computer studies theory lesson
Web designing and publishing computer studies theory lessonWeb designing and publishing computer studies theory lesson
Web designing and publishing computer studies theory lesson
 
Adobe® Flex™
Adobe® Flex™Adobe® Flex™
Adobe® Flex™
 
What is Adobe Flex ?
What is Adobe Flex ?What is Adobe Flex ?
What is Adobe Flex ?
 
Familiar Tools, New Possibilities: Leveraging the Power of the Adobe Web Pub...
Familiar Tools, New Possibilities: Leveraging the Power of the Adobe Web Pub...Familiar Tools, New Possibilities: Leveraging the Power of the Adobe Web Pub...
Familiar Tools, New Possibilities: Leveraging the Power of the Adobe Web Pub...
 
Architecting RIAs with Silverlight
Architecting RIAs with SilverlightArchitecting RIAs with Silverlight
Architecting RIAs with Silverlight
 
IBM Rational HATS Customized Amazing Features by Royal Cyber
IBM Rational HATS Customized Amazing Features by Royal CyberIBM Rational HATS Customized Amazing Features by Royal Cyber
IBM Rational HATS Customized Amazing Features by Royal Cyber
 
Lean And Clean! Building A Site With Web Standards
Lean And Clean! Building A Site With Web StandardsLean And Clean! Building A Site With Web Standards
Lean And Clean! Building A Site With Web Standards
 
Lean And Clean! Building A Site With
Lean And Clean! Building A Site WithLean And Clean! Building A Site With
Lean And Clean! Building A Site With
 
Android Deep Dive
Android Deep DiveAndroid Deep Dive
Android Deep Dive
 
Introduction to silver light
Introduction to silver lightIntroduction to silver light
Introduction to silver light
 
App innovationcircles xamarin
App innovationcircles xamarinApp innovationcircles xamarin
App innovationcircles xamarin
 
Front End Development | Introduction
Front End Development | IntroductionFront End Development | Introduction
Front End Development | Introduction
 
Doing Modern Web, aka JavaScript and HTML5 in the Enterprise NYC Code Camp
Doing Modern Web, aka JavaScript and HTML5 in the Enterprise NYC Code CampDoing Modern Web, aka JavaScript and HTML5 in the Enterprise NYC Code Camp
Doing Modern Web, aka JavaScript and HTML5 in the Enterprise NYC Code Camp
 
A Complete Guide to Frontend - UI Developer
A Complete Guide to Frontend - UI DeveloperA Complete Guide to Frontend - UI Developer
A Complete Guide to Frontend - UI Developer
 
Bruce Lawson Opera Indonesia
Bruce Lawson Opera IndonesiaBruce Lawson Opera Indonesia
Bruce Lawson Opera Indonesia
 
Win j svsphonegap-damyan-petev-mihail-mateev
Win j svsphonegap-damyan-petev-mihail-mateevWin j svsphonegap-damyan-petev-mihail-mateev
Win j svsphonegap-damyan-petev-mihail-mateev
 
Cross platform mobile app development with Xamarin
Cross platform mobile app development with XamarinCross platform mobile app development with Xamarin
Cross platform mobile app development with Xamarin
 

More from Dennis Lembree

SVG Icons and Screen Reader Accessibility
SVG Icons and Screen Reader AccessibilitySVG Icons and Screen Reader Accessibility
SVG Icons and Screen Reader AccessibilityDennis Lembree
 
Networking with Twitter, Part 2
Networking with Twitter, Part 2Networking with Twitter, Part 2
Networking with Twitter, Part 2Dennis Lembree
 
Networking with Twitter, Part 1
Networking with Twitter, Part 1Networking with Twitter, Part 1
Networking with Twitter, Part 1Dennis Lembree
 
Twitter and Web Accessibility (EASI Webinar)
Twitter and Web Accessibility (EASI Webinar)Twitter and Web Accessibility (EASI Webinar)
Twitter and Web Accessibility (EASI Webinar)Dennis Lembree
 
Accessible Twitter Update at CSUN11 Tweetup
Accessible Twitter Update at CSUN11 TweetupAccessible Twitter Update at CSUN11 Tweetup
Accessible Twitter Update at CSUN11 TweetupDennis Lembree
 
"Twitter and Web Accessibility" INDATA Conference 2010
"Twitter and Web Accessibility" INDATA Conference 2010"Twitter and Web Accessibility" INDATA Conference 2010
"Twitter and Web Accessibility" INDATA Conference 2010Dennis Lembree
 
Accessible Twitter CSUN Tweetup 2010
Accessible Twitter CSUN Tweetup 2010Accessible Twitter CSUN Tweetup 2010
Accessible Twitter CSUN Tweetup 2010Dennis Lembree
 
EASI Webinar: Twitter And Web Accessibility
EASI Webinar: Twitter And Web AccessibilityEASI Webinar: Twitter And Web Accessibility
EASI Webinar: Twitter And Web AccessibilityDennis Lembree
 
Twitter and Web Accessibility AHG 2009 Nov12
Twitter and Web Accessibility AHG 2009 Nov12Twitter and Web Accessibility AHG 2009 Nov12
Twitter and Web Accessibility AHG 2009 Nov12Dennis Lembree
 
Accessible Twitter at Open Web Camp
Accessible Twitter at Open Web CampAccessible Twitter at Open Web Camp
Accessible Twitter at Open Web CampDennis Lembree
 
Accessible Twitter : ACCESS-IT@Web 2.0
Accessible Twitter : ACCESS-IT@Web 2.0Accessible Twitter : ACCESS-IT@Web 2.0
Accessible Twitter : ACCESS-IT@Web 2.0Dennis Lembree
 

More from Dennis Lembree (11)

SVG Icons and Screen Reader Accessibility
SVG Icons and Screen Reader AccessibilitySVG Icons and Screen Reader Accessibility
SVG Icons and Screen Reader Accessibility
 
Networking with Twitter, Part 2
Networking with Twitter, Part 2Networking with Twitter, Part 2
Networking with Twitter, Part 2
 
Networking with Twitter, Part 1
Networking with Twitter, Part 1Networking with Twitter, Part 1
Networking with Twitter, Part 1
 
Twitter and Web Accessibility (EASI Webinar)
Twitter and Web Accessibility (EASI Webinar)Twitter and Web Accessibility (EASI Webinar)
Twitter and Web Accessibility (EASI Webinar)
 
Accessible Twitter Update at CSUN11 Tweetup
Accessible Twitter Update at CSUN11 TweetupAccessible Twitter Update at CSUN11 Tweetup
Accessible Twitter Update at CSUN11 Tweetup
 
"Twitter and Web Accessibility" INDATA Conference 2010
"Twitter and Web Accessibility" INDATA Conference 2010"Twitter and Web Accessibility" INDATA Conference 2010
"Twitter and Web Accessibility" INDATA Conference 2010
 
Accessible Twitter CSUN Tweetup 2010
Accessible Twitter CSUN Tweetup 2010Accessible Twitter CSUN Tweetup 2010
Accessible Twitter CSUN Tweetup 2010
 
EASI Webinar: Twitter And Web Accessibility
EASI Webinar: Twitter And Web AccessibilityEASI Webinar: Twitter And Web Accessibility
EASI Webinar: Twitter And Web Accessibility
 
Twitter and Web Accessibility AHG 2009 Nov12
Twitter and Web Accessibility AHG 2009 Nov12Twitter and Web Accessibility AHG 2009 Nov12
Twitter and Web Accessibility AHG 2009 Nov12
 
Accessible Twitter at Open Web Camp
Accessible Twitter at Open Web CampAccessible Twitter at Open Web Camp
Accessible Twitter at Open Web Camp
 
Accessible Twitter : ACCESS-IT@Web 2.0
Accessible Twitter : ACCESS-IT@Web 2.0Accessible Twitter : ACCESS-IT@Web 2.0
Accessible Twitter : ACCESS-IT@Web 2.0
 

Recently uploaded

Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path MountBreaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path MountPuma Security, LLC
 
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 MenDelhi Call girls
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024The Digital Insurer
 
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 Nanonetsnaman860154
 
Maximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptxMaximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptxOnBoard
 
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024BookNet Canada
 
Unblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen FramesUnblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen FramesSinan KOZAK
 
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 slidevu2urc
 
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...gurkirankumar98700
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024Rafal Los
 
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...HostedbyConfluent
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationMichael W. Hawkins
 
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...Igalia
 
Handwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed textsHandwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed textsMaria Levchenko
 
Enhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for PartnersEnhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for PartnersThousandEyes
 
My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationMy Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationRidwan Fadjar
 
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.pptxHampshireHUG
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonAnna Loughnan Colquhoun
 
Google AI Hackathon: LLM based Evaluator for RAG
Google AI Hackathon: LLM based Evaluator for RAGGoogle AI Hackathon: LLM based Evaluator for RAG
Google AI Hackathon: LLM based Evaluator for RAGSujit Pal
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationRadu Cotescu
 

Recently uploaded (20)

Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path MountBreaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path Mount
 
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
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
 
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
 
Maximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptxMaximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptx
 
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
 
Unblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen FramesUnblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen Frames
 
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
 
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day Presentation
 
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
 
Handwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed textsHandwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed texts
 
Enhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for PartnersEnhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for Partners
 
My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationMy Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 Presentation
 
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
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
 
Google AI Hackathon: LLM based Evaluator for RAG
Google AI Hackathon: LLM based Evaluator for RAGGoogle AI Hackathon: LLM based Evaluator for RAG
Google AI Hackathon: LLM based Evaluator for RAG
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
 

How To Build An Accessible Web Application

  • 1. How to Build an Accessible Web Application (Easy Chirp) Presented by Dennis Lembrée Accessibility DC Meet-up Martin Luther King (MLK) Library November 15, 2011
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 25.
  • 26.
  • 27.
  • 28. ARIA - Landmark Roles role=“banner” role=“navigation” role=“contentinfo” role=“main” role=“complementary” role=“search”
  • 29.
  • 30.
  • 31.
  • 32. ARIA – Live Regions
  • 33.
  • 34.
  • 35.
  • 36.
  • 37.
  • 38.
  • 39.
  • 40.
  • 41.

Editor's Notes

  1. Thanks to John F Croston III (@jfc3)
  2. http://www.slideshare.net/ginader/the-5-layers-of-web-accessibility
  3. http://www.EasyChirp.com
  4. http://html5accessibility.com/
  5. http://browsershots.org/ http://www.alistapart.com/articles/responsive-web-design/
  6. http://www.smashingmagazine.com/2011/10/07/16-pixels-body-copy-anything-less-costly-mistake/ http://outlinenone.com/
  7. Text links remain. And sufficient text size.
  8. http://contrastrebellion.com/
  9. http://designfestival.com/when-and-how-to-visually-hide-content/
  10. http://yuilibrary.com/ http://zufelt.ca/blog/jquery-ui-accessibility-review-wrapup http://domscripting.com/presentations/xtech2006/
  11. http://www.w3.org/TR/wai-aria/
  12. http://www.html5accessibility.com/tests/landmarks.html
  13. http://www.w3.org/TR/wai-aria/states_and_properties#aria-live
  14. Any browser-based user-agent!
  15. http://sarahebourne.posterous.com/accessible-twitter-on-the-kindle
  16. http://www.webhostingsearch.com/articles/25-ways-to-make-your-site-more-accessible.php