SlideShare a Scribd company logo
1 of 28
Download to read offline
Responsible Design
Accountable Accessibility



                       Billy Gregory
                    @thebillygregory
“Through code ownership, I became more
Responsible for the overall Design of my code.
I believed that by holding myself Accountable
for the end result, I could directly improve the
Accessibility of my work.”
 A tall, questionably handsome, man at the front of the room
About me
I’m a front end developer at CGI in Toronto, Canada.

I am NOT an Accessibility Specialist, expert, guru, ninja, etc…

What I am is a developer who has grown to understand the
importance of Accessibility, not only to those who rely on it
but to the web as a whole.

As the web shifed, grew, mutated, evolved, matured, into
this fantastically semantic place, I began to realize one
simple fact about Accessibility that all developers should
embrace …
No.
If it worked for me…

 I like to explain Responsible Design
 using my own story as an example.

 Not because it’s particularly unique,
 but because it’s incredibly common.

 So, using my not so unique story as an
 example, let’s start at the beginning….
2008
I had just taken a job as a front end developer

My new employer had been working with the TTC (Toronto
Transit Commission) for several months and had just begun
development on the templates

I was being parachuted into the project just afer the
templates had come in from the contractor who had been
working on them
I had no idea what accessibility really was.
Trial By Fire
Forced to learn the hard way

For the frst time in my career I was using HTML
elements, tags, and attributes properly

Or in some cases, for the frst time at all.
My moment of clarity
My work took on a whole new meaning to me…
•
  I realized that I was building a tool, not a static page
•
  My code had a life of it’s own, it wasn’t there to be READ, it
  was there to be USED


While I never questioned the importance of accessibility, I
learned that it was not my job or my right to dictate who could
use this code or HOW
Through Clarity Came Focus
I noticed my skills as a developer had evolved
•
   My focus was no longer on making my code match the design
•
   I was carefully choosing how and why I was coding every
   element on the page, knowing it was going to be tested and I
   needed to defend my choices

As a result, over a period of time
•
  My code had fewer errors
•
  There were less cross-browser issues
•
  It was easier for the back end team to integrate
Accessibility in 2008

It was hard enough to get some devs to abandon table
based layouts let alone embrace semantic code

We were still years away from the end of IE6
I tried to speak to the creative department, but they didn’t
like me questioning their designs
The UX team didn’t take too kindly to me suggesting
alternative approaches
It was tough to get other clients interested in Accessibility


The most common excuses were that accessibility was “too
hard” or “too costly” so it wasn’t included in the spec


But, like most devs….
I ignored the spec.
I looked for ways to improve accessibility without
involving the client, the PM, the designers, or the UX
team while not undermining their work
The answer was at my fingertips, and right in front of
me, all along



My code.
I was ultimately responsible for the work I was putting
out there, there was no one else telling me how to
code.

I could make it as accessible as I wanted to as long as
I didn’t change the look or feel.
DIY a11y
 I took it on myself to make my work more accessible

 I knew the heart of accessible code, was semantic HTML

 I read the WCAG document top to bottom
 Then I read it again. And again. And again.

 Then I had someone smarter than my translate it into
 developer speak so I could finally understand it.

 I learned which points were bound directly to my work
 and that I had complete ownership over
When good enough stopped
being “Good Enough”
I approached my development process a little differently

•
    I spent more time planning my code up front, which lead to
    less time fixing it later
•
    I questioned everything on the page, I made sure it was
    documented
•
    Wireframes became my recipe, I refused to cook without
    them
•
    I always assumed at least SOME level of accessibility
•
    I stopped LOOKING at the designs I was building from,
    and learned to READ them
Own Your Code

… and not just the stuff you did right!

The real lessons are in the stuff you did wrong

