SlideShare a Scribd company logo
1 of 34
Download to read offline
Concilier accessibilité et SEO
Sébastien Delorme – Atalan – 20 février 2010 – SEO Campus 2010
Sébastien Delorme
Atalan

Expert et consultant en
accessibilité numérique
(…mais absolument pas en SEO)
Chaîne de production Web
Et vous ?
Natural search engine traffic
        saw a 25% increase,
    eventually growing to 50%.


"Significant improvement" in Google
  rankings "for all target keywords"


  Legal & General Group (L&G), 2007
  Source : http://www.w3.org/WAI/bcase/legal-and-general-case-study
De quoi ont-ils besoin ?
Classer ?
Lire !        Comprendre ?
                             Noter ?




De quoi ont-ils besoin ?
Lire !




De quoi ont-ils besoin ?
Écoutons
Nuire à l’accessibilité…
1.1. proposer des équivalents textuels à tout
          contenu non textuel […]




Équivalents textuels
1.1. proposer des équivalents textuels à tout
          contenu non textuel […]




                              « Utilisez l'attribut alt pour fournir un texte descriptif. Nous
                             vous recommandons également d'utiliser un texte descriptif et
                                une légende lisibles par les visiteurs pour vos images. »




Texte descriptif
<figure>
                   <img src="image.png" alt="Alternative">

                   <figcaption>
                            <p>Légende</p>
                   </figcaption>

        </figure>




HMTL 5 : figure, alternative, légende, … ?
http://dev.w3.org/html5/markup/figcaption.html#figcaption
1.4.5. si les technologies utilisées peuvent réaliser la présentation visuelle, du texte est utilisé
               pour véhiculer l'information plutôt que du texte sous forme d'image




      Texte mis en forme
1.4.5. si les technologies utilisées peuvent réaliser la présentation visuelle, du texte est utilisé
               pour véhiculer l'information plutôt que du texte sous forme d'image



« Pour présenter les éléments les plus importants de votre site (noms, contenu, liens, etc.),
                  utilisez du texte plutôt que des éléments graphiques. »




      Texte mis en forme
1.2. proposer des versions de remplacement aux
                 médias temporels




Transcripts, sous-titres, …
1.2. proposer des versions de remplacement aux
                 médias temporels



                      « Insérez le texte décrivant le contenu de vos vidéos
                     dans le code HTML. Vous pouvez également fournir
                               des transcriptions de vos vidéos. »




Transcripts, sous-titres, …
30% increase in traffic from Google after
  CNET started providing transcripts


      “We saw a significant increase in SEO referrals
      when we launched an HTML version of our site,
    the major component of which was our transcripts.”




    Justin Eckhouse, CNET, 2009
    Source : http://www.w3.org/WAI/bcase/resources.html
Comprendre ?




De quoi ont-ils besoin ?
2.4.2. les pages Web présentent un titre qui
              décrit leur sujet ou leur but.




Tout est dans le titre !
2.4.2. les pages Web présentent un titre qui
              décrit leur sujet ou leur but.




                     « Assurez-vous que le texte associé [à la balise]
                           <title> est descriptif et pertinent.. »




Tout est dans le titre !
1.3.1. l'information, la structure et les relations
      véhiculées par la présentation peuvent être
   déterminées par un programme informatique […]



               2.4.6. les en-têtes et les étiquettes décrivent le
                                sujet ou le but



                         2.4.10. les en-têtes de section sont utilisés pour
                                       organiser le contenu




Structurer l’information
« Si votre site contient du texte ou des liens
          cachés, il risque d'être considéré comme peu
        fiable, car il présente aux moteurs de recherche
            un contenu différent de celui destiné aux
                             visiteurs. »




Nuire au référencement
Classer ?
                           Noter ?




De quoi ont-ils besoin ?
2.4.4. la fonction de chaque lien est déterminée
 par le texte du lien seul ou par le texte du lien
associé à un contexte du lien déterminé par un
            programme informatique



                    2.4.9. un mécanisme permet de déterminer la
                     fonction de chaque lien par le texte du lien
                                    uniquement




   Liens
2.4.4. la fonction de chaque lien est déterminée
 par le texte du lien seul ou par le texte du lien
associé à un contexte du lien déterminé par un
            programme informatique



                    2.4.9. un mécanisme permet de déterminer la
                     fonction de chaque lien par le texte du lien
                                    uniquement




                                                 « créez des liens texte pertinents »




   Liens
