SlideShare a Scribd company logo
1 of 75
Download to read offline
ColdFusion Summit 2016
Everyone's Invited!*
Meet	Accessibility	Requirements	With	ColdFusion	
*Except Chad. He knows what he did.
What’s this about?
Quick Overview
●  What do we mean by accessibility
●  What kind of requirements are there
●  How to meet these requirements
●  How Coldfusion can make this quick and
easy
●  Ensuring that compliance is maintained
●  Questions, hopefully followed by answers
But before we talk about that...
Dwarfs
I Friggin’ Love Dwarfs
Art by Federico Musetti
I Try Not to Think about Why
Art by Dave Dunstan
Unfortunately despite my love for the
men under the mountain, I cannot play
the best dwarf related game of of all time
Dwarf Fortress
Art by Borkur Eiriksson
Dwarf Fortress is the simulation game
from H-E-double hockey sticks
Build the Greatest Fortress Ever
Only Not with These Guys
With These Guys
Which Can Cause Problems
Art by Tim Dundee
Lots of problems
Actual Patch Notes
2004
●  Made them care about clothes more
2005
●  Fixed a bug where animals could rent rooms
●  Cleaned up the bear situation
2006
●  Added mouths
●  Added an aperture flag that stops mouths from
being gouged out
2007
●  Fixed a problem with blood hanging in air
2008
●  Made all undead respectful of each other
●  Stopped aerial births
●  Stopped looping dwarves from constantly trying
out gloves and boots when they should just pick
one and go
2010
●  Rain kills everything it lands on
●  Humans in Farming houses are naked
2011
●  Rodent men have no teeth
●  Serpent Men can Kick
●  Rodent men don't use their new teeth to bite
2012
●  Sleeping on a melting iceberg results in waking
up as a demon
●  Dwarf children die from embarrassment at not
being dressed by age 2
2015
●  Animal breeding is prevented if animals aren't
"willing to marry"
●  Cats dying for no reason - alcohol poisoning?
●  Incorrect use of "whom" in elf.txt
So we have a game about my favorite
thing, with unlimited story potential,
where all these amazing things can and
do happen, and I can’t play it.
Because it Looks Like This
And Yes I Know
But the Menus...the Menus
You have to use this to set up that
Finally, the point
There is a piece of amazing, high quality,
high functioning software that I
desperately want to use but I can’t
because it is not accessible.
It is our duty as developers to ensure that
our life-bettering software be available to
everyone. We must adhere to the
principles of accessibility.
The most important of these principles is:
Don’t be Ryan Seacrest
Ryan Seacrest is Not Accessible
Aren’t there laws about this?
Brief History Lesson
1973: Because Ryan Seacrest will soon be born, the U.S. Rehabilitation Act
prohibits discrimination on the basis of disability in programs conducted by
Federal agencies, in programs receiving Federal financial assistance, in
Federal employment, and in the employment practices of Federal contractors.
1998: The US Congress amended the Rehabilitation Act to require Federal
agencies to make their electronic and information technology accessible to
people with disabilities. The law applies to all Federal agencies when they
develop, procure, maintain or use electronic and information technology.
Under Section 508 agencies must give disabled employees and members of
the public access to information that is comparable to the access available to
others.
Two Slides Counts as Brief
1997: The W3C launched the Web Accessibility Initiative with endorsement by The White
House and W3C members.
2011: Steve is working at software company that creates software for FDA regulated
companies. The company has a chance to gain the FDA itself as a customer, contingent
on the system becoming 508 compliant. Steve gets the assignment.
2015: Steve starts to feel comfortable saying they are 508 compliant.
2016: This presentation happens.
No changes to the actual 508 specification since 1998
The Gist
The US Government (for the most part) cannot discriminate against
anyone based on ability. This means any software that they require
people use to do their jobs needs to be accessible to everyone.
This isn’t just about Government contracts, millions of people are not
able to interface with a computer the way you may be able to. If your
site/application isn’t accessible to them, you’re basically a huge jerk.
Don’t be a huge jerk.
Who’s Invited?
Color Blind People: We all know that green means good and red
means bad*. Not everyone knows which is which though.
Limited Mobility: Ever use your mouse so much your arm hurts?
Some people don’t have that problem.
Visually Impaired: Everything must be readable by a screen reader
and make sense when using it.
Hearing Impaired: Less of an issue on the Web, since there’s so
much text. Where there is audio though, keep these people in mind.
*Not actually, but we’re not going to get into that here.
So what do we need to know?
●  Don’t use color as the only way to know
something. If you make something red to
show it’s required, add an asterisk or the
word “required” or something else.
●  Don’t use dark gray text on a white gray
background.
●  “Branding” information is OK.
●  This is the hardest to enforce
I See your True Colors
●  Everything that can be interacted with needs
to reached by pressing tab.
●  Non-interactable text should not be.
●  Don’t use a div with an image as a button with
an onclick event.
●  Try not to use tabindex
Keepin’ Tabs on You
●  Drag and Drop functionality is convenient, fun,
engaging, sexy and good.
●  It’s also not 508 compliant.
●  We can still have it, just include another way
to do what you were doing with your dragging
and dropping like the may or may not be hot
Quit Draggin’ Me Down
Say What?
1. Subheaders need to be announced
2. The label needs to be tied to the text field,
the requiredness needs to be explained
3. This icon needs a helpful alt-text
4. The user needs to know they can’t edit
this field.
1
2
3
4
Table This for Later
●  Table cells need to be associated with
their row and column headers.
●  Headers with multiple cells need to have
mark up to explains what everything
belongs to.
●  Imagine having someone read a 50 row
database column to you.
Other Criteria without Puns
●  A text equivalent for every non-text
element shall be provided (e.g., via "alt",
"longdesc", or in element content).
●  Documents shall be organized so they
are readable without requiring an
associated style sheet.
●  Redundant text links shall be provided for
each active region of a server-side image
map.
●  Frames shall be titled with text that
facilitates frame identification and
navigation
●  Pages shall be designed to avoid causing
the screen to flicker with a frequency
greater than 2 Hz and lower than 55 Hz
●  Don’t use the marquee tag
●  When pages utilize scripting languages to
display content, or to create interface
elements, the information provided by the
script shall be identified with functional
text that can be read by Assistive
Technology.
●  A method shall be provided that permits
users to skip repetitive navigation links.
●  When a timed response is required, the
user shall be alerted and given sufficient
time to indicate more time is required.
●  Forms and Applets need to be as 508
compliant as the rest of your application.
OK, so how do we do all that?
I’m starting to see why this took four years
I have good news
Which naturally means I also have bad news
The Good News
Properly structured HTML will take care of a lot
of this for you.
Especially once you start using the ARIA
(Accessible Rich Internet Applications)
specification from the W3C.
You can talk about ARIA
●  First rule of ARIA use
○  If you can use a native HTML element or attribute with the
semantics and behaviour you require already built in, instead
of re-purposing an element and adding an ARIA role, state or
property to make it accessible, then do so.
●  Second rule of ARIA use
○  Do not change native semantics, unless you really have to.
This is bad
This is good
Just a taste
•  aria-atomic
•  aria-busy (state)
•  aria-controls
•  aria-current (state)
•  aria-describedby
•  aria-details
•  aria-disabled (state)
•  aria-dropeffect
•  aria-errormessage
•  aria-flowto
•  aria-grabbed (state)
●  aria-haspopup
●  aria-hidden (state)
●  aria-invalid (state)
●  aria-keyshortcuts
●  aria-label
●  aria-labelledby
●  aria-live
●  aria-owns
●  aria-relevant
Many element specific options also exist
By simply using a label element, adding the
word “required” to the label and the “aria-
required” attribute, I can make an entire
simple form 508 compliant.
Forms are easy
Adding the scope
attribute to our headers
is all we need.
Easy Tables are Easy
Now we actually have to
add headers to each td
which is easy in CF.
Hard Tables are Easy
The Bad News
●  This is all dependent on developers actually
using the proper syntax and building their
interfaces in a certain way.
●  One developer can ruin it for everyone
This developer will probably be named Chad
How can I possibly get everyone on my
team to remember to use proper HTML
syntax and use all these extra attributes?
I can’t get them to agree where the opening curly brace goes
MCML
Before you google “Roman Numeral Converter” it’s 1950
The Solution
●  MasterControl Markup Language (MCML)
was a library of custom tags that ensured that
every page that used them would be 508
compliant
●  They were precompiled, globally available
and most importantly requirable.
●  They also forced a standard format for our
CSS to expect
The “Front” End
The Back End
The Back End
It keeps getting better
●  We could require certain attributes - not just
for 508 issues - and throw errors alerting the
developer to what they needed. QA loved this
as they could require attributes they keyed off.
●  Our tags began building off each other,
increasing in complexity and power.
●  We experimented with cfc based tags instead
of cfm based.
Getting Better All the Time
●  Many tags used external jQuery components,
by picking one, we no longer had five different
solutions to the same problem.
●  Everyone knew what to use and how to use it
●  Editor highlighting and even autocomplete
were possible (cfeclipse)
●  We were the masters of our own destiny.
●  mcactionIcons
●  mcApplayer
●  mcApplayerParameter
●  mcbrowseButton
●  mcbutton
●  mcchart
●  mccheckBox
●  mccontent
●  mccookie
●  mccourseDropDown
●  mccss
●  mcdatePicker
●  mcdropDown
●  mcdropDownGroup
●  mcdropDownOption
●  mcfieldSet
We Made a Lot of Tags
●  mcheader
●  Mcimage
●  mcinputButton
●  mclifecycleDropDown
●  mclabel
●  mcminiList
●  mcpassword
●  mcradioButton
●  mcroleDropDown
●  mcsubHeader
●  mctable
●  mctableRow
●  mctableColumn
●  mctimePicker
●  mcuserPicker
●  And many, many more
It kind of sounds like absolute power may
have corrupted you.
Absolutely
Absolute power is pretty cool
Ok, that sounds great, if I were starting
from scratch on a new project but our
system is 12 years old. What do I do Mr.
Smart Guy?
Interns
How we did it
●  Developing custom tags with Coldfusion is
actually quick and easy
●  Two summers with me and two teams of
interns (four and two)
●  They’d pick a page and go through changing
all the tags to the new ones, I’d build what
they needed.
I Thought it Took Four Years
●  Other priorities would pop up
●  It took a long time to get the framework in
place and get the momentum to start
●  We had to wait on the FDA a couple times
●  Once we started getting to 90% was fast
●  We drug our feet on applets
Testing
Make Sure you Stay Good
●  There are scads of automatic testing
programs out there.
o  Don’t use them if you don’t have to, they
return too many false positives to be useful
●  Use a pre commit hook to make sure people
use your tags.
●  Manually test your tags on a special page
once a release.
Final Thoughts
This is important
This is hard
Start now
Put one person in charge
Make sure everyone is responsible
Don’t be Ryan Seacrest
Q&A
Hit me with your best shot
Enjoy your Pat Benatar earworm
Once You Go Steve You Never Leave
●  I podcast (a lot): www.digitalstrips.com
Web	Comics	
Wrestling	
Video	Games	
Childish Humor
●  I’m on Twitter : @Idahobo
●  I’m on Battlenet : Idahobo
Thank
you!