Every bug could be a chance to learn something
you didn’t know before.
My Top Ten
Over time, I kept adding to the list of things I could "get away"
with or had complete control over

  1)    Semantic mark-up
  2)    ARIA landmark roles
  3)    Lists and the many ways we can use them
  4)    Skip links
  5)    Focus
  6)    Headings
  7)    Forms and labels
  8)    Alt text
  9)    Hidden text
  10)   Testing
By taking the extra time to carefully craf my code, and
from taking full responsibility for what I was putng out
for people to use, I became protective of my work.

Figuring out what I could do above and beyond just
writing the best HTML was just natural progression.
Thank you!

                      Billy Gregory
                   @thebillygregory

This presentation couldn’t have been
possible with help from Ryan Burgess
@coveredflth

More Related Content

Viewers also liked

10 tips in 10 minutes - DevTO Sept 30, 2013
10 tips in 10 minutes - DevTO Sept 30, 201310 tips in 10 minutes - DevTO Sept 30, 2013
10 tips in 10 minutes - DevTO Sept 30, 2013Billy Gregory
 
How Accessibility Made Me a Better Developer
How Accessibility Made Me a Better DeveloperHow Accessibility Made Me a Better Developer
How Accessibility Made Me a Better DeveloperBilly Gregory
 
AD CC and Me: Lessons Learned in Video Accessibility
AD CC and Me: Lessons Learned in Video AccessibilityAD CC and Me: Lessons Learned in Video Accessibility
AD CC and Me: Lessons Learned in Video AccessibilityBilly Gregory
 
Making JavaScript Accessible
Making JavaScript AccessibleMaking JavaScript Accessible
Making JavaScript AccessibleDennis Lembree
 
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
 
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
 
Accessible Video in The Enterprise
Accessible Video in The Enterprise Accessible Video in The Enterprise
Accessible Video in The Enterprise John Foliot
 
[Access U 2010] HTML5 & Accessibility
[Access U 2010] HTML5 & Accessibility[Access U 2010] HTML5 & Accessibility
[Access U 2010] HTML5 & AccessibilityChristopher Schmitt
 
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
 
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 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
 
Strategic Approach to IT Accessibility
Strategic Approach to IT AccessibilityStrategic Approach to IT Accessibility
Strategic Approach to IT AccessibilityInnoTech
 
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
 
How To Build An Accessible Web Application
How To Build An Accessible Web ApplicationHow To Build An Accessible Web Application
How To Build An Accessible Web ApplicationDennis Lembree
 
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
 

Viewers also liked (20)

10 tips in 10 minutes - DevTO Sept 30, 2013
10 tips in 10 minutes - DevTO Sept 30, 201310 tips in 10 minutes - DevTO Sept 30, 2013
10 tips in 10 minutes - DevTO Sept 30, 2013
 
How Accessibility Made Me a Better Developer
How Accessibility Made Me a Better DeveloperHow Accessibility Made Me a Better Developer
How Accessibility Made Me a Better Developer
 
AD CC and Me: Lessons Learned in Video Accessibility
AD CC and Me: Lessons Learned in Video AccessibilityAD CC and Me: Lessons Learned in Video Accessibility
AD CC and Me: Lessons Learned in Video Accessibility
 
Making JavaScript Accessible
Making JavaScript AccessibleMaking JavaScript Accessible
Making JavaScript Accessible
 
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
 
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.
 
Accessible Video in The Enterprise
Accessible Video in The Enterprise Accessible Video in The Enterprise
Accessible Video in The Enterprise
 
[Access U 2010] HTML5 & Accessibility
[Access U 2010] HTML5 & Accessibility[Access U 2010] HTML5 & Accessibility
[Access U 2010] HTML5 & Accessibility
 
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!
 
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 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
 
Strategic Approach to IT Accessibility
Strategic Approach to IT AccessibilityStrategic Approach to IT Accessibility
Strategic Approach to IT Accessibility
 
Getting Things Done for Technical Communicators
Getting Things Done for Technical CommunicatorsGetting Things Done for Technical Communicators
Getting Things Done for Technical Communicators
 