Si certaines fonctionnalités (JavaScript, […]
                                                ou contenus Flash) vous empêchent
4.1. optimiser la compatibilité avec les
                                             d'afficher la totalité de votre site dans un
 agents utilisateurs actuels et futurs, y
                                               navigateur texte, il est possible que les
compris les technologies d'assistance.
                                            robots rencontrent des difficultés similaires
                                                      lors de leur exploration.




    Bien d’autres exemples…
G63: Fournir un    « créez un
          plan de site    plan de site »




Bien d’autres exemples…
Perspectives
« Tenez compte de
                                        l’accessibilité »
                                      Google Webmasters/Site Owners Help Pages




    « Accessibility
  Improving Search
Engine Optimization »
   W3C Web Accessibility Initiative
Référencer les contenus vidéo
en les rendant plus accessibles
Améliorer l’accessibilité des PDF
en ajoutant de la sémantique (utilisable par les moteurs de recherche ?)
Règles pour l'accessibilité des contenus Web (WCAG) 2.0
http://www.w3.org/Translations/WCAG20-fr/

Google, consignes aux webmasters
http://www.google.com/support/webmasters/bin/answer.py?answer=35769

Google, textes et liens cachés
http://www.google.com/support/webmasters/bin/answer.py?answer=66353

Google, importance of link architecture
http://googlewebmastercentral.blogspot.com/2008/10/importance-of-link-architecture.html




      Sources W3C et Google
Sébastien Delorme
Consultant accessibilité numérique
sdelorme@atalan.fr

www.atalan.fr
www.ideance.net
www.tentatives-accessibles.eu
www.planete-accessibilite.com



Crédits photos
Toutes les photos utilisées pour cette
présentation sont sous licence Creative
Commons et diffusées sur Flickr.

Merci à :
Astrid Photography, boltron, Don Solo, mr • p,
p-d, Steve Webel, Thomas Hawk,
urbangarden, _teb.

More Related Content

Viewers also liked

[Atelier LCDW] Ergonomie et Expérience Utilisateur pour en finir avec les myt...
[Atelier LCDW] Ergonomie et Expérience Utilisateur pour en finir avec les myt...[Atelier LCDW] Ergonomie et Expérience Utilisateur pour en finir avec les myt...
[Atelier LCDW] Ergonomie et Expérience Utilisateur pour en finir avec les myt...Bertrand Cochet
 
Ergonomie des interfaces web
Ergonomie des interfaces webErgonomie des interfaces web
Ergonomie des interfaces webRenaud Biemans
 
Lois de la Gestalt et Webdesign
Lois de la Gestalt et WebdesignLois de la Gestalt et Webdesign
Lois de la Gestalt et WebdesignMC Casal
 
Ergonomie et accessibilité du Web
Ergonomie et accessibilité du WebErgonomie et accessibilité du Web
Ergonomie et accessibilité du WebGenève Lab
 
L'ergonomie d'un site web par Fred Colantonio
L'ergonomie d'un site web par Fred ColantonioL'ergonomie d'un site web par Fred Colantonio
L'ergonomie d'un site web par Fred ColantonioJ'ai besoin de com
 
Ergonomie web : Les étapes pour la création d'un site web
Ergonomie web : Les étapes pour la création d'un site webErgonomie web : Les étapes pour la création d'un site web
Ergonomie web : Les étapes pour la création d'un site webLaurent Mottet
 
La gestion de projet web en 15 étapes
La gestion de projet web en 15 étapesLa gestion de projet web en 15 étapes
La gestion de projet web en 15 étapesRodolphe Finamore
 
Tester le niveau d'accessibilité d'un thème WordPress
Tester le niveau d'accessibilité d'un thème WordPressTester le niveau d'accessibilité d'un thème WordPress
Tester le niveau d'accessibilité d'un thème WordPressClaire Bizingre
 
Handicap et accessibilité : où en est le e-learning ?
Handicap et  accessibilité : où en est le e-learning ?Handicap et  accessibilité : où en est le e-learning ?
Handicap et accessibilité : où en est le e-learning ?UnI Learning France
 
Ergonomie web & interface tactile
Ergonomie web & interface tactileErgonomie web & interface tactile
Ergonomie web & interface tactileIdnetInfo
 