More Related Content

What's hot

Going native with html5 web components
Going native with html5 web componentsGoing native with html5 web components
Going native with html5 web componentsJames York
 
5 Reasons Why Your Website Is[n’t] a Native App (PrDC 2015)
5 Reasons Why Your Website Is[n’t] a Native App (PrDC 2015)5 Reasons Why Your Website Is[n’t] a Native App (PrDC 2015)
5 Reasons Why Your Website Is[n’t] a Native App (PrDC 2015)David Wesst
 
Acceptance Test Driven Development
Acceptance Test Driven DevelopmentAcceptance Test Driven Development
Acceptance Test Driven DevelopmentAmir Barylko
 
JavaScript Revolution - 5/Nov/13 - PrDC Saskatoon, SK
JavaScript Revolution - 5/Nov/13 - PrDC Saskatoon, SKJavaScript Revolution - 5/Nov/13 - PrDC Saskatoon, SK
JavaScript Revolution - 5/Nov/13 - PrDC Saskatoon, SKDavid Wesst
 
PhoneGap in a Day
PhoneGap in a DayPhoneGap in a Day
PhoneGap in a DayTroy Miles
 
HTML5: The Parts You Care About - 4/Nov/13 - PrDC Saskatoon, SK
HTML5: The Parts You Care About - 4/Nov/13 - PrDC Saskatoon, SKHTML5: The Parts You Care About - 4/Nov/13 - PrDC Saskatoon, SK
HTML5: The Parts You Care About - 4/Nov/13 - PrDC Saskatoon, SKDavid Wesst
 
