2. Toronto Accessibility & Inclusive Design
meetup.com/a11yTO
@a11yTO #a11yTO
Practical Web Accessibility
GeorgeZamfir.com - @GeorgeZamfir
3.
4.
5.
6. Practical Web Accessibility
&
The Accessibility Tribe
“capture(d) the CSUN zeitgeist (of) the global accessibility
community as a tribe, drawn together by a shared
ambition to make the web a truly inclusive place.”
- Leonie Watson
This is our local-global tribe!
And we want you to join the tribe!
(there are superheroes)
john.foliot.ca/csun-2012-recap
7. Welcome to the
The Accessibility Superheroes Tribe
Superheroes talking:
Superman: Hey these iPhones are
great, now we can all keep in touch and
share our crime fighting techniques with
each other.
Batman: I know, right? I can’t imagine
life without one. That would really suck.
Flash: How come I didn’t get one?
Spiderman: Hahaha, Apple doesn’t
support Flash.
8. #a11yTO – 2 take-aways
Learn something new
and / or
Validate of your ideas
11. #a11yTO – 2 take-aways
Learn something new
&
Validate of your ideas
It’s about the tribe so I shortened my talk!
12. Practical Web Accessibility
Sequel to the Guelph presentations - bit.ly/a11y_scotia
Lessons learned from redesigning scotiabank.com
1. Make A Huge Difference For The Users
2. Practical “Dynamic Web 2.0” Accessibility
13. Make A Huge Difference For The Users
1. Big impact issues
2. Don’t just check the WCAG 2 check-marks
3. My bias: keyboard testing
Need help?
Good thing we now have a tribe to help out
14. 1. Big impact issues
“Who Wants To Be A Millionaire” question:
Which of the following is the largest?
Possible answers: an elephant or the moon
The contestant chose "An Elephant"!
15. 1. Big impact issues
1. “If I can only fix one thing what would that be?”
2. Look at the BIG picture & the users’ needs
3. Our approach:
• framework-first
• common components
• frequently used “tools”
• “real” content structure
16. 1. Big impact issues – Our Approach
1. Framework-first
2. Common components
3. Frequently used “tools”
4. “real” content structure
17. 2. Checking the WCAG2 check-marks
Don’t get hung up on
Web Content Accessibility Guidelines 2 (WCAG 2)
18. 3. Keyboard Testing
2 BIG concepts:
Everything is functional by keyboard
(including highly interactive UI elements)
Visual focus indicator
(be the :focus to my :hover)
This website is best viewed at 1024x768
and only works with the mouse
21. In the end…
Accessibility is for everyone!
“We are only as (dis)abled as the environment around us”
– Oscar Pistorius
Don’t be the policeman, be the fireman!
– John Foliot
Welcome to #a11yTO, we’re on Twitter and knowing Jennison, we’ll soon on Fb, G+, Pinterest, Li, Reddit, IRC, Y!, MSN, Skype and any other platform you can possibly imagine.
My name is George Zamfir and I’m an accessibility addict! Welcome to accessibility anonymous everyone, I’m so happy to see so many of you here! Computer Science graduate, Stumbled into this field while Ryerson; dev job -> research -> thesis “ Real job“ Energy regulations vs WCAG 2 Opportunity at Scotiabank : I was in for a ride: 2 years, redesigned / replatformed SOL & Scotiabank.com + a whole lot of smaller projects
I like to jump in the water from high cliffs, especially in my wedding tux. And, unrelated I drink my tea from beer steins.
Also, I like paddling & dragon boating. I’m now on a team representing this team with weird yellow & blue colors.
And sometimes we paddle in the conference rooms.
“ The Tribe” meme started on twitter as a symbol of the accessibility community & the passion we share. People used it a lot at CSUN this year and it stuck with me because it felt really warm & welcoming. Goal for this series of meetups: create our local-global accessibility tribe for all of US, so that we all feel warm & welcomed (and slightly inebriated if you join us at the pub). I am lucky because early on I got to work with a lot of smart people: Deb Fels & research colleagues, IDRC, Monica, Derek and others. I call them superheroes!
Accessibility Superheroes Tribe! Superheroes talking: Superman: Hey these iPhones are great, now we can all keep in touch and share our crime fighting techniques with each other. Batman: I know, right? I can’t imagine life without one. That would really suck. Flash: How come I didn’t get one? Spiderman: Haha, Apple doesn’t support Flash
From conferences: learn something new & Validation of your ideas Well, this is what we want for you. Throughout all the conferences I went to I always left with 2 take-aways: 1. I always learned something new: maybe it was a coding technique, testing , a tip on training, or I learned more about a disability I didn't know much about. 2. Validation for my work: "wow, we've been saying / doing that all along, it's good to know it worked in other places";
Progressive enhancement: from Derek.
@georgezamfir: Just read @feather's "HTML5 Block Links" again for validation - http://simplyaccessible.com/article/html5- … Love these compromise-now-but-futurefriendly solutions WCAG 2 by the letter - Keyboard Focus
From conferences: learn something new & Validation of your ideas Well, this is what we want for you. It’s about the tribe so I shortened the talk so we can spend the last 10-15 minutes talking about your biggest hurdles and how we can help. Because we want you to feel warm & fuzzy
Sequel to the 2 presentations: The 1st presentation speaks to the governance, policies and management process around the project The 2nd presentation describes the accessibility tasks undertaken at each SDLC phase Lessons learned & what really worked for us About the project: scotiabank.com
Start with what makes the biggest impact: Start with the big picture / from the outside “ If I can only fix one thing what would that be?” In our case: framework-first Don't just check the WCAG guideline check-mark Big believer in keyboard testing (point back to WCAG) because it usually masks bigger issues. And when you don't know what is going on reach to this community
“ If I can only fix one thing what would that be?” Start with the big picture “ can't see the wood for the trees ” Look at your project, what’s the most important thing you want ALL your users In our case: framework-first
DESCRIBE THE TEMPLATE ELEMENTS Header logo, sign in area - Top nav, 2 “skip to content” links, text resize - Service menu, search - Main menu Vertical menu – mirrors the main menu - Main Content Footer
Don't just check the WCAG guideline check-mark. Consider this, keyboard focus is a WCAG 2 AA criteria.
Big believer in keyboard testing (point back to WCAG) because it usually masks bigger issues. And when you don't know what is going on reach to this community
The reality on today's web is that these are now not just geeky features, they are becoming more & more embedded on the web as much as text & images are. Believe it or not when used and built right I think they are empowering to the users.
The reality on today's web is that these are now not just geeky features, they are becoming more & more embedded on the web as much as text & images are. Believe it or not when used and built right I think they are empowering to the users.
Accessibility is for everyone: We are only as (dis)abled as the environment around us – Oscar Pistorius; running on prosthetic legs at Paralympics and has now qualified for the 2012 Olympics. Pregnant lady “ Don’t be the policeman, be the fireman.” – John Foliot via Karl Groves - http://www.karlgroves.com/2012/06/21/lets-put-down-the-pitchforks-and-get-some-perspective/ Take the approach of being a fireman, instead of that of a policeman ; By saying that, what he means is that firemen actually spend a very small amount of their time fighting fires. Most of what they do is in preventing fires. The policeman, on the other hand, are spending their days investigating crimes and keeping a watchful eye out for crimes occurring.
I’ve set aside some time to hear from you But Q’s on the presentation are welcomed as well