HTML5 Accessibility - Is it ready yet?
HTML5 Accessibility - Is it ready yet?HTML5 Accessibility - Is it ready yet?
HTML5 Accessibility - Is it ready yet?
 
Usability meets accessibility
Usability meets accessibilityUsability meets accessibility
Usability meets accessibility
 
How To Build An Accessible Web Application
How To Build An Accessible Web ApplicationHow To Build An Accessible Web Application
How To Build An Accessible Web Application
 
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
 

Similar to Responsible Design: Accountable Accessibility

UX 101: User Research methods to kickstart your project
UX 101: User Research methods to kickstart your projectUX 101: User Research methods to kickstart your project
UX 101: User Research methods to kickstart your projectCharlotte Breton Schreiner
 
Thoughts on design
Thoughts on designThoughts on design
Thoughts on designshawntelford
 
Grad lauren head final
Grad  lauren head finalGrad  lauren head final
Grad lauren head finalLauren Head
 
Keynote talk: How to stay in love with programming (with notes)
Keynote talk: How to stay in love with programming (with notes)Keynote talk: How to stay in love with programming (with notes)
Keynote talk: How to stay in love with programming (with notes)Camille Fournier
 
How Python Changed My Life PyCon Indonesia 2019
How Python Changed My Life   PyCon Indonesia 2019How Python Changed My Life   PyCon Indonesia 2019
How Python Changed My Life PyCon Indonesia 2019Fauzan Erich Emmerling
 
Sourceress cover letter
Sourceress cover letterSourceress cover letter
Sourceress cover letterTala Shivute
 
Zero Adoption: Lessons Learned From Failing at Open Source
Zero Adoption: Lessons Learned From Failing at Open SourceZero Adoption: Lessons Learned From Failing at Open Source
Zero Adoption: Lessons Learned From Failing at Open SourceMemi Beltrame
 
Technical Writing Overview: WTD Nigeria
Technical Writing Overview: WTD NigeriaTechnical Writing Overview: WTD Nigeria
Technical Writing Overview: WTD NigeriaMargaret Fero
 
Marketing Your Open Source Project - OSCON 2019_v04.pdf
Marketing Your Open Source Project - OSCON 2019_v04.pdfMarketing Your Open Source Project - OSCON 2019_v04.pdf
Marketing Your Open Source Project - OSCON 2019_v04.pdfAmazon Web Services
 
Scottish Ruby Conference 2014
Scottish Ruby Conference  2014Scottish Ruby Conference  2014
Scottish Ruby Conference 2014michaelag1971
 
Chapter 11 advocacy
Chapter 11 advocacyChapter 11 advocacy
Chapter 11 advocacystodd12088
 
Chapter 11 Advocacy
Chapter 11 AdvocacyChapter 11 Advocacy
Chapter 11 AdvocacyPiercyTe
 
Product Management: Wrangling People
Product Management: Wrangling PeopleProduct Management: Wrangling People
Product Management: Wrangling PeopleJanet Brunckhorst
 
Agile Prototyping Best Practices
Agile Prototyping Best PracticesAgile Prototyping Best Practices
Agile Prototyping Best Practicesuxpin
 
How to Teach Yourself to Code
How to Teach Yourself to CodeHow to Teach Yourself to Code
How to Teach Yourself to CodeMattan Griffel
 
Designing for Customer needs: A UX Perspective
Designing for Customer needs: A UX PerspectiveDesigning for Customer needs: A UX Perspective
Designing for Customer needs: A UX PerspectiveRichard O'Brien
 
A Cup of Tea With Michael Larsen
A Cup of Tea With Michael LarsenA Cup of Tea With Michael Larsen
A Cup of Tea With Michael LarsenMichael Larsen
 
The Care and Keeping of Your Junior Developer
The Care and Keeping of Your Junior DeveloperThe Care and Keeping of Your Junior Developer
The Care and Keeping of Your Junior Developerbonmatts
 

