SlideShare uma empresa Scribd logo
1 de 29
SEO, mobile web & accessibility:
 Trinity of Inclusive
 Web Development


 CSUN 2012
 San Diego - March 2nd, 2012




2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550    /1
Some Rights Reserved


               ttribution     ⬌ NonCommercial ⬌ ShareAlike 2.5 Canada
2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550                /2
Speaker


    enis Boudreau

    11+ yrs experience - Web Accessibility

    Chairman, AccessibilitéWeb
                                             @dboudreau
    Co-editor, SGQRI 008 standards

    Invited Expert, W3C


2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550       /3
Accessibility: A Tough Sell?


    aking accessibility happen

    hat was your experience?

    hat were the challenges?




2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550    /4
Times, They Are A-Changin’


    eviewing the a11y game plan

    ooking back at all we’ve accomplished

    ecognizing some practices as “sexier”

    f you can’t beat them, join them!




2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550       /5
A Few
  Positive
  Signs...




2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550   /6
At long last, #perfectA11y




2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550   /7
A11y: Have We Lost Our Way?
  (Keep it Simple and Smart)




    oing back to basics...

    hat is the intent of web accessibility?

    orget obligations: aim for results!
HOW ABOUT:
Keeping Information Semantically Structured?
  ow does one eat an elephant?

2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550         /8
Headed Towards Inclusion




    rogressively...

    ragmatically...

    ealistically...
                                                             BUILDING a11y, ONE STEP AT A TIME
                        Accessibility should not be about what legislators want. It should be about
                           embodying inclusion and meeting the adaptation needs of real people.



2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550                       /9
Trinity of Inclusive Web Development


    ethinking the web development strategy

    nalysis of SEO / Mobile Web practices

    rawing a parallel between practices

    elling accessibility, indirectly

    ustifying efforts, differently


2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550            / 10
My Own Personal 80/20 a11y Rule


    ost recurrent a11y problems encountered

    ocussing on the basics!
         ü Text Equivalents
         ü Keyboard Navigation
         ü Content Structure
         ü Forms Associations
         ü Color Contrasts
         ü Significant Hyperlinks
         ü Document Language
         ü Screen Reader Compatibility
2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550      / 11
Because What It Comes Down To Is...




2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550   / 12
...Nothing Less Than Changing The World




          HOW CAN WE TURN THIS AROUND?




2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550   / 13
Accessibility and the Mobile Web


    obile web best practices 1.0

    0 practices declined in 5 themes
        • Overall Behavior
        • Navigation and Links
        • Page Layout and Content
        • Page Definition
    Resources
        • User Input
    Mobile Web Best Practices 1.0 - Basic Guidelines
    http://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éWeb
Toll Free: 1 (877) 315-5550                       / 14
From WCAG 2.0 to MWBP 1.0


    ridging WCAG 2.0 and MWBP 1.0

    irectly related to WCAG 2.0
    MWBP Elements             Criteria   Level   WCAG Criteria

    lus 17 other
    Non-text alts         criteria (AA and AAA)
                            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éWeb
Toll Free: 1 (877) 315-5550                            / 15
Common Barriers


    ridging WCAG 2.0 and MWBP 1.0

    xamples of barriers in user exp.

    rouped under the WCAG principles

    nother WCAG/MWBP mapping
    Resource
    Shared Web Experiences: Barriers Common to Mobile
    Device Users and People with Disabilities
    http://www.w3.org/WAI/mobile/experiences



2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550                   / 16
Accessibility and SEO Best Practices


    earch engines, including Google...

    nly understand text

    ever rely on external devices

    ely on the content structure

    ove section headings

    islike automatic refreshes

    njoy efficient navigation mechanisms
2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550         / 17
SEO And Text Equivalents


    o salvation beyond text content
   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
                     Audio Description or Media
   1.2.3                                                   A
                     Alternative (Prerecorded)
   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éWeb
Toll Free: 1 (877) 315-5550                        / 18
SEO And Keyboard Navigation


    o navigationCriteria Details the mouse
   Criteria WCAG beyond                 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éWeb
Toll Free: 1 (877) 315-5550                 / 19
SEO And Content Structure


    eadings:WCAG Criteriaintegrated GPS
   Criteria HTML’s 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éWeb