Don't make me wait! or Building High-Performance Web Applications
Don't make me wait! or Building High-Performance Web ApplicationsDon't make me wait! or Building High-Performance Web Applications
Don't make me wait! or Building High-Performance Web ApplicationsStoyan Stefanov
 
Unobtrusive JavaScript with jQuery
Unobtrusive JavaScript with jQueryUnobtrusive JavaScript with jQuery
Unobtrusive JavaScript with jQuerySimon Willison
 
Untangling spring week10
Untangling spring week10Untangling spring week10
Untangling spring week10Derek Jacoby
 
Can we make es6 the baseline of the “modern web”? - BrazilJS 2105
Can we make es6 the baseline of the “modern web”? - BrazilJS 2105 Can we make es6 the baseline of the “modern web”? - BrazilJS 2105
Can we make es6 the baseline of the “modern web”? - BrazilJS 2105 Christian Heilmann
 
The StartUp Agency - A Case Study on CFPB
The StartUp Agency - A Case Study on CFPBThe StartUp Agency - A Case Study on CFPB
The StartUp Agency - A Case Study on CFPBGovLoop
 
Tech Thursdays: Building Products
Tech Thursdays: Building ProductsTech Thursdays: Building Products
Tech Thursdays: Building ProductsHayden Bleasel
 
Simple Computer Tips - Screen Shots, Passwords, etc
Simple Computer Tips - Screen Shots, Passwords, etcSimple Computer Tips - Screen Shots, Passwords, etc
Simple Computer Tips - Screen Shots, Passwords, etcHolly Akers
 
Cf objective2014 software-craftsmanship
Cf objective2014 software-craftsmanshipCf objective2014 software-craftsmanship
Cf objective2014 software-craftsmanshipColdFusionConference
 
Jared Whitlock Open Source In The Enterprise Plone @ Novell
Jared Whitlock   Open Source In The Enterprise    Plone @ NovellJared Whitlock   Open Source In The Enterprise    Plone @ Novell
Jared Whitlock Open Source In The Enterprise Plone @ NovellVincenzo Barone
 
Untangling - fall2017 - week5
Untangling - fall2017 - week5Untangling - fall2017 - week5
Untangling - fall2017 - week5Derek Jacoby
 
Front-End Modernization for Mortals
Front-End Modernization for MortalsFront-End Modernization for Mortals
Front-End Modernization for Mortalscgack
 

What's hot (19)

Going native with html5 web components
Going native with html5 web componentsGoing native with html5 web components
Going native with html5 web components
 
5 Reasons Why Your Website Is[n’t] a Native App (PrDC 2015)
5 Reasons Why Your Website Is[n’t] a Native App (PrDC 2015)5 Reasons Why Your Website Is[n’t] a Native App (PrDC 2015)
5 Reasons Why Your Website Is[n’t] a Native App (PrDC 2015)
 
Acceptance Test Driven Development
Acceptance Test Driven DevelopmentAcceptance Test Driven Development
Acceptance Test Driven Development
 
Untangling4
Untangling4Untangling4
Untangling4
 
JavaScript Revolution - 5/Nov/13 - PrDC Saskatoon, SK
JavaScript Revolution - 5/Nov/13 - PrDC Saskatoon, SKJavaScript Revolution - 5/Nov/13 - PrDC Saskatoon, SK
JavaScript Revolution - 5/Nov/13 - PrDC Saskatoon, SK
 
PhoneGap in a Day
PhoneGap in a DayPhoneGap in a Day
PhoneGap in a Day
 
HTML5: The Parts You Care About - 4/Nov/13 - PrDC Saskatoon, SK
HTML5: The Parts You Care About - 4/Nov/13 - PrDC Saskatoon, SKHTML5: The Parts You Care About - 4/Nov/13 - PrDC Saskatoon, SK
HTML5: The Parts You Care About - 4/Nov/13 - PrDC Saskatoon, SK
 
Don't make me wait! or Building High-Performance Web Applications
Don't make me wait! or Building High-Performance Web ApplicationsDon't make me wait! or Building High-Performance Web Applications
Don't make me wait! or Building High-Performance Web Applications
 
Unobtrusive JavaScript with jQuery
Unobtrusive JavaScript with jQueryUnobtrusive JavaScript with jQuery
Unobtrusive JavaScript with jQuery
 
Untangling spring week10
Untangling spring week10Untangling spring week10
Untangling spring week10
 
Universal apps lightning talk
Universal apps lightning talk Universal apps lightning talk
Universal apps lightning talk
 
Can we make es6 the baseline of the “modern web”? - BrazilJS 2105
Can we make es6 the baseline of the “modern web”? - BrazilJS 2105 Can we make es6 the baseline of the “modern web”? - BrazilJS 2105
Can we make es6 the baseline of the “modern web”? - BrazilJS 2105
 
The StartUp Agency - A Case Study on CFPB
The StartUp Agency - A Case Study on CFPBThe StartUp Agency - A Case Study on CFPB
The StartUp Agency - A Case Study on CFPB
 
Tech Thursdays: Building Products
Tech Thursdays: Building ProductsTech Thursdays: Building Products
Tech Thursdays: Building Products
 
