Accessibilité et SEO Conférence de Sébastien Delorme, chargé de mission accessibilité numérique ATALAN http://www.seo-campus.org/programme/samedi

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)

3. Chaîne de production Web

4. Et vous ?

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 ?

9. Écoutons

10. Nuire à l’accessibilité…

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…

29. Perspectives

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.