Toll Free: 1 (877) 315-5550                   / 20
SEO, Refreshes And Delays


    nfinite loopsCriteria Details
   Criteria  WCAG and barriers to infos
                                   Level

   2.2.1             Timing Adjustable              A
   2.2.1             Pause, Stop, Hide              A
   2.2.3             Additional Criterion          AAA




2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550                 / 21
SEO And Efficient Navigation


    emantics: allCriteria Details
   CriteriaWCAG about making senseLevel

   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éWeb
Toll Free: 1 (877) 315-5550                      / 22
SEO And Significant Hyperlinks


    lick (w)Here!? Details
   Criteria  WCAG Criteria                              Level

   2.4.4             Link Purpose (in context)           A
   2.4.9             Additional Criterion               AAA




2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550                      / 23
Overview – Setting An A11y Baseline


      winning combination on many levels
    Criteria to consider
                    WCAG  MWBP  SEO
    Text Equivalents             ✔         ✔           ✔
    Keyboard Navigation          ✔         ✔           ✔
    Content Structure            ✔         ✔           ✔
    Significant Hyperlinks       ✔         ✔           ✔
    Refreshes and Delays         ✔          -          ✔
    Efficient Navigation         ✔          -          ✔
    Sufficient Color Contrasts   ✔         ✔           -
    Forms Associations           ✔         ✔           -

    Resource
    SEO and Accessibility Overlap
    http://www.communis.co.uk/blog/2009-08-06-seo-and-accessibility-overlap


2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550                     / 24
Bringing Down Barriers, One at a Time




2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550   / 25
Beyond Best Practices, "Web Quality"


                              11y within a global quality process

                              ecognize the progressive aspect of a11y


                              ive up on the desire to do everything at once


                              ivide work among the various stakeholders


                              rioritize every team member's action items

2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550
                              dapt the production lifecycle to the gameplan
                                          / 26
Finding Your WAI (way)


    he W3C provides a lot of resources

    resentations you can copy

    efore and After demo you can use

    Resource case resources
     usiness
    Finding Your WAI (way) to New Accessibility Resources
    http://www.w3.org/WAI/yourWAI.html
    oming across inaccessible websites

    nd much more!

2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550                      / 27
And Above All...




                              Keep spreading the word.
                                   Be that change.

2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550   / 28
Thank You!


    enis Boudreau,                           Spkr8 - Comments, suggestions?

    resident                                 http://spkr8.com/t/9309


                                             lideshare.net – present yourself!
    oopérative AccessibilitéWeb

    751 Richardson street, suite 6111

    ontreal (Quebec), Canada H3K 1G6

    oll Free: +1 (877) 315-5550

2012. AccessibilitéWeb
Toll Free: 1 (877) 315-5550           / 29
    mail: dboudreau@accessibiliteweb.com

Mais conteúdo relacionado

Destaque

Integrating accessibility in the organization's web development lifecycle
Integrating accessibility in the organization's web development lifecycleIntegrating accessibility in the organization's web development lifecycle
Integrating accessibility in the organization's web development lifecycleAccessibilitéWeb
 
Accessibility: Ed Directions North
Accessibility: Ed Directions NorthAccessibility: Ed Directions North
Accessibility: Ed Directions NorthDerek Featherstone
 
Automatic Testing: What can be tested and how?
Automatic Testing: What can be tested and how?Automatic Testing: What can be tested and how?
Automatic Testing: What can be tested and how?Karl Groves
 
Viking methodology
Viking methodologyViking methodology
Viking methodologyKarl Groves
 
UX Camp Ottawa: Accessibility as a Design Tool
UX Camp Ottawa: Accessibility as a Design ToolUX Camp Ottawa: Accessibility as a Design Tool
UX Camp Ottawa: Accessibility as a Design ToolDerek Featherstone
 
Make your content accessible: ConfabCentral 2014
Make your content accessible: ConfabCentral 2014Make your content accessible: ConfabCentral 2014
Make your content accessible: ConfabCentral 2014Derek Featherstone
 
Social media accessibility: where are we today?
Social media accessibility: where are we today?Social media accessibility: where are we today?
Social media accessibility: where are we today?AccessibilitéWeb
 