Simple Computer Tips - Screen Shots, Passwords, etc
Simple Computer Tips - Screen Shots, Passwords, etcSimple Computer Tips - Screen Shots, Passwords, etc
Simple Computer Tips - Screen Shots, Passwords, etc
 
Cf objective2014 software-craftsmanship
Cf objective2014 software-craftsmanshipCf objective2014 software-craftsmanship
Cf objective2014 software-craftsmanship
 
Jared Whitlock Open Source In The Enterprise Plone @ Novell
Jared Whitlock   Open Source In The Enterprise    Plone @ NovellJared Whitlock   Open Source In The Enterprise    Plone @ Novell
Jared Whitlock Open Source In The Enterprise Plone @ Novell
 
Untangling - fall2017 - week5
Untangling - fall2017 - week5Untangling - fall2017 - week5
Untangling - fall2017 - week5
 
Front-End Modernization for Mortals
Front-End Modernization for MortalsFront-End Modernization for Mortals
Front-End Modernization for Mortals
 

Viewers also liked

How do I write Testable Javascript
How do I write Testable JavascriptHow do I write Testable Javascript
How do I write Testable JavascriptColdFusionConference
 
Expand Your ColdFusion App Power with AWS
Expand Your ColdFusion App Power with AWSExpand Your ColdFusion App Power with AWS
Expand Your ColdFusion App Power with AWSColdFusionConference
 
Safeguarding applications from cyber attacks
Safeguarding applications from cyber attacksSafeguarding applications from cyber attacks
Safeguarding applications from cyber attacksColdFusionConference
 
Emberjs building-ambitious-web-applications
Emberjs building-ambitious-web-applicationsEmberjs building-ambitious-web-applications
Emberjs building-ambitious-web-applicationsColdFusionConference
 
Refactoring your legacy app to a MVC framework
Refactoring your legacy app to a MVC frameworkRefactoring your legacy app to a MVC framework
Refactoring your legacy app to a MVC frameworkColdFusionConference
 
Hey my web app is slow where is the problem
Hey my web app is slow where is the problemHey my web app is slow where is the problem
Hey my web app is slow where is the problemColdFusionConference
 
Cfobjective fusion reactor sponsor talk
Cfobjective fusion reactor sponsor talkCfobjective fusion reactor sponsor talk
Cfobjective fusion reactor sponsor talkColdFusionConference
 
Getting started with mobile application development
Getting started with mobile application developmentGetting started with mobile application development
Getting started with mobile application developmentColdFusionConference
 
Monitoring CF What are my options? Why Should I?
Monitoring CF What are my options? Why Should I?Monitoring CF What are my options? Why Should I?
Monitoring CF What are my options? Why Should I?ColdFusionConference
 

Viewers also liked (20)

CFML Sessions For Dummies
CFML Sessions For DummiesCFML Sessions For Dummies
CFML Sessions For Dummies
 
Workflows and Digital Signatures
Workflows and Digital SignaturesWorkflows and Digital Signatures
Workflows and Digital Signatures
 
Git sourcecontrolpreso
Git sourcecontrolpresoGit sourcecontrolpreso
Git sourcecontrolpreso
 
Web hackingtools 2015
Web hackingtools 2015Web hackingtools 2015
Web hackingtools 2015
 
How do I write Testable Javascript
How do I write Testable JavascriptHow do I write Testable Javascript
How do I write Testable Javascript
 
Expand Your ColdFusion App Power with AWS
Expand Your ColdFusion App Power with AWSExpand Your ColdFusion App Power with AWS
Expand Your ColdFusion App Power with AWS
 
Safeguarding applications from cyber attacks
Safeguarding applications from cyber attacksSafeguarding applications from cyber attacks
Safeguarding applications from cyber attacks
 
Emberjs building-ambitious-web-applications
Emberjs building-ambitious-web-applicationsEmberjs building-ambitious-web-applications
Emberjs building-ambitious-web-applications
 
Cold fusion is racecar fast
Cold fusion is racecar fastCold fusion is racecar fast
Cold fusion is racecar fast
 
Test box bdd
Test box bddTest box bdd
Test box bdd
 
Hidden Gems in ColdFusion 11
Hidden Gems in ColdFusion 11Hidden Gems in ColdFusion 11
Hidden Gems in ColdFusion 11
 
Where is cold fusion headed
Where is cold fusion headedWhere is cold fusion headed
Where is cold fusion headed
 
Refactoring your legacy app to a MVC framework
Refactoring your legacy app to a MVC frameworkRefactoring your legacy app to a MVC framework
Refactoring your legacy app to a MVC framework
 
Effective version control
Effective version controlEffective version control
Effective version control
 
Hey my web app is slow where is the problem
Hey my web app is slow where is the problemHey my web app is slow where is the problem
Hey my web app is slow where is the problem
 
Cfobjective fusion reactor sponsor talk
Cfobjective fusion reactor sponsor talkCfobjective fusion reactor sponsor talk
Cfobjective fusion reactor sponsor talk
 
Getting started with mobile application development
Getting started with mobile application developmentGetting started with mobile application development
Getting started with mobile application development
 
Monitoring CF What are my options? Why Should I?
Monitoring CF What are my options? Why Should I?Monitoring CF What are my options? Why Should I?
Monitoring CF What are my options? Why Should I?
 
Hidden gems in cf2016
Hidden gems in cf2016Hidden gems in cf2016
Hidden gems in cf2016
 
Paying off-emotional-debt-2
Paying off-emotional-debt-2Paying off-emotional-debt-2
Paying off-emotional-debt-2
 

Similar to Everyones invited! Meet accesibility requirements with ColdFusion

HTML5 - Moving from hacks to solutions
HTML5 - Moving from hacks to solutionsHTML5 - Moving from hacks to solutions
HTML5 - Moving from hacks to solutionsChristian Heilmann
 
Prototyping Accessibility - WordCamp Europe 2018
Prototyping Accessibility - WordCamp Europe 2018Prototyping Accessibility - WordCamp Europe 2018
Prototyping Accessibility - WordCamp Europe 2018Adrian Roselli
 