Ergonomie des applications web
Ergonomie des applications webErgonomie des applications web
Ergonomie des applications webmadsgraphics
 
Guide moodle handicap [Septembre 2013]
Guide moodle handicap [Septembre 2013]Guide moodle handicap [Septembre 2013]
Guide moodle handicap [Septembre 2013]floriebrange
 
Booster l'Ergonomie et Expérience Utilisateur Digitale (web & mobile)
Booster l'Ergonomie et Expérience Utilisateur Digitale (web & mobile)Booster l'Ergonomie et Expérience Utilisateur Digitale (web & mobile)
Booster l'Ergonomie et Expérience Utilisateur Digitale (web & mobile)Raphael De Robiano
 
Les principes Gestalt appliqués au webdesign
Les principes Gestalt appliqués au webdesignLes principes Gestalt appliqués au webdesign
Les principes Gestalt appliqués au webdesignUX REPUBLIC
 
L'ergonomie d'un site web : pensez utilisateurs et facilitez-leur l'action
L'ergonomie d'un site web : pensez utilisateurs et facilitez-leur l'actionL'ergonomie d'un site web : pensez utilisateurs et facilitez-leur l'action
L'ergonomie d'un site web : pensez utilisateurs et facilitez-leur l'actionFred Colantonio
 

Viewers also liked (18)

[Atelier LCDW] Ergonomie et Expérience Utilisateur pour en finir avec les myt...
[Atelier LCDW] Ergonomie et Expérience Utilisateur pour en finir avec les myt...[Atelier LCDW] Ergonomie et Expérience Utilisateur pour en finir avec les myt...
[Atelier LCDW] Ergonomie et Expérience Utilisateur pour en finir avec les myt...
 
Gestalt
GestaltGestalt
Gestalt
 
Ergonomie des interfaces web
Ergonomie des interfaces webErgonomie des interfaces web
Ergonomie des interfaces web
 
Lois de la Gestalt et Webdesign
Lois de la Gestalt et WebdesignLois de la Gestalt et Webdesign
Lois de la Gestalt et Webdesign
 
Ergonomie et accessibilité du Web
Ergonomie et accessibilité du WebErgonomie et accessibilité du Web
Ergonomie et accessibilité du Web
 
L'ergonomie d'un site web par Fred Colantonio
L'ergonomie d'un site web par Fred ColantonioL'ergonomie d'un site web par Fred Colantonio
L'ergonomie d'un site web par Fred Colantonio
 
Ergonomie web : Les étapes pour la création d'un site web
Ergonomie web : Les étapes pour la création d'un site webErgonomie web : Les étapes pour la création d'un site web
Ergonomie web : Les étapes pour la création d'un site web
 
La gestion de projet web en 15 étapes
La gestion de projet web en 15 étapesLa gestion de projet web en 15 étapes
La gestion de projet web en 15 étapes
 
Tester le niveau d'accessibilité d'un thème WordPress
Tester le niveau d'accessibilité d'un thème WordPressTester le niveau d'accessibilité d'un thème WordPress
Tester le niveau d'accessibilité d'un thème WordPress
 
Handicap et accessibilité : où en est le e-learning ?
Handicap et  accessibilité : où en est le e-learning ?Handicap et  accessibilité : où en est le e-learning ?
Handicap et accessibilité : où en est le e-learning ?
 
Ergonomie web & interface tactile
Ergonomie web & interface tactileErgonomie web & interface tactile
Ergonomie web & interface tactile
 
Ergonomie des applications web
Ergonomie des applications webErgonomie des applications web
Ergonomie des applications web
 
Guide moodle handicap [Septembre 2013]
Guide moodle handicap [Septembre 2013]Guide moodle handicap [Septembre 2013]
Guide moodle handicap [Septembre 2013]
 
Booster l'Ergonomie et Expérience Utilisateur Digitale (web & mobile)
Booster l'Ergonomie et Expérience Utilisateur Digitale (web & mobile)Booster l'Ergonomie et Expérience Utilisateur Digitale (web & mobile)
Booster l'Ergonomie et Expérience Utilisateur Digitale (web & mobile)
 
Webdesign, UX et UCD #4
Webdesign, UX et UCD #4Webdesign, UX et UCD #4
Webdesign, UX et UCD #4
 
