SEO, mobile web & accessibility:
Trinity of Inclusive Web Development
CSUN 2012San Diego - March 2nd, 2012
/ 12012. AccessibilitéWebToll Free: 1 (877) 315-5550
Attribution ⬌ NonCommercial ⬌ ShareAlike 2.5 Canada
/ 2
Some Rights Reserved
2012. AccessibilitéWebToll Free: 1 (877) 315-5550
Speaker
Denis Boudreau
11+ yrs experience - Web Accessibility
Chairman, AccessibilitéWeb
Co-editor, SGQRI 008 standards
Invited Expert, W3C
/ 32012. AccessibilitéWebToll Free: 1 (877) 315-5550
@dboudreau
Accessibility: A Tough Sell?
/ 4
Making accessibility happen
What was your experience?
What were the challenges?
2012. AccessibilitéWebToll Free: 1 (877) 315-5550
Times, They Are A-Changin’
/ 5
Reviewing the a11y game plan
Looking back at all we’ve accomplished
Recognizing some practices as “sexier”
If you can’t beat them, join them!
2012. AccessibilitéWebToll Free: 1 (877) 315-5550
A11y: Have We Lost Our Way?(Keep it Simple and Smart)
/ 8
Going back to basics...
What is the intent of web accessibility?
Forget obligations: aim for results!
How does one eat an elephant?
HOW ABOUT:
Keeping Information Semantically Structured?
2012. AccessibilitéWebToll Free: 1 (877) 315-5550
Headed Towards Inclusion
/ 9
Progressively...
Pragmatically...
Realistically...
BUILDING a11y, ONE STEP AT A TIMEAccessibility should not be about what legislators want. It should be about
embodying inclusion and meeting the adaptation needs of real people.
2012. AccessibilitéWebToll Free: 1 (877) 315-5550
Trinity of Inclusive Web Development
Rethinking the web development strategy
Analysis of SEO / Mobile Web practices
Drawing a parallel between practices
Selling accessibility, indirectly
Justifying efforts, differently
/ 102012. AccessibilitéWebToll Free: 1 (877) 315-5550
My Own Personal 80/20 a11y Rule
Most recurrent a11y problems encountered
Focussing on the basics!
1. Text Equivalents2. Keyboard Navigation3. Content Structure4. Forms Associations5. Color Contrasts6. Significant Hyperlinks7. Document Language8. Screen Reader Compatibility
/ 112012. AccessibilitéWebToll Free: 1 (877) 315-5550
...Nothing Less Than Changing The World
/ 13
HOW CAN WE TURN THIS AROUND?
2012. AccessibilitéWebToll Free: 1 (877) 315-5550
Accessibility and the Mobile Web
Mobile web best practices 1.0
60 practices declined in 5 themes• Overall Behavior• Navigation and Links• Page Layout and Content• Page Definition• User Input
/ 14
ResourcesMobile Web Best Practices 1.0 - Basic Guidelineshttp://www.w3.org/TR/mobile-bp/From WCAG 2.0 to MWBP (W3C Note)http://www.w3.org/TR/mwbp-wcag/wcag20-mwbp.html
2012. AccessibilitéWebToll Free: 1 (877) 315-5550
From WCAG 2.0 to MWBP 1.0
Bridging WCAG 2.0 and MWBP 1.0
Directly related to WCAG 2.0
Plus 17 other criteria (AA and AAA)
/ 15
MWBP Elements Criteria Level WCAG Criteria
Non-text alts 1.1.1. A Non-text Content
Fonts 1.3.1 A Info and Relations
Style Sheets Use 1.3.1 A Info and Relations
Use of Color 1.4.1 A Use of Color
Tab Order 2.4.3 A Focus Order
Auto-Refresh 3.2.5 AAA Change on Request
Link Target ID 2.4.9 AAA Link Purpose
2012. AccessibilitéWebToll Free: 1 (877) 315-5550
Common Barriers
Bridging WCAG 2.0 and MWBP 1.0
Examples of barriers in user exp.
Grouped under the WCAG principles
Another WCAG/MWBP mapping
/ 16
ResourceShared Web Experiences: Barriers Common to Mobile Device Users and People with Disabilitieshttp://www.w3.org/WAI/mobile/experiences
2012. AccessibilitéWebToll Free: 1 (877) 315-5550
Accessibility and SEO Best Practices
Search engines, including Google...
Only understand text
Never rely on external devices
Rely on the content structure
Love section headings
Dislike automatic refreshes
Enjoy efficient navigation mechanisms
Depend on significant hyperlinks
Again, some interesting parallels between specific SEO best practices and WCAG 2.0 success criteria!
/ 172012. AccessibilitéWebToll Free: 1 (877) 315-5550
SEO And Text Equivalents
No salvation beyond text content
/ 18
Criteria WCAG Criteria Details Level
1.1.1 Non-Text Content A
1.2.1 Audio or Video Content Only A
1.2.2 Captions (prerecorded) A
1.2.3 Audio Description or Media Alternative (Prerecorded) A
1.2.4 Captions (live) AA
1.2.5 Audio Description (prerecorded) AA
1.4.5 Images of Text AA
1.2.6 to 1.2.9 Additional Criteria AAA
2012. AccessibilitéWebToll Free: 1 (877) 315-5550
SEO And Keyboard Navigation
No navigation beyond the mouse
/ 19
Criteria WCAG Criteria Details Level
2.1.1 Keyboard A
2.1.1 No Keyboard Traps A
2.4.3 Focus Order A
2.4.7 Focus Visible AA
2.1.3 Additional Criterion AAA
2012. AccessibilitéWebToll Free: 1 (877) 315-5550
SEO And Content Structure
Headings: HTML’s integrated GPS
/ 20
Criteria WCAG Criteria Details Level
1.3.1 Info and Relationships A
2.4.2 Page Titled A
2.4.6 Headings and Labels AA
2.4.10 Additional Criterion AAA
2012. AccessibilitéWebToll Free: 1 (877) 315-5550
SEO, Refreshes And Delays
Infinite loops and barriers to infos
/ 21
Criteria WCAG Criteria Details Level
2.2.1 Timing Adjustable A
2.2.1 Pause, Stop, Hide A
2.2.3 Additional Criterion AAA
2012. AccessibilitéWebToll Free: 1 (877) 315-5550
SEO And Efficient Navigation
Semantics: all about making sense
/ 22
Criteria WCAG Criteria Details Level
2.4.1 Bypass Blocks A
2.4.2 Page Titled A
2.4.3 Focus Order A
2.4.4 Link Purpose (in context) A
2.4.5 Multiple Ways AA
2.4.6 Headings and Labels AA
2.4.7 Focus Visible AA
2.4.8 Additional Criterion AAA
2012. AccessibilitéWebToll Free: 1 (877) 315-5550
SEO And Significant Hyperlinks
Click (w)Here!?
/ 23
Criteria WCAG Criteria Details Level
2.4.4 Link Purpose (in context) A
2.4.9 Additional Criterion AAA
2012. AccessibilitéWebToll Free: 1 (877) 315-5550
Overview – Setting An A11y Baseline
A winning combination on many levels
/ 24
Criteria to consider WCAG MWBP SEO
Text Equivalents ✔ ✔ ✔
Keyboard Navigation ✔ ✔ ✔
Content Structure ✔ ✔ ✔
Significant Hyperlinks ✔ ✔ ✔
Refreshes and Delays ✔ - ✔
Efficient Navigation ✔ - ✔
Sufficient Color Contrasts ✔ ✔ -
Forms Associations ✔ ✔ -
ResourceSEO and Accessibility Overlaphttp://www.communis.co.uk/blog/2009-08-06-seo-and-accessibility-overlap
2012. AccessibilitéWebToll Free: 1 (877) 315-5550
Beyond Best Practices, "Web Quality"
/ 26
a11y within a global quality process
1.Recognize the progressive aspect of a11y
2.Give up on the desire to do everything at once
3.Divide work among the various stakeholders
4.Prioritize every team member's action items
5.Adapt the production lifecycle to the gameplan
6.Provide "real means" to achieve set goals
2012. AccessibilitéWebToll Free: 1 (877) 315-5550
Finding Your WAI (way)
The W3C provides a lot of resources
Presentations you can copy
Before and After demo you can use
Business case resources
Coming across inaccessible websites
And much more!
LOTS OF GOOD STUFF!
/ 27
ResourceFinding Your WAI (way) to New Accessibility Resourceshttp://www.w3.org/WAI/yourWAI.html
2012. AccessibilitéWebToll Free: 1 (877) 315-5550
And Above All...
/ 282012. AccessibilitéWebToll Free: 1 (877) 315-5550
Keep spreading the word. Be that change.
Thank You!
Denis Boudreau,President
Coopérative AccessibilitéWeb
1751 Richardson street, suite 6111
Montreal (Quebec), Canada H3K 1G6
Toll Free: +1 (877) 315-5550
Email: [email protected]
Web: www.accessibiliteweb.com
Blog: www.accessiblogue.com
Twitter : @AccessibiliteWb / @dboudreau
/ 292012. AccessibilitéWebToll Free: 1 (877) 315-5550
Spkr8 - Comments, suggestions? http://spkr8.com/t/9309
Slideshare.net – present yourself!http://is.gd/X28Lgd
Top Related