Igniting Next Level Productivity with AI-Infused Data Integration Workflows
Igniting Next Level Productivity with AI-Infused Data Integration Workflows Igniting Next Level Productivity with AI-Infused Data Integration Workflows
Igniting Next Level Productivity with AI-Infused Data Integration Workflows Safe Software
 
Aboutdistanceconversion blogspot com
Aboutdistanceconversion blogspot comAboutdistanceconversion blogspot com
Aboutdistanceconversion blogspot comGabriel Barlow
 
Top 10 Tips for Making Your Website Accessible
Top 10 Tips for Making Your Website AccessibleTop 10 Tips for Making Your Website Accessible
Top 10 Tips for Making Your Website AccessibleAEL Data
 
Miles of Accessibility - An 'Accessibility 101'
Miles of Accessibility - An 'Accessibility 101' Miles of Accessibility - An 'Accessibility 101'
Miles of Accessibility - An 'Accessibility 101' Intopia
 
13 Signs Your UX Needs an Exorcism
13 Signs Your UX Needs an Exorcism13 Signs Your UX Needs an Exorcism
13 Signs Your UX Needs an ExorcismCrystal Beasley
 
Introduction to react js
Introduction to react jsIntroduction to react js
Introduction to react jsMunirMahmud3
 
top developer mistakes
top developer mistakes top developer mistakes
top developer mistakes Hanokh Aloni
 
Intro to Web Accessibility
Intro to Web Accessibility Intro to Web Accessibility
Intro to Web Accessibility Ashley Dzick
 
Pp3 - Pixel Perfect Precision V3
Pp3 - Pixel Perfect Precision V3Pp3 - Pixel Perfect Precision V3
Pp3 - Pixel Perfect Precision V3Olybop .fr
 
Developing User Stories - The Dialexa Way
Developing User Stories - The Dialexa WayDeveloping User Stories - The Dialexa Way
Developing User Stories - The Dialexa WayDialexa
 
Another Day In Paradise
Another Day In ParadiseAnother Day In Paradise
Another Day In Paradisekum72
 
Big guns for small guys (reloaded)
Big guns for small guys (reloaded)Big guns for small guys (reloaded)
Big guns for small guys (reloaded)Jorge López-Lago
 
Making Content Accessible for Chatbots and Voice Interfaces with Joe Gelb
Making Content Accessible for Chatbots and Voice Interfaces with Joe GelbMaking Content Accessible for Chatbots and Voice Interfaces with Joe Gelb
Making Content Accessible for Chatbots and Voice Interfaces with Joe GelbInformation Development World
 
Mobile App Feature Configuration and A/B Experiments
Mobile App Feature Configuration and A/B ExperimentsMobile App Feature Configuration and A/B Experiments
Mobile App Feature Configuration and A/B Experimentslacyrhoades
 
corePHP Usability Accessibility by Steven Pignataro
corePHP Usability Accessibility by Steven PignatarocorePHP Usability Accessibility by Steven Pignataro
corePHP Usability Accessibility by Steven PignataroJohn Coonen
 

Similar to Everyones invited! Meet accesibility requirements with ColdFusion (20)

HTML5 - Moving from hacks to solutions
HTML5 - Moving from hacks to solutionsHTML5 - Moving from hacks to solutions
HTML5 - Moving from hacks to solutions
 
Accessibility Usability Professional Summry
Accessibility Usability Professional SummryAccessibility Usability Professional Summry
Accessibility Usability Professional Summry
 
Prototyping Accessibility - WordCamp Europe 2018
Prototyping Accessibility - WordCamp Europe 2018Prototyping Accessibility - WordCamp Europe 2018
Prototyping Accessibility - WordCamp Europe 2018
 
Igniting Next Level Productivity with AI-Infused Data Integration Workflows
Igniting Next Level Productivity with AI-Infused Data Integration Workflows Igniting Next Level Productivity with AI-Infused Data Integration Workflows
Igniting Next Level Productivity with AI-Infused Data Integration Workflows
 
Aboutdistanceconversion blogspot com
Aboutdistanceconversion blogspot comAboutdistanceconversion blogspot com
Aboutdistanceconversion blogspot com
 
Top 10 Tips for Making Your Website Accessible
Top 10 Tips for Making Your Website AccessibleTop 10 Tips for Making Your Website Accessible
Top 10 Tips for Making Your Website Accessible
 
Usability thinking
Usability thinkingUsability thinking
Usability thinking
 
Miles of Accessibility - An 'Accessibility 101'
Miles of Accessibility - An 'Accessibility 101' Miles of Accessibility - An 'Accessibility 101'
Miles of Accessibility - An 'Accessibility 101'
 
13 Signs Your UX Needs an Exorcism
13 Signs Your UX Needs an Exorcism13 Signs Your UX Needs an Exorcism
13 Signs Your UX Needs an Exorcism
 
chatgpt.pptx
chatgpt.pptxchatgpt.pptx
chatgpt.pptx
 
Introduction to react js
Introduction to react jsIntroduction to react js
Introduction to react js
 
top developer mistakes
top developer mistakes top developer mistakes
top developer mistakes
 
Intro to Web Accessibility
Intro to Web Accessibility Intro to Web Accessibility
Intro to Web Accessibility
 
Pp3 - Pixel Perfect Precision V3
Pp3 - Pixel Perfect Precision V3Pp3 - Pixel Perfect Precision V3
Pp3 - Pixel Perfect Precision V3
 
Developing User Stories - The Dialexa Way
Developing User Stories - The Dialexa WayDeveloping User Stories - The Dialexa Way
Developing User Stories - The Dialexa Way
 
Another Day In Paradise
Another Day In ParadiseAnother Day In Paradise
Another Day In Paradise
 
Big guns for small guys (reloaded)
Big guns for small guys (reloaded)Big guns for small guys (reloaded)
Big guns for small guys (reloaded)
 
Making Content Accessible for Chatbots and Voice Interfaces with Joe Gelb
Making Content Accessible for Chatbots and Voice Interfaces with Joe GelbMaking Content Accessible for Chatbots and Voice Interfaces with Joe Gelb
Making Content Accessible for Chatbots and Voice Interfaces with Joe Gelb
 