OttawaJS: angular accessibility
OttawaJS: angular accessibilityOttawaJS: angular accessibility
OttawaJS: angular accessibilityDerek Featherstone
 
Accessible custom radio buttons and checkboxes
Accessible custom radio buttons and checkboxesAccessible custom radio buttons and checkboxes
Accessible custom radio buttons and checkboxesRuss Weakley
 
Deep Dive into Line-Height
Deep Dive into Line-HeightDeep Dive into Line-Height
Deep Dive into Line-HeightRuss Weakley
 
Building Accessible Web Components
Building Accessible Web ComponentsBuilding Accessible Web Components
Building Accessible Web ComponentsRuss Weakley
 
Accessible UX: Beyond the checklist to great experiences
Accessible UX: Beyond the checklist to great experiencesAccessible UX: Beyond the checklist to great experiences
Accessible UX: Beyond the checklist to great experiencesWhitney Quesenbery
 
Creating a Simple, Accessible On/Off Switch
Creating a Simple, Accessible On/Off SwitchCreating a Simple, Accessible On/Off Switch
Creating a Simple, Accessible On/Off SwitchRuss Weakley
 

Destaque (14)

Integrating accessibility in the organization's web development lifecycle
Integrating accessibility in the organization's web development lifecycleIntegrating accessibility in the organization's web development lifecycle
Integrating accessibility in the organization's web development lifecycle
 
Accessibility: Ed Directions North
Accessibility: Ed Directions NorthAccessibility: Ed Directions North
Accessibility: Ed Directions North
 
EOTW 2011 Closing Keynote
EOTW 2011 Closing Keynote EOTW 2011 Closing Keynote
EOTW 2011 Closing Keynote
 
Automatic Testing: What can be tested and how?
Automatic Testing: What can be tested and how?Automatic Testing: What can be tested and how?
Automatic Testing: What can be tested and how?
 
Viking methodology
Viking methodologyViking methodology
Viking methodology
 
UX Camp Ottawa: Accessibility as a Design Tool
UX Camp Ottawa: Accessibility as a Design ToolUX Camp Ottawa: Accessibility as a Design Tool
UX Camp Ottawa: Accessibility as a Design Tool
 
Make your content accessible: ConfabCentral 2014
Make your content accessible: ConfabCentral 2014Make your content accessible: ConfabCentral 2014
Make your content accessible: ConfabCentral 2014
 
Social media accessibility: where are we today?
Social media accessibility: where are we today?Social media accessibility: where are we today?
Social media accessibility: where are we today?
 
OttawaJS: angular accessibility
OttawaJS: angular accessibilityOttawaJS: angular accessibility
OttawaJS: angular accessibility
 
Accessible custom radio buttons and checkboxes
Accessible custom radio buttons and checkboxesAccessible custom radio buttons and checkboxes
Accessible custom radio buttons and checkboxes
 
Deep Dive into Line-Height
Deep Dive into Line-HeightDeep Dive into Line-Height
Deep Dive into Line-Height
 
Building Accessible Web Components
Building Accessible Web ComponentsBuilding Accessible Web Components
Building Accessible Web Components
 
Accessible UX: Beyond the checklist to great experiences
Accessible UX: Beyond the checklist to great experiencesAccessible UX: Beyond the checklist to great experiences
Accessible UX: Beyond the checklist to great experiences
 
Creating a Simple, Accessible On/Off Switch
Creating a Simple, Accessible On/Off SwitchCreating a Simple, Accessible On/Off Switch
Creating a Simple, Accessible On/Off Switch
 

Mais de AccessibilitéWeb

Seo web mobile-accessibilite-parisweb
Seo web mobile-accessibilite-pariswebSeo web mobile-accessibilite-parisweb
Seo web mobile-accessibilite-pariswebAccessibilitéWeb
 
Accessibilite federales-2011
Accessibilite federales-2011Accessibilite federales-2011
Accessibilite federales-2011AccessibilitéWeb
 
Accessibilite gouvernance-inclusion
Accessibilite gouvernance-inclusionAccessibilite gouvernance-inclusion
Accessibilite gouvernance-inclusionAccessibilitéWeb
 