Similar to Responsible Design: Accountable Accessibility (20)

UX 101: User Research methods to kickstart your project
UX 101: User Research methods to kickstart your projectUX 101: User Research methods to kickstart your project
UX 101: User Research methods to kickstart your project
 
Thoughts on design
Thoughts on designThoughts on design
Thoughts on design
 
Grad lauren head final
Grad  lauren head finalGrad  lauren head final
Grad lauren head final
 
How to learn coding
How to learn codingHow to learn coding
How to learn coding
 
Keynote talk: How to stay in love with programming (with notes)
Keynote talk: How to stay in love with programming (with notes)Keynote talk: How to stay in love with programming (with notes)
Keynote talk: How to stay in love with programming (with notes)
 
How Python Changed My Life PyCon Indonesia 2019
How Python Changed My Life   PyCon Indonesia 2019How Python Changed My Life   PyCon Indonesia 2019
How Python Changed My Life PyCon Indonesia 2019
 
Sourceress cover letter
Sourceress cover letterSourceress cover letter
Sourceress cover letter
 
Zero Adoption: Lessons Learned From Failing at Open Source
Zero Adoption: Lessons Learned From Failing at Open SourceZero Adoption: Lessons Learned From Failing at Open Source
Zero Adoption: Lessons Learned From Failing at Open Source
 
Technical Writing Overview: WTD Nigeria
Technical Writing Overview: WTD NigeriaTechnical Writing Overview: WTD Nigeria
Technical Writing Overview: WTD Nigeria
 
Marketing Your Open Source Project - OSCON 2019_v04.pdf
Marketing Your Open Source Project - OSCON 2019_v04.pdfMarketing Your Open Source Project - OSCON 2019_v04.pdf
Marketing Your Open Source Project - OSCON 2019_v04.pdf
 
Scottish Ruby Conference 2014
Scottish Ruby Conference  2014Scottish Ruby Conference  2014
Scottish Ruby Conference 2014
 
Chapter 11 advocacy
Chapter 11 advocacyChapter 11 advocacy
Chapter 11 advocacy
 
Chapter 11 Advocacy
Chapter 11 AdvocacyChapter 11 Advocacy
Chapter 11 Advocacy
 
Product Management: Wrangling People
Product Management: Wrangling PeopleProduct Management: Wrangling People
Product Management: Wrangling People
 
Agile Prototyping Best Practices
Agile Prototyping Best PracticesAgile Prototyping Best Practices
Agile Prototyping Best Practices
 
Designer vs Developer
Designer vs DeveloperDesigner vs Developer
Designer vs Developer
 
How to Teach Yourself to Code
How to Teach Yourself to CodeHow to Teach Yourself to Code
How to Teach Yourself to Code
 
Designing for Customer needs: A UX Perspective
Designing for Customer needs: A UX PerspectiveDesigning for Customer needs: A UX Perspective
Designing for Customer needs: A UX Perspective
 
A Cup of Tea With Michael Larsen
A Cup of Tea With Michael LarsenA Cup of Tea With Michael Larsen
A Cup of Tea With Michael Larsen
 
The Care and Keeping of Your Junior Developer
The Care and Keeping of Your Junior DeveloperThe Care and Keeping of Your Junior Developer
The Care and Keeping of Your Junior Developer
 

Recently uploaded

Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Mark Simos
 
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024BookNet Canada
 
Moving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdfMoving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdfLoriGlavin3
 
The Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptx
The Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptxThe Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptx
The Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptxLoriGlavin3
 
So einfach geht modernes Roaming fuer Notes und Nomad.pdf
So einfach geht modernes Roaming fuer Notes und Nomad.pdfSo einfach geht modernes Roaming fuer Notes und Nomad.pdf
So einfach geht modernes Roaming fuer Notes und Nomad.pdfpanagenda
 
