Le document aborde les concepts de référencement, accessibilité et utilisabilité web en soulignant leur interconnexion. Il fournit des recommandations pratiques pour optimiser la visibilité sur les moteurs de recherche tout en garantissant l'accès aux personnes handicapées. Il insiste sur l'importance des éléments sémantiques et des bonnes pratiques techniques pour améliorer l'expérience utilisateur et le SEO.

1. Référencement & utilisabilité :des objectifs différents,des méthodes quiconvergent Sébastien Billard, consultant référencement

2. Partis-prisLes WCAG 1.0 et la version 1.1 des critères Accessiweb seront pris comme référence, car mieux connus du conférencier ;)

3. HTML 5 ne sera pas abordé, car non finalisé.

4. Les termes « accessibilité » et « utilisabilité » pourront des fois (abusivement) être utilisés l’un à la place de l’autre.DéfinitionsRéférencement : ensemble des techniques visant à maximiser la visibilité dans les résultats naturels des moteurs de recherche.

5. Accessibilité web : ensembles des techniques visant à assurer l’accès aux contenus web pour les personnes handicapées.

6. Utilisabilité web : ensembles des techniques visant à maximiser l’efficacité, l’efficience et la satisfaction des utilisateurs.Référencement et utilisabilitéSelon Peter Morville, la trouvabilité (findability) désigne la capacité des utilisateurs à identifier un site et à naviguer en son sein pour accéder à l'information recherchée.

7. La trouvabilité dans les moteurs participe à une bonne utilisabilité générale du web (efficacité, efficience, satisfaction).

8. Travailler son référencement, c’est donc travailler à l’utilisabilité de son site, alors même que l’utilisateur n’a pas encore accédé à celui-ci.Mais le référencement, comment ça fonctionne au juste ?

9. Ce qui conditionne le référencementL'ensemble de ces composantes doit être optimisé pour obtenir une bonne visibilité :Directives d’accessibilité et référencement

10. « Fournissez un équivalent textuel à chaque élément non textuel (1.1) »

11. Les moteurs de recherche ne savent lire que le texte (cliché du robot handicapé…)

12. L’attribut alt permet d’associer du texte aux images, qui sera pris en compte par les moteurs, aussi bien pour la recherche web que la recherche d’images.

13. L’attribut longdesc permet d’associer à une image une page de description, mais il est ignoré des moteurs. Préférer une légende dans ce cas.L’attribut alt est déterminant pour la visibilité des images

14. Attention : les images peuvent constituer une information, ou un simple embellissement. L’attribut alt sur une image purement décorative n’a de sens ni pour l’accessibilité ni pour le référencement. De même pour les attributs alt « hors sujet » .Une puce n’est pas une information…L’attribut alt n’est pas une planque à mots-clés…

15. Il n’y a pas que les images…Les équivalents textuels concernent aussi d’autres éléments.

16. Scripts et applets : les balises <noscript>, <noembed>, le contenu alternatif des balises <object> sont bien pris en compte par les moteurs.

17. Frames : le contenu des balises <noframe> est bien pris en compte par les moteurs (mais utiliser les frames pose d’autres problèmes…)

18. Vidéo et audio : le mieux reste de fournir un transcript, éventuellement un résumé ou une description.Contenu alternatif pour les balises <embed>Contenu alternatif pour les éléments multimedias

19. « Fournissez des liens textes redondants pour chaque région d’une carte cliquable côté serveur (1.2) »« Fournissez des liens textes redondants pour chaque région d’une carte cliquable côté client (1.5) »

20. Les images maps coté serveur sont inaccessibles aux moteurs de recherche. Les liens HTML alternatifs sont le seul moyen de permettre le référencement des pages liées.

21. Les images maps coté client sont accessibles aux moteurs de recherche, mais les liens n’ont pas d’ancres. Les attributs alt sont nécessaires pour donner de la pertinence aux liens.Les liens href sont suivis et le contenu des attributs alt pris en compteLes moteurs ne cliquent pas…

22. « Utilisez des balises plutôt que des images pour transmettre l’information (3.1) »

23. Le texte HTML est à privilégier autant que possible.

24. Exploitez les possibilités typographique des CSS.

25. Utilisez des techniques accessibles de remplacement de textes (sIFR).

26. Commentez les contenus graphiques.Exemples de remplacement dynamique de textes

27. « Créez des documents valides (3.2) »

28. Il n’y a pas de prime à la validation.

29. La validité n’est pas liée à la pertinence.

30. La validité n’est pas l’accessibilité.

31. Toutefois la validité protège de quelques erreurs de codage qui pourraient affecter les moteurs (quoique ceux-ci sont tolérants).« Utilisez CSS pour contrôler la mise en page et la présentation (3.3) »

32. Il est parfaitement possible de positionner un site avec de la « soupe de balise »

33. CSS permet toutefois d’alléger les pages et d’accélerer leur chargement, ce qui est favorable à une bonne indexation.

34. Google a également annoncé prendre en compte la vitesse de chargement des pages dans son algorithme.« Utilisez les éléments de titres pour exprimer la structure des documents (3.5) »« Balisez les listes et élements de façon adéquate (3. 6) »

35. Les balises dites « sémantiques » sont bien prises en compte par les moteurs et aident les moteurs à appréhender le contenu.

36. Le contenu des balises <h1> à <h6> et des balises <b> et <strong> en particulier se voit reconnaître une importance particulière.

37. <h1> <strong>Ne cédez pas au détournement de balises !</strong> </h1> « N'utilisez pas de tableaux de mise en page sauf si le contenu fait sens une fois linéarisé (5.3) »

38. Le contenu des tables est techniquement accessible aux moteurs.

39. Mais les tableaux de mise en page mal utilisés peuvent obscurcir le contenu, pour les moteurs comme pour les visiteurs.

40. L’imbrication (des tables dans des tables dans des tables dans…) est potentiellement la plus destructrice.Linéarisation« Ceci une phrase est »Imbrication

41. « Assurez-vous que les pages restent utilisables quand les scripts, applets etc sont désactivés (6.3) »

42. Les robots des moteurs sont très limités : ils n’interprètent pas Javascript, ni AJAX et ne sont équippés d’aucun plugin (Flash…)

43. Sans contenu alternatif, un site Flash est un site vide pour un moteur.

44. Un site utilisant javascript peut être plus ou moins accessible, selon que javascript vient en surcouche ou non (dégradation élégante).Ce que voit l’utilisateur valide (s’il a Flash)Ce que voit le moteur (c’est à dire pas grand-chose)

45. « N'utilisez pas des balises pour rediriger les pages automatiquement. Utilisez des redirections coté serveur (7.5) »

46. Il existe 2 types de redirections : coté client (meta refresh, javascript), et coté serveur.

47. Seules les redirections coté serveur sont correctement suivies par les moteurs (la 301 étant la seule transmettant du PageRank).« Identifiez clairement la destination de chaque lien. (13.1) »

48. Les liens transmettent de la popularité (PageRank), permettent le parcours du site par les robots… mais sont aussi porteurs de pertinence.

49. Les moteurs considèrent les intitulé (ancres) des liens comme un signal. Il est donc important d’y faire figurer des mots-clés.La page Adobe ne contient pas l’expression « click here »…

50. « Fournissez des meta-données pour ajouter de l’information sémantique aux pages et aux sites . (13.2) »