Successfully Integrating Accessibility in your Organization’s Web Development...
Successfully Integrating Accessibility in your Organization’s Web Development...Successfully Integrating Accessibility in your Organization’s Web Development...
Successfully Integrating Accessibility in your Organization’s Web Development...AccessibilitéWeb
 
Confoo 2011-planifier-accessibilite-dans-votre-organisation
Confoo 2011-planifier-accessibilite-dans-votre-organisationConfoo 2011-planifier-accessibilite-dans-votre-organisation
Confoo 2011-planifier-accessibilite-dans-votre-organisationAccessibilitéWeb
 
Atelier erreurs-accessibilite
Atelier erreurs-accessibiliteAtelier erreurs-accessibilite
Atelier erreurs-accessibiliteAccessibilitéWeb
 
Etude de-cas-refonte-accessible
Etude de-cas-refonte-accessibleEtude de-cas-refonte-accessible
Etude de-cas-refonte-accessibleAccessibilitéWeb
 
Accessibilite chaine-production-web
Accessibilite chaine-production-webAccessibilite chaine-production-web
Accessibilite chaine-production-webAccessibilitéWeb
 

Mais de AccessibilitéWeb (9)

Seo web mobile-accessibilite-parisweb
Seo web mobile-accessibilite-pariswebSeo web mobile-accessibilite-parisweb
Seo web mobile-accessibilite-parisweb
 
Seo accessibilite
Seo accessibiliteSeo accessibilite
Seo accessibilite
 
Accessibilite federales-2011
Accessibilite federales-2011Accessibilite federales-2011
Accessibilite federales-2011
 
Accessibilite gouvernance-inclusion
Accessibilite gouvernance-inclusionAccessibilite gouvernance-inclusion
Accessibilite gouvernance-inclusion
 
Successfully Integrating Accessibility in your Organization’s Web Development...
Successfully Integrating Accessibility in your Organization’s Web Development...Successfully Integrating Accessibility in your Organization’s Web Development...
Successfully Integrating Accessibility in your Organization’s Web Development...
 
Confoo 2011-planifier-accessibilite-dans-votre-organisation
Confoo 2011-planifier-accessibilite-dans-votre-organisationConfoo 2011-planifier-accessibilite-dans-votre-organisation
Confoo 2011-planifier-accessibilite-dans-votre-organisation
 
Atelier erreurs-accessibilite
Atelier erreurs-accessibiliteAtelier erreurs-accessibilite
Atelier erreurs-accessibilite
 
Etude de-cas-refonte-accessible
Etude de-cas-refonte-accessibleEtude de-cas-refonte-accessible
Etude de-cas-refonte-accessible
 
Accessibilite chaine-production-web
Accessibilite chaine-production-webAccessibilite chaine-production-web
Accessibilite chaine-production-web
 

Último

Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024BookNet Canada
 
SALESFORCE EDUCATION CLOUD | FEXLE SERVICES
SALESFORCE EDUCATION CLOUD | FEXLE SERVICESSALESFORCE EDUCATION CLOUD | FEXLE SERVICES
SALESFORCE EDUCATION CLOUD | FEXLE SERVICESmohitsingh558521
 
The State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptxThe State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptxLoriGlavin3
 
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
 
Digital Identity is Under Attack: FIDO Paris Seminar.pptx
Digital Identity is Under Attack: FIDO Paris Seminar.pptxDigital Identity is Under Attack: FIDO Paris Seminar.pptx
Digital Identity is Under Attack: FIDO Paris Seminar.pptxLoriGlavin3
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brandgvaughan
 
Dev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio WebDev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio WebUiPathCommunity
 
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
 
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
 
Generative AI for Technical Writer or Information Developers
Generative AI for Technical Writer or Information DevelopersGenerative AI for Technical Writer or Information Developers
Generative AI for Technical Writer or Information DevelopersRaghuram Pandurangan
 
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
 
How to write a Business Continuity Plan
How to write a Business Continuity PlanHow to write a Business Continuity Plan
How to write a Business Continuity PlanDatabarracks
 
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
 
"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii SoldatenkoFwdays
 