Les principes Gestalt appliqués au webdesign
Les principes Gestalt appliqués au webdesignLes principes Gestalt appliqués au webdesign
Les principes Gestalt appliqués au webdesign
 
Lean UX
Lean UX Lean UX
Lean UX
 
L'ergonomie d'un site web : pensez utilisateurs et facilitez-leur l'action
L'ergonomie d'un site web : pensez utilisateurs et facilitez-leur l'actionL'ergonomie d'un site web : pensez utilisateurs et facilitez-leur l'action
L'ergonomie d'un site web : pensez utilisateurs et facilitez-leur l'action
 

Similar to Concilier accessibilité et SEO

Accessibilité et référencement - Paris Web 2010
Accessibilité et référencement - Paris Web 2010Accessibilité et référencement - Paris Web 2010
Accessibilité et référencement - Paris Web 2010relevant_traffic_france
 
Cours referencement optimisation
Cours referencement optimisationCours referencement optimisation
Cours referencement optimisationRémi Bachelet
 
Cours_1 - HTML5 et JS.ppt
Cours_1 - HTML5 et JS.pptCours_1 - HTML5 et JS.ppt
Cours_1 - HTML5 et JS.pptRihabBENLAMINE
 
Environnement et technologies web
Environnement et technologies webEnvironnement et technologies web
Environnement et technologies webIrinaTsimpilova1
 
Composant optimisation seo
Composant optimisation seoComposant optimisation seo
Composant optimisation seoUX_Claurent
 
Drupal en bibliothèque (2008)
Drupal en bibliothèque (2008)Drupal en bibliothèque (2008)
Drupal en bibliothèque (2008)Nicolas Morin
 
Creation de-themes-wp
Creation de-themes-wpCreation de-themes-wp
Creation de-themes-wpChi Nacim
 
Formation developpement web KADODJOMON EMMANUEL COULIBALY.pptx
Formation developpement web KADODJOMON EMMANUEL COULIBALY.pptxFormation developpement web KADODJOMON EMMANUEL COULIBALY.pptx
Formation developpement web KADODJOMON EMMANUEL COULIBALY.pptxtanokouakouludovic
 
Accessibilité et HTML5
Accessibilité et HTML5Accessibilité et HTML5
Accessibilité et HTML5Hafid Denguir
 
Gueye babacar référencement images-video
Gueye babacar référencement images-videoGueye babacar référencement images-video
Gueye babacar référencement images-videogueyebaba
 
Mettre en place un intranet ou un site web public en SharePoint 2013 autour d...
Mettre en place un intranet ou un site web public en SharePoint 2013 autour d...Mettre en place un intranet ou un site web public en SharePoint 2013 autour d...
Mettre en place un intranet ou un site web public en SharePoint 2013 autour d...Franck Cornu
 
Clinique SEO Google - Nathalie Peret - SEO Campus 2010
Clinique SEO Google - Nathalie Peret - SEO Campus 2010Clinique SEO Google - Nathalie Peret - SEO Campus 2010
Clinique SEO Google - Nathalie Peret - SEO Campus 2010SEO CAMP
 
Systèmes de Gestion de Contenu (SGC)
Systèmes de Gestion de Contenu (SGC)Systèmes de Gestion de Contenu (SGC)
Systèmes de Gestion de Contenu (SGC)Laurent Moccozet
 
Presentation CMIS Acquia + Alfresco - Confoo2010
Presentation CMIS Acquia + Alfresco - Confoo2010Presentation CMIS Acquia + Alfresco - Confoo2010
Presentation CMIS Acquia + Alfresco - Confoo2010Gestion-Ressources Inc.
 
Outils Web 2.0 appliqués aux bibliothèques
Outils Web 2.0 appliqués aux bibliothèquesOutils Web 2.0 appliqués aux bibliothèques
Outils Web 2.0 appliqués aux bibliothèquesKOMOROWSKI Corinne
 

Similar to Concilier accessibilité et SEO (20)

Accessibilité et référencement - Paris Web 2010
Accessibilité et référencement - Paris Web 2010Accessibilité et référencement - Paris Web 2010
Accessibilité et référencement - Paris Web 2010
 
Cours referencement optimisation
Cours referencement optimisationCours referencement optimisation
Cours referencement optimisation
 
BDW-ProgWEB_P1.pdf
BDW-ProgWEB_P1.pdfBDW-ProgWEB_P1.pdf
BDW-ProgWEB_P1.pdf
 