Visualising and forecasting stocks using Dash
Visualising and forecasting stocks using DashVisualising and forecasting stocks using Dash
Visualising and forecasting stocks using Dashnarutouzumaki53779
 
(How to Program) Paul Deitel, Harvey Deitel-Java How to Program, Early Object...
(How to Program) Paul Deitel, Harvey Deitel-Java How to Program, Early Object...(How to Program) Paul Deitel, Harvey Deitel-Java How to Program, Early Object...
(How to Program) Paul Deitel, Harvey Deitel-Java How to Program, Early Object...AliaaTarek5
 
DevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenDevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenHervé Boutemy
 
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better StrongerModern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better Strongerpanagenda
 
Anypoint Exchange: It’s Not Just a Repo!
Anypoint Exchange: It’s Not Just a Repo!Anypoint Exchange: It’s Not Just a Repo!
Anypoint Exchange: It’s Not Just a Repo!Manik S Magar
 
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptxMerck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptxLoriGlavin3
 
What is DBT - The Ultimate Data Build Tool.pdf
What is DBT - The Ultimate Data Build Tool.pdfWhat is DBT - The Ultimate Data Build Tool.pdf
What is DBT - The Ultimate Data Build Tool.pdfMounikaPolabathina
 
TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024Lonnie McRorey
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 3652toLead Limited
 
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc
 
Take control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test SuiteTake control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test SuiteDianaGray10
 
The Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptx
The Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptxThe Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptx
The Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptxLoriGlavin3
 
Gen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfGen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfAddepto
 
Scale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL RouterScale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL RouterMydbops
 

Recently uploaded (20)

Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
 
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
 
Moving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdfMoving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdf
 
The Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptx
The Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptxThe Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptx
The Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptx
 
So einfach geht modernes Roaming fuer Notes und Nomad.pdf
So einfach geht modernes Roaming fuer Notes und Nomad.pdfSo einfach geht modernes Roaming fuer Notes und Nomad.pdf
So einfach geht modernes Roaming fuer Notes und Nomad.pdf
 
Visualising and forecasting stocks using Dash
Visualising and forecasting stocks using DashVisualising and forecasting stocks using Dash
Visualising and forecasting stocks using Dash
 
(How to Program) Paul Deitel, Harvey Deitel-Java How to Program, Early Object...
(How to Program) Paul Deitel, Harvey Deitel-Java How to Program, Early Object...(How to Program) Paul Deitel, Harvey Deitel-Java How to Program, Early Object...
(How to Program) Paul Deitel, Harvey Deitel-Java How to Program, Early Object...
 
DevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenDevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache Maven
 
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better StrongerModern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
 
Anypoint Exchange: It’s Not Just a Repo!
Anypoint Exchange: It’s Not Just a Repo!Anypoint Exchange: It’s Not Just a Repo!
Anypoint Exchange: It’s Not Just a Repo!
 
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptxMerck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptx
 
What is DBT - The Ultimate Data Build Tool.pdf
What is DBT - The Ultimate Data Build Tool.pdfWhat is DBT - The Ultimate Data Build Tool.pdf
What is DBT - The Ultimate Data Build Tool.pdf
 
TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365
 
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
 
Take control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test SuiteTake control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test Suite
 
The Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptx
The Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptxThe Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptx
The Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptx
 
Gen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfGen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdf
 
Scale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL RouterScale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL Router
 