Visualising and forecasting stocks using Dash
Visualising and forecasting stocks using DashVisualising and forecasting stocks using Dash
Visualising and forecasting stocks using Dashnarutouzumaki53779
 
What is Artificial Intelligence?????????
What is Artificial Intelligence?????????What is Artificial Intelligence?????????
What is Artificial Intelligence?????????blackmambaettijean
 
Developer Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLDeveloper Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLScyllaDB
 
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
 
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
 
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
 

Último (20)

Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
 
SALESFORCE EDUCATION CLOUD | FEXLE SERVICES
SALESFORCE EDUCATION CLOUD | FEXLE SERVICESSALESFORCE EDUCATION CLOUD | FEXLE SERVICES
SALESFORCE EDUCATION CLOUD | FEXLE SERVICES
 
The State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptxThe State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptx
 
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
 
Digital Identity is Under Attack: FIDO Paris Seminar.pptx
Digital Identity is Under Attack: FIDO Paris Seminar.pptxDigital Identity is Under Attack: FIDO Paris Seminar.pptx
Digital Identity is Under Attack: FIDO Paris Seminar.pptx
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brand
 
Dev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio WebDev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio Web
 
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)
 
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
 
Generative AI for Technical Writer or Information Developers
Generative AI for Technical Writer or Information DevelopersGenerative AI for Technical Writer or Information Developers
Generative AI for Technical Writer or Information Developers
 
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
 
How to write a Business Continuity Plan
How to write a Business Continuity PlanHow to write a Business Continuity Plan
How to write a Business Continuity Plan
 
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
 
"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko
 
Visualising and forecasting stocks using Dash
Visualising and forecasting stocks using DashVisualising and forecasting stocks using Dash
Visualising and forecasting stocks using Dash
 
What is Artificial Intelligence?????????
What is Artificial Intelligence?????????What is Artificial Intelligence?????????
What is Artificial Intelligence?????????
 