Cours_1 - HTML5 et JS.ppt
Cours_1 - HTML5 et JS.pptCours_1 - HTML5 et JS.ppt
Cours_1 - HTML5 et JS.ppt
 
Environnement et technologies web
Environnement et technologies webEnvironnement et technologies web
Environnement et technologies web
 
Composant optimisation seo
Composant optimisation seoComposant optimisation seo
Composant optimisation seo
 
Drupal en bibliothèque (2008)
Drupal en bibliothèque (2008)Drupal en bibliothèque (2008)
Drupal en bibliothèque (2008)
 
Creation de-themes-wp
Creation de-themes-wpCreation de-themes-wp
Creation de-themes-wp
 
Formation developpement web KADODJOMON EMMANUEL COULIBALY.pptx
Formation developpement web KADODJOMON EMMANUEL COULIBALY.pptxFormation developpement web KADODJOMON EMMANUEL COULIBALY.pptx
Formation developpement web KADODJOMON EMMANUEL COULIBALY.pptx
 
Accessibilité et HTML5
Accessibilité et HTML5Accessibilité et HTML5
Accessibilité et HTML5
 
Gueye babacar référencement images-video
Gueye babacar référencement images-videoGueye babacar référencement images-video
Gueye babacar référencement images-video
 
Mettre en place un intranet ou un site web public en SharePoint 2013 autour d...
Mettre en place un intranet ou un site web public en SharePoint 2013 autour d...Mettre en place un intranet ou un site web public en SharePoint 2013 autour d...
Mettre en place un intranet ou un site web public en SharePoint 2013 autour d...
 
Clinique SEO Google - Nathalie Peret - SEO Campus 2010
Clinique SEO Google - Nathalie Peret - SEO Campus 2010Clinique SEO Google - Nathalie Peret - SEO Campus 2010
Clinique SEO Google - Nathalie Peret - SEO Campus 2010
 
Systèmes de Gestion de Contenu (SGC)
Systèmes de Gestion de Contenu (SGC)Systèmes de Gestion de Contenu (SGC)
Systèmes de Gestion de Contenu (SGC)
 
Web2 Rennes Janvier 2010
Web2 Rennes Janvier 2010Web2 Rennes Janvier 2010
Web2 Rennes Janvier 2010
 
Introduction à HTML 5
Introduction à HTML 5Introduction à HTML 5
Introduction à HTML 5
 
Presentation CMIS Acquia + Alfresco - Confoo2010
Presentation CMIS Acquia + Alfresco - Confoo2010Presentation CMIS Acquia + Alfresco - Confoo2010
Presentation CMIS Acquia + Alfresco - Confoo2010
 
Outils Web 2.0 appliqués aux bibliothèques
Outils Web 2.0 appliqués aux bibliothèquesOutils Web 2.0 appliqués aux bibliothèques
Outils Web 2.0 appliqués aux bibliothèques
 
Les dessous de html+ccs+js
Les dessous de html+ccs+jsLes dessous de html+ccs+js
Les dessous de html+ccs+js
 
Web 2.0 Wikipedia
Web 2.0 WikipediaWeb 2.0 Wikipedia
Web 2.0 Wikipedia
 

More from Sébastien Delorme

L'accessibilité des applications web mobiles, ou la véritable histoire d’un p...
L'accessibilité des applications web mobiles, ou la véritable histoire d’un p...L'accessibilité des applications web mobiles, ou la véritable histoire d’un p...
L'accessibilité des applications web mobiles, ou la véritable histoire d’un p...Sébastien Delorme
 
Intégrer l'accessibilité dans une démarche qualité
Intégrer l'accessibilité dans une démarche qualitéIntégrer l'accessibilité dans une démarche qualité
Intégrer l'accessibilité dans une démarche qualitéSébastien Delorme
 
Intégrer l'accessibilité dans une démarche qualité
Intégrer l'accessibilité dans une démarche qualitéIntégrer l'accessibilité dans une démarche qualité
Intégrer l'accessibilité dans une démarche qualitéSébastien Delorme
 
Accessibilité & e-recrutement
Accessibilité & e-recrutementAccessibilité & e-recrutement
Accessibilité & e-recrutementSébastien Delorme
 