Responsible Design: Accountable Accessibility

  • 1. Responsible Design Accountable Accessibility Billy Gregory @thebillygregory
  • 2. “Through code ownership, I became more Responsible for the overall Design of my code. I believed that by holding myself Accountable for the end result, I could directly improve the Accessibility of my work.” A tall, questionably handsome, man at the front of the room
  • 3. About me I’m a front end developer at CGI in Toronto, Canada. I am NOT an Accessibility Specialist, expert, guru, ninja, etc… What I am is a developer who has grown to understand the importance of Accessibility, not only to those who rely on it but to the web as a whole. As the web shifed, grew, mutated, evolved, matured, into this fantastically semantic place, I began to realize one simple fact about Accessibility that all developers should embrace …
  • 4.
  • 5. No.
  • 6.
  • 7. If it worked for me… I like to explain Responsible Design using my own story as an example. Not because it’s particularly unique, but because it’s incredibly common. So, using my not so unique story as an example, let’s start at the beginning….
  • 8.
  • 9. 2008 I had just taken a job as a front end developer My new employer had been working with the TTC (Toronto Transit Commission) for several months and had just begun development on the templates I was being parachuted into the project just afer the templates had come in from the contractor who had been working on them
  • 10. I had no idea what accessibility really was.
  • 11. Trial By Fire Forced to learn the hard way For the frst time in my career I was using HTML elements, tags, and attributes properly Or in some cases, for the frst time at all.
  • 12. My moment of clarity My work took on a whole new meaning to me… • I realized that I was building a tool, not a static page • My code had a life of it’s own, it wasn’t there to be READ, it was there to be USED While I never questioned the importance of accessibility, I learned that it was not my job or my right to dictate who could use this code or HOW
  • 13. Through Clarity Came Focus I noticed my skills as a developer had evolved • My focus was no longer on making my code match the design • I was carefully choosing how and why I was coding every element on the page, knowing it was going to be tested and I needed to defend my choices As a result, over a period of time • My code had fewer errors • There were less cross-browser issues • It was easier for the back end team to integrate
  • 14. Accessibility in 2008 It was hard enough to get some devs to abandon table based layouts let alone embrace semantic code We were still years away from the end of IE6
  • 15. I tried to speak to the creative department, but they didn’t like me questioning their designs
  • 16. The UX team didn’t take too kindly to me suggesting alternative approaches
  • 17. It was tough to get other clients interested in Accessibility The most common excuses were that accessibility was “too hard” or “too costly” so it wasn’t included in the spec But, like most devs….
  • 18. I ignored the spec.
  • 19. I looked for ways to improve accessibility without involving the client, the PM, the designers, or the UX team while not undermining their work The answer was at my fingertips, and right in front of me, all along My code. I was ultimately responsible for the work I was putting out there, there was no one else telling me how to code. I could make it as accessible as I wanted to as long as I didn’t change the look or feel.
  • 20. DIY a11y I took it on myself to make my work more accessible I knew the heart of accessible code, was semantic HTML I read the WCAG document top to bottom Then I read it again. And again. And again. Then I had someone smarter than my translate it into developer speak so I could finally understand it. I learned which points were bound directly to my work and that I had complete ownership over
  • 21. When good enough stopped being “Good Enough” I approached my development process a little differently • I spent more time planning my code up front, which lead to less time fixing it later • I questioned everything on the page, I made sure it was documented • Wireframes became my recipe, I refused to cook without them • I always assumed at least SOME level of accessibility • I stopped LOOKING at the designs I was building from, and learned to READ them
  • 22.
  • 23.
  • 24.
  • 25. Own Your Code … and not just the stuff you did right! The real lessons are in the stuff you did wrong Every bug could be a chance to learn something you didn’t know before.
  • 26. My Top Ten Over time, I kept adding to the list of things I could "get away" with or had complete control over 1) Semantic mark-up 2) ARIA landmark roles 3) Lists and the many ways we can use them 4) Skip links 5) Focus 6) Headings 7) Forms and labels 8) Alt text 9) Hidden text 10) Testing
  • 27. By taking the extra time to carefully craf my code, and from taking full responsibility for what I was putng out for people to use, I became protective of my work. Figuring out what I could do above and beyond just writing the best HTML was just natural progression.
  • 28. Thank you! Billy Gregory @thebillygregory This presentation couldn’t have been possible with help from Ryan Burgess @coveredflth