Developer Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLDeveloper Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQL
 
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
 
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!
 
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 Trinity of Inclusive Web Development

  • 1. SEO, mobile web & accessibility: Trinity of Inclusive Web Development CSUN 2012 San Diego - March 2nd, 2012 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 /1
  • 2. Some Rights Reserved ttribution ⬌ NonCommercial ⬌ ShareAlike 2.5 Canada 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 /2
  • 3. Speaker enis Boudreau 11+ yrs experience - Web Accessibility Chairman, AccessibilitéWeb @dboudreau Co-editor, SGQRI 008 standards Invited Expert, W3C 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 /3
  • 4. Accessibility: A Tough Sell? aking accessibility happen hat was your experience? hat were the challenges? 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 /4
  • 5. Times, They Are A-Changin’ eviewing the a11y game plan ooking back at all we’ve accomplished ecognizing some practices as “sexier” f you can’t beat them, join them! 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 /5
  • 6. A Few Positive Signs... 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 /6
  • 7. At long last, #perfectA11y 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 /7
  • 8. A11y: Have We Lost Our Way? (Keep it Simple and Smart) oing back to basics... hat is the intent of web accessibility? orget obligations: aim for results! HOW ABOUT: Keeping Information Semantically Structured? ow does one eat an elephant? 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 /8
  • 9. Headed Towards Inclusion rogressively... ragmatically... ealistically... BUILDING a11y, ONE STEP AT A TIME Accessibility should not be about what legislators want. It should be about embodying inclusion and meeting the adaptation needs of real people. 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 /9
  • 10. Trinity of Inclusive Web Development ethinking the web development strategy nalysis of SEO / Mobile Web practices rawing a parallel between practices elling accessibility, indirectly ustifying efforts, differently 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 / 10
  • 11. My Own Personal 80/20 a11y Rule ost recurrent a11y problems encountered ocussing on the basics! ü Text Equivalents ü Keyboard Navigation ü Content Structure ü Forms Associations ü Color Contrasts ü Significant Hyperlinks ü Document Language ü Screen Reader Compatibility 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 / 11
  • 12. Because What It Comes Down To Is... 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 / 12
  • 13. ...Nothing Less Than Changing The World HOW CAN WE TURN THIS AROUND? 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 / 13
  • 14. Accessibility and the Mobile Web obile web best practices 1.0 0 practices declined in 5 themes • Overall Behavior • Navigation and Links • Page Layout and Content • Page Definition Resources • User Input Mobile Web Best Practices 1.0 - Basic Guidelines http://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éWeb Toll Free: 1 (877) 315-5550 / 14
  • 15. From WCAG 2.0 to MWBP 1.0 ridging WCAG 2.0 and MWBP 1.0 irectly related to WCAG 2.0 MWBP Elements Criteria Level WCAG Criteria lus 17 other Non-text alts criteria (AA and AAA) 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éWeb Toll Free: 1 (877) 315-5550 / 15
  • 16. Common Barriers ridging WCAG 2.0 and MWBP 1.0 xamples of barriers in user exp. rouped under the WCAG principles nother WCAG/MWBP mapping Resource Shared Web Experiences: Barriers Common to Mobile Device Users and People with Disabilities http://www.w3.org/WAI/mobile/experiences 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 / 16
  • 17. Accessibility and SEO Best Practices earch engines, including Google... nly understand text ever rely on external devices ely on the content structure ove section headings islike automatic refreshes njoy efficient navigation mechanisms 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 / 17
  • 18. SEO And Text Equivalents o salvation beyond text content 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 Audio Description or Media 1.2.3 A Alternative (Prerecorded) 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éWeb Toll Free: 1 (877) 315-5550 / 18
  • 19. SEO And Keyboard Navigation o navigationCriteria Details the mouse Criteria WCAG beyond 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éWeb Toll Free: 1 (877) 315-5550 / 19
  • 20. SEO And Content Structure eadings:WCAG Criteriaintegrated GPS Criteria HTML’s 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éWeb Toll Free: 1 (877) 315-5550 / 20
  • 21. SEO, Refreshes And Delays nfinite loopsCriteria Details Criteria WCAG and barriers to infos Level 2.2.1 Timing Adjustable A 2.2.1 Pause, Stop, Hide A 2.2.3 Additional Criterion AAA 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 / 21
  • 22. SEO And Efficient Navigation emantics: allCriteria Details CriteriaWCAG about making senseLevel 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éWeb Toll Free: 1 (877) 315-5550 / 22
  • 23. SEO And Significant Hyperlinks lick (w)Here!? Details Criteria WCAG Criteria Level 2.4.4 Link Purpose (in context) A 2.4.9 Additional Criterion AAA 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 / 23
  • 24. Overview – Setting An A11y Baseline winning combination on many levels Criteria to consider WCAG MWBP SEO Text Equivalents ✔ ✔ ✔ Keyboard Navigation ✔ ✔ ✔ Content Structure ✔ ✔ ✔ Significant Hyperlinks ✔ ✔ ✔ Refreshes and Delays ✔ - ✔ Efficient Navigation ✔ - ✔ Sufficient Color Contrasts ✔ ✔ - Forms Associations ✔ ✔ - Resource SEO and Accessibility Overlap http://www.communis.co.uk/blog/2009-08-06-seo-and-accessibility-overlap 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 / 24
  • 25. Bringing Down Barriers, One at a Time 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 / 25
  • 26. Beyond Best Practices, "Web Quality" 11y within a global quality process ecognize the progressive aspect of a11y ive up on the desire to do everything at once ivide work among the various stakeholders rioritize every team member's action items 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 dapt the production lifecycle to the gameplan / 26
  • 27. Finding Your WAI (way) he W3C provides a lot of resources resentations you can copy efore and After demo you can use Resource case resources usiness Finding Your WAI (way) to New Accessibility Resources http://www.w3.org/WAI/yourWAI.html oming across inaccessible websites nd much more! 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 / 27
  • 28. And Above All... Keep spreading the word. Be that change. 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 / 28
  • 29. Thank You! enis Boudreau, Spkr8 - Comments, suggestions? resident http://spkr8.com/t/9309 lideshare.net – present yourself! oopérative AccessibilitéWeb 751 Richardson street, suite 6111 ontreal (Quebec), Canada H3K 1G6 oll Free: +1 (877) 315-5550 2012. AccessibilitéWeb Toll Free: 1 (877) 315-5550 / 29 mail: dboudreau@accessibiliteweb.com