ARIA - Live region attributes (attributs de régions dynamiques)
ARIA - Live region attributes (attributs de régions dynamiques)ARIA - Live region attributes (attributs de régions dynamiques)
ARIA - Live region attributes (attributs de régions dynamiques)Sébastien Delorme
 
WCAG 2.0, Flash, PDF, Javascript sont dans un bateau...
WCAG 2.0, Flash, PDF, Javascript sont dans un bateau...WCAG 2.0, Flash, PDF, Javascript sont dans un bateau...
WCAG 2.0, Flash, PDF, Javascript sont dans un bateau...Sébastien Delorme
 
L'innovation portée par les utilisateurs
L'innovation portée par les utilisateursL'innovation portée par les utilisateurs
L'innovation portée par les utilisateursSébastien Delorme
 
Et si je me mettais à sa place ?
Et si je me mettais à sa place ?Et si je me mettais à sa place ?
Et si je me mettais à sa place ?Sébastien Delorme
 

More from Sébastien Delorme (8)

L'accessibilité des applications web mobiles, ou la véritable histoire d’un p...
L'accessibilité des applications web mobiles, ou la véritable histoire d’un p...L'accessibilité des applications web mobiles, ou la véritable histoire d’un p...
L'accessibilité des applications web mobiles, ou la véritable histoire d’un p...
 
Intégrer l'accessibilité dans une démarche qualité
Intégrer l'accessibilité dans une démarche qualitéIntégrer l'accessibilité dans une démarche qualité
Intégrer l'accessibilité dans une démarche qualité
 
Intégrer l'accessibilité dans une démarche qualité
Intégrer l'accessibilité dans une démarche qualitéIntégrer l'accessibilité dans une démarche qualité
Intégrer l'accessibilité dans une démarche qualité
 
Accessibilité & e-recrutement
Accessibilité & e-recrutementAccessibilité & e-recrutement
Accessibilité & e-recrutement
 
ARIA - Live region attributes (attributs de régions dynamiques)
ARIA - Live region attributes (attributs de régions dynamiques)ARIA - Live region attributes (attributs de régions dynamiques)
ARIA - Live region attributes (attributs de régions dynamiques)
 
WCAG 2.0, Flash, PDF, Javascript sont dans un bateau...
WCAG 2.0, Flash, PDF, Javascript sont dans un bateau...WCAG 2.0, Flash, PDF, Javascript sont dans un bateau...
WCAG 2.0, Flash, PDF, Javascript sont dans un bateau...
 
L'innovation portée par les utilisateurs
L'innovation portée par les utilisateursL'innovation portée par les utilisateurs
L'innovation portée par les utilisateurs
 
Et si je me mettais à sa place ?
Et si je me mettais à sa place ?Et si je me mettais à sa place ?
Et si je me mettais à sa place ?
 