Mobile App Feature Configuration and A/B Experiments
Mobile App Feature Configuration and A/B ExperimentsMobile App Feature Configuration and A/B Experiments
Mobile App Feature Configuration and A/B Experiments
 
corePHP Usability Accessibility by Steven Pignataro
corePHP Usability Accessibility by Steven PignatarocorePHP Usability Accessibility by Steven Pignataro
corePHP Usability Accessibility by Steven Pignataro
 

More from ColdFusionConference

Building better SQL Server Databases
Building better SQL Server DatabasesBuilding better SQL Server Databases
Building better SQL Server DatabasesColdFusionConference
 
API Economy, Realizing the Business Value of APIs
API Economy, Realizing the Business Value of APIsAPI Economy, Realizing the Business Value of APIs
API Economy, Realizing the Business Value of APIsColdFusionConference
 
Crafting ColdFusion Applications like an Architect
Crafting ColdFusion Applications like an ArchitectCrafting ColdFusion Applications like an Architect
Crafting ColdFusion Applications like an ArchitectColdFusionConference
 
Security And Access Control For APIS using CF API Manager
Security And Access Control For APIS using CF API ManagerSecurity And Access Control For APIS using CF API Manager
Security And Access Control For APIS using CF API ManagerColdFusionConference
 
Monetizing Business Models: ColdFusion and APIS
Monetizing Business Models: ColdFusion and APISMonetizing Business Models: ColdFusion and APIS
Monetizing Business Models: ColdFusion and APISColdFusionConference
 
Become a Security Rockstar with ColdFusion 2016
Become a Security Rockstar with ColdFusion 2016Become a Security Rockstar with ColdFusion 2016
Become a Security Rockstar with ColdFusion 2016ColdFusionConference
 
Developer Insights for Application Upgrade to ColdFusion 2016
Developer Insights for Application Upgrade to ColdFusion 2016Developer Insights for Application Upgrade to ColdFusion 2016
Developer Insights for Application Upgrade to ColdFusion 2016ColdFusionConference
 
ColdFusion Keynote: Building the Agile Web Since 1995
ColdFusion Keynote: Building the Agile Web Since 1995ColdFusion Keynote: Building the Agile Web Since 1995
ColdFusion Keynote: Building the Agile Web Since 1995ColdFusionConference
 
Super Fast Application development with Mura CMS
Super Fast Application development with Mura CMSSuper Fast Application development with Mura CMS
Super Fast Application development with Mura CMSColdFusionConference
 
Build your own secure and real-time dashboard for mobile and web
Build your own secure and real-time dashboard for mobile and webBuild your own secure and real-time dashboard for mobile and web
Build your own secure and real-time dashboard for mobile and webColdFusionConference
 

More from ColdFusionConference (20)

Api manager preconference
Api manager preconferenceApi manager preconference
Api manager preconference
 
Cf ppt vsr
Cf ppt vsrCf ppt vsr
Cf ppt vsr
 
Building better SQL Server Databases
Building better SQL Server DatabasesBuilding better SQL Server Databases
Building better SQL Server Databases
 
API Economy, Realizing the Business Value of APIs
API Economy, Realizing the Business Value of APIsAPI Economy, Realizing the Business Value of APIs
API Economy, Realizing the Business Value of APIs
 
Don't just pdf, Smart PDF
Don't just pdf, Smart PDFDon't just pdf, Smart PDF
Don't just pdf, Smart PDF
 
Crafting ColdFusion Applications like an Architect
Crafting ColdFusion Applications like an ArchitectCrafting ColdFusion Applications like an Architect
Crafting ColdFusion Applications like an Architect
 
Security And Access Control For APIS using CF API Manager
Security And Access Control For APIS using CF API ManagerSecurity And Access Control For APIS using CF API Manager
Security And Access Control For APIS using CF API Manager
 
Monetizing Business Models: ColdFusion and APIS
Monetizing Business Models: ColdFusion and APISMonetizing Business Models: ColdFusion and APIS
Monetizing Business Models: ColdFusion and APIS
 
Become a Security Rockstar with ColdFusion 2016
Become a Security Rockstar with ColdFusion 2016Become a Security Rockstar with ColdFusion 2016
Become a Security Rockstar with ColdFusion 2016
 
ColdFusion in Transit action
ColdFusion in Transit actionColdFusion in Transit action
ColdFusion in Transit action
 
Developer Insights for Application Upgrade to ColdFusion 2016
Developer Insights for Application Upgrade to ColdFusion 2016Developer Insights for Application Upgrade to ColdFusion 2016
Developer Insights for Application Upgrade to ColdFusion 2016
 
ColdFusion Keynote: Building the Agile Web Since 1995
ColdFusion Keynote: Building the Agile Web Since 1995ColdFusion Keynote: Building the Agile Web Since 1995
ColdFusion Keynote: Building the Agile Web Since 1995
 
Instant ColdFusion with Vagrant
Instant ColdFusion with VagrantInstant ColdFusion with Vagrant
Instant ColdFusion with Vagrant
 
Restful services with ColdFusion
Restful services with ColdFusionRestful services with ColdFusion
Restful services with ColdFusion
 
Super Fast Application development with Mura CMS
Super Fast Application development with Mura CMSSuper Fast Application development with Mura CMS
Super Fast Application development with Mura CMS
 
Build your own secure and real-time dashboard for mobile and web
Build your own secure and real-time dashboard for mobile and webBuild your own secure and real-time dashboard for mobile and web
Build your own secure and real-time dashboard for mobile and web
 
Why Everyone else writes bad code
Why Everyone else writes bad codeWhy Everyone else writes bad code
Why Everyone else writes bad code
 
Securing applications
Securing applicationsSecuring applications
Securing applications
 
Testing automaton
Testing automatonTesting automaton
Testing automaton
 
Rest ful tools for lazy experts
Rest ful tools for lazy expertsRest ful tools for lazy experts
Rest ful tools for lazy experts
 

Recently uploaded

IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsEnterprise Knowledge
 
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 2024The Digital Insurer
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationMichael W. Hawkins
 