Concilier accessibilité et SEO

  • 1. Concilier accessibilité et SEO Sébastien Delorme – Atalan – 20 février 2010 – SEO Campus 2010
  • 2. Sébastien Delorme Atalan Expert et consultant en accessibilité numérique (…mais absolument pas en SEO)
  • 5. Natural search engine traffic saw a 25% increase, eventually growing to 50%. "Significant improvement" in Google rankings "for all target keywords" Legal & General Group (L&G), 2007 Source : http://www.w3.org/WAI/bcase/legal-and-general-case-study
  • 6. De quoi ont-ils besoin ?
  • 7. Classer ? Lire ! Comprendre ? Noter ? De quoi ont-ils besoin ?
  • 8. Lire ! De quoi ont-ils besoin ?
  • 11. 1.1. proposer des équivalents textuels à tout contenu non textuel […] Équivalents textuels
  • 12. 1.1. proposer des équivalents textuels à tout contenu non textuel […] « Utilisez l'attribut alt pour fournir un texte descriptif. Nous vous recommandons également d'utiliser un texte descriptif et une légende lisibles par les visiteurs pour vos images. » Texte descriptif
  • 13. <figure> <img src="image.png" alt="Alternative"> <figcaption> <p>Légende</p> </figcaption> </figure> HMTL 5 : figure, alternative, légende, … ? http://dev.w3.org/html5/markup/figcaption.html#figcaption
  • 14. 1.4.5. si les technologies utilisées peuvent réaliser la présentation visuelle, du texte est utilisé pour véhiculer l'information plutôt que du texte sous forme d'image Texte mis en forme
  • 15. 1.4.5. si les technologies utilisées peuvent réaliser la présentation visuelle, du texte est utilisé pour véhiculer l'information plutôt que du texte sous forme d'image « Pour présenter les éléments les plus importants de votre site (noms, contenu, liens, etc.), utilisez du texte plutôt que des éléments graphiques. » Texte mis en forme
  • 16. 1.2. proposer des versions de remplacement aux médias temporels Transcripts, sous-titres, …
  • 17. 1.2. proposer des versions de remplacement aux médias temporels « Insérez le texte décrivant le contenu de vos vidéos dans le code HTML. Vous pouvez également fournir des transcriptions de vos vidéos. » Transcripts, sous-titres, …
  • 18. 30% increase in traffic from Google after CNET started providing transcripts “We saw a significant increase in SEO referrals when we launched an HTML version of our site, the major component of which was our transcripts.” Justin Eckhouse, CNET, 2009 Source : http://www.w3.org/WAI/bcase/resources.html
  • 19. Comprendre ? De quoi ont-ils besoin ?
  • 20. 2.4.2. les pages Web présentent un titre qui décrit leur sujet ou leur but. Tout est dans le titre !
  • 21. 2.4.2. les pages Web présentent un titre qui décrit leur sujet ou leur but. « Assurez-vous que le texte associé [à la balise] <title> est descriptif et pertinent.. » Tout est dans le titre !
  • 22. 1.3.1. l'information, la structure et les relations véhiculées par la présentation peuvent être déterminées par un programme informatique […] 2.4.6. les en-têtes et les étiquettes décrivent le sujet ou le but 2.4.10. les en-têtes de section sont utilisés pour organiser le contenu Structurer l’information
  • 23. « Si votre site contient du texte ou des liens cachés, il risque d'être considéré comme peu fiable, car il présente aux moteurs de recherche un contenu différent de celui destiné aux visiteurs. » Nuire au référencement
  • 24. Classer ? Noter ? De quoi ont-ils besoin ?
  • 25. 2.4.4. la fonction de chaque lien est déterminée par le texte du lien seul ou par le texte du lien associé à un contexte du lien déterminé par un programme informatique 2.4.9. un mécanisme permet de déterminer la fonction de chaque lien par le texte du lien uniquement Liens
  • 26. 2.4.4. la fonction de chaque lien est déterminée par le texte du lien seul ou par le texte du lien associé à un contexte du lien déterminé par un programme informatique 2.4.9. un mécanisme permet de déterminer la fonction de chaque lien par le texte du lien uniquement « créez des liens texte pertinents » Liens
  • 27. Si certaines fonctionnalités (JavaScript, […] ou contenus Flash) vous empêchent 4.1. optimiser la compatibilité avec les d'afficher la totalité de votre site dans un agents utilisateurs actuels et futurs, y navigateur texte, il est possible que les compris les technologies d'assistance. robots rencontrent des difficultés similaires lors de leur exploration. Bien d’autres exemples…
  • 28. G63: Fournir un « créez un plan de site plan de site » Bien d’autres exemples…
  • 30. « Tenez compte de l’accessibilité » Google Webmasters/Site Owners Help Pages « Accessibility Improving Search Engine Optimization » W3C Web Accessibility Initiative
  • 31. Référencer les contenus vidéo en les rendant plus accessibles
  • 32. Améliorer l’accessibilité des PDF en ajoutant de la sémantique (utilisable par les moteurs de recherche ?)
  • 33. Règles pour l'accessibilité des contenus Web (WCAG) 2.0 http://www.w3.org/Translations/WCAG20-fr/ Google, consignes aux webmasters http://www.google.com/support/webmasters/bin/answer.py?answer=35769 Google, textes et liens cachés http://www.google.com/support/webmasters/bin/answer.py?answer=66353 Google, importance of link architecture http://googlewebmastercentral.blogspot.com/2008/10/importance-of-link-architecture.html Sources W3C et Google
  • 34. Sébastien Delorme Consultant accessibilité numérique sdelorme@atalan.fr www.atalan.fr www.ideance.net www.tentatives-accessibles.eu www.planete-accessibilite.com Crédits photos Toutes les photos utilisées pour cette présentation sont sous licence Creative Commons et diffusées sur Flickr. Merci à : Astrid Photography, boltron, Don Solo, mr • p, p-d, Steve Webel, Thomas Hawk, urbangarden, _teb.