A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024Results
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...Martijn de Jong
 
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 2024The Digital Insurer
 
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
 
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
 
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
 
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.pdfEnterprise Knowledge
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfsudhanshuwaghmare1
 
[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.pdfhans926745
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...Neo4j
 
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
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)Gabriella Davis
 
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking MenDelhi Call girls
 
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxFactors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxKatpro Technologies
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Miguel Araújo
 
Advantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessAdvantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessPixlogix Infotech
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?Igalia
 

Recently uploaded (20)

IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI Solutions
 
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
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day Presentation
 
A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
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
 
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...
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
 
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
 
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
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.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
[2024]Digital Global Overview Report 2024 Meltwater.pdf
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
 
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
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
 
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
 
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxFactors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
Advantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessAdvantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your Business
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?
 

Everyones invited! Meet accesibility requirements with ColdFusion

  • 4. Quick Overview ●  What do we mean by accessibility ●  What kind of requirements are there ●  How to meet these requirements ●  How Coldfusion can make this quick and easy ●  Ensuring that compliance is maintained ●  Questions, hopefully followed by answers
  • 5. But before we talk about that...
  • 7. I Friggin’ Love Dwarfs Art by Federico Musetti
  • 8. I Try Not to Think about Why Art by Dave Dunstan
  • 9. Unfortunately despite my love for the men under the mountain, I cannot play the best dwarf related game of of all time
  • 10. Dwarf Fortress Art by Borkur Eiriksson
  • 11. Dwarf Fortress is the simulation game from H-E-double hockey sticks
  • 12. Build the Greatest Fortress Ever
  • 13. Only Not with These Guys
  • 15. Which Can Cause Problems Art by Tim Dundee Lots of problems
  • 16. Actual Patch Notes 2004 ●  Made them care about clothes more 2005 ●  Fixed a bug where animals could rent rooms ●  Cleaned up the bear situation 2006 ●  Added mouths ●  Added an aperture flag that stops mouths from being gouged out 2007 ●  Fixed a problem with blood hanging in air 2008 ●  Made all undead respectful of each other ●  Stopped aerial births ●  Stopped looping dwarves from constantly trying out gloves and boots when they should just pick one and go 2010 ●  Rain kills everything it lands on ●  Humans in Farming houses are naked 2011 ●  Rodent men have no teeth ●  Serpent Men can Kick ●  Rodent men don't use their new teeth to bite 2012 ●  Sleeping on a melting iceberg results in waking up as a demon ●  Dwarf children die from embarrassment at not being dressed by age 2 2015 ●  Animal breeding is prevented if animals aren't "willing to marry" ●  Cats dying for no reason - alcohol poisoning? ●  Incorrect use of "whom" in elf.txt
  • 17. So we have a game about my favorite thing, with unlimited story potential, where all these amazing things can and do happen, and I can’t play it.
  • 18. Because it Looks Like This
  • 19. And Yes I Know
  • 20. But the Menus...the Menus You have to use this to set up that
  • 22. There is a piece of amazing, high quality, high functioning software that I desperately want to use but I can’t because it is not accessible.
  • 23. It is our duty as developers to ensure that our life-bettering software be available to everyone. We must adhere to the principles of accessibility.
  • 24. The most important of these principles is:
  • 25. Don’t be Ryan Seacrest
  • 26. Ryan Seacrest is Not Accessible
  • 27. Aren’t there laws about this?
  • 28. Brief History Lesson 1973: Because Ryan Seacrest will soon be born, the U.S. Rehabilitation Act prohibits discrimination on the basis of disability in programs conducted by Federal agencies, in programs receiving Federal financial assistance, in Federal employment, and in the employment practices of Federal contractors. 1998: The US Congress amended the Rehabilitation Act to require Federal agencies to make their electronic and information technology accessible to people with disabilities. The law applies to all Federal agencies when they develop, procure, maintain or use electronic and information technology. Under Section 508 agencies must give disabled employees and members of the public access to information that is comparable to the access available to others.
  • 29. Two Slides Counts as Brief 1997: The W3C launched the Web Accessibility Initiative with endorsement by The White House and W3C members. 2011: Steve is working at software company that creates software for FDA regulated companies. The company has a chance to gain the FDA itself as a customer, contingent on the system becoming 508 compliant. Steve gets the assignment. 2015: Steve starts to feel comfortable saying they are 508 compliant. 2016: This presentation happens. No changes to the actual 508 specification since 1998
  • 30. The Gist The US Government (for the most part) cannot discriminate against anyone based on ability. This means any software that they require people use to do their jobs needs to be accessible to everyone. This isn’t just about Government contracts, millions of people are not able to interface with a computer the way you may be able to. If your site/application isn’t accessible to them, you’re basically a huge jerk. Don’t be a huge jerk.
  • 31. Who’s Invited? Color Blind People: We all know that green means good and red means bad*. Not everyone knows which is which though. Limited Mobility: Ever use your mouse so much your arm hurts? Some people don’t have that problem. Visually Impaired: Everything must be readable by a screen reader and make sense when using it. Hearing Impaired: Less of an issue on the Web, since there’s so much text. Where there is audio though, keep these people in mind. *Not actually, but we’re not going to get into that here.
  • 32. So what do we need to know?
  • 33. ●  Don’t use color as the only way to know something. If you make something red to show it’s required, add an asterisk or the word “required” or something else. ●  Don’t use dark gray text on a white gray background. ●  “Branding” information is OK. ●  This is the hardest to enforce I See your True Colors
  • 34. ●  Everything that can be interacted with needs to reached by pressing tab. ●  Non-interactable text should not be. ●  Don’t use a div with an image as a button with an onclick event. ●  Try not to use tabindex Keepin’ Tabs on You
  • 35. ●  Drag and Drop functionality is convenient, fun, engaging, sexy and good. ●  It’s also not 508 compliant. ●  We can still have it, just include another way to do what you were doing with your dragging and dropping like the may or may not be hot Quit Draggin’ Me Down
  • 36. Say What? 1. Subheaders need to be announced 2. The label needs to be tied to the text field, the requiredness needs to be explained 3. This icon needs a helpful alt-text 4. The user needs to know they can’t edit this field. 1 2 3 4
  • 37. Table This for Later ●  Table cells need to be associated with their row and column headers. ●  Headers with multiple cells need to have mark up to explains what everything belongs to. ●  Imagine having someone read a 50 row database column to you.
  • 38. Other Criteria without Puns ●  A text equivalent for every non-text element shall be provided (e.g., via "alt", "longdesc", or in element content). ●  Documents shall be organized so they are readable without requiring an associated style sheet. ●  Redundant text links shall be provided for each active region of a server-side image map. ●  Frames shall be titled with text that facilitates frame identification and navigation ●  Pages shall be designed to avoid causing the screen to flicker with a frequency greater than 2 Hz and lower than 55 Hz ●  Don’t use the marquee tag ●  When pages utilize scripting languages to display content, or to create interface elements, the information provided by the script shall be identified with functional text that can be read by Assistive Technology. ●  A method shall be provided that permits users to skip repetitive navigation links. ●  When a timed response is required, the user shall be alerted and given sufficient time to indicate more time is required. ●  Forms and Applets need to be as 508 compliant as the rest of your application.
  • 39. OK, so how do we do all that? I’m starting to see why this took four years
  • 40. I have good news Which naturally means I also have bad news
  • 41. The Good News Properly structured HTML will take care of a lot of this for you. Especially once you start using the ARIA (Accessible Rich Internet Applications) specification from the W3C.
  • 42. You can talk about ARIA ●  First rule of ARIA use ○  If you can use a native HTML element or attribute with the semantics and behaviour you require already built in, instead of re-purposing an element and adding an ARIA role, state or property to make it accessible, then do so. ●  Second rule of ARIA use ○  Do not change native semantics, unless you really have to. This is bad This is good
  • 43. Just a taste •  aria-atomic •  aria-busy (state) •  aria-controls •  aria-current (state) •  aria-describedby •  aria-details •  aria-disabled (state) •  aria-dropeffect •  aria-errormessage •  aria-flowto •  aria-grabbed (state) ●  aria-haspopup ●  aria-hidden (state) ●  aria-invalid (state) ●  aria-keyshortcuts ●  aria-label ●  aria-labelledby ●  aria-live ●  aria-owns ●  aria-relevant Many element specific options also exist
  • 44. By simply using a label element, adding the word “required” to the label and the “aria- required” attribute, I can make an entire simple form 508 compliant. Forms are easy
  • 45. Adding the scope attribute to our headers is all we need. Easy Tables are Easy
  • 46. Now we actually have to add headers to each td which is easy in CF. Hard Tables are Easy
  • 47. The Bad News ●  This is all dependent on developers actually using the proper syntax and building their interfaces in a certain way. ●  One developer can ruin it for everyone This developer will probably be named Chad
  • 48. How can I possibly get everyone on my team to remember to use proper HTML syntax and use all these extra attributes? I can’t get them to agree where the opening curly brace goes
  • 49. MCML Before you google “Roman Numeral Converter” it’s 1950
  • 50. The Solution ●  MasterControl Markup Language (MCML) was a library of custom tags that ensured that every page that used them would be 508 compliant ●  They were precompiled, globally available and most importantly requirable. ●  They also forced a standard format for our CSS to expect
  • 54. It keeps getting better ●  We could require certain attributes - not just for 508 issues - and throw errors alerting the developer to what they needed. QA loved this as they could require attributes they keyed off. ●  Our tags began building off each other, increasing in complexity and power. ●  We experimented with cfc based tags instead of cfm based.
  • 55. Getting Better All the Time ●  Many tags used external jQuery components, by picking one, we no longer had five different solutions to the same problem. ●  Everyone knew what to use and how to use it ●  Editor highlighting and even autocomplete were possible (cfeclipse) ●  We were the masters of our own destiny.
  • 56. ●  mcactionIcons ●  mcApplayer ●  mcApplayerParameter ●  mcbrowseButton ●  mcbutton ●  mcchart ●  mccheckBox ●  mccontent ●  mccookie ●  mccourseDropDown ●  mccss ●  mcdatePicker ●  mcdropDown ●  mcdropDownGroup ●  mcdropDownOption ●  mcfieldSet We Made a Lot of Tags ●  mcheader ●  Mcimage ●  mcinputButton ●  mclifecycleDropDown ●  mclabel ●  mcminiList ●  mcpassword ●  mcradioButton ●  mcroleDropDown ●  mcsubHeader ●  mctable ●  mctableRow ●  mctableColumn ●  mctimePicker ●  mcuserPicker ●  And many, many more
  • 57. It kind of sounds like absolute power may have corrupted you.
  • 59. Ok, that sounds great, if I were starting from scratch on a new project but our system is 12 years old. What do I do Mr. Smart Guy?
  • 61. How we did it ●  Developing custom tags with Coldfusion is actually quick and easy ●  Two summers with me and two teams of interns (four and two) ●  They’d pick a page and go through changing all the tags to the new ones, I’d build what they needed.
  • 62. I Thought it Took Four Years ●  Other priorities would pop up ●  It took a long time to get the framework in place and get the momentum to start ●  We had to wait on the FDA a couple times ●  Once we started getting to 90% was fast ●  We drug our feet on applets
  • 64. Make Sure you Stay Good ●  There are scads of automatic testing programs out there. o  Don’t use them if you don’t have to, they return too many false positives to be useful ●  Use a pre commit hook to make sure people use your tags. ●  Manually test your tags on a special page once a release.
  • 69. Put one person in charge
  • 70. Make sure everyone is responsible
  • 71. Don’t be Ryan Seacrest
  • 72. Q&A
  • 73. Hit me with your best shot Enjoy your Pat Benatar earworm
  • 74. Once You Go Steve You Never Leave ●  I podcast (a lot): www.digitalstrips.com Web Comics Wrestling Video Games Childish Humor ●  I’m on Twitter : @Idahobo ●  I’m on Battlenet : Idahobo