SlideShare une entreprise Scribd logo
1  sur  50
Référencement & utilisabilité : des objectifs différents, des méthodes qui convergent  Sébastien Billard, consultant référencement
Partis-pris ,[object Object]
HTML 5 ne sera pas abordé, car non finalisé.
Les termes « accessibilité » et « utilisabilité » pourront des fois (abusivement) être utilisés l’un à la place de l’autre.,[object Object]
Accessibilité web : ensembles des techniques visant à assurer l’accès aux contenus web pour les personnes handicapées.
Utilisabilité web : ensembles des techniques visant à maximiser l’efficacité, l’efficience et la satisfaction des utilisateurs.,[object Object]
La trouvabilité dans les moteurs participe à une bonne utilisabilité générale du web (efficacité, efficience, satisfaction).
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.,[object Object]
Ce qui conditionne le référencement ,[object Object],[object Object]
« Fournissez un équivalent textuel à chaque élément non textuel (1.1) »
[object Object]
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.
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
[object Object],Une puce n’est pas une information… L’attribut alt n’est pas une planque à mots-clés…
Il n’y a pas que les images… ,[object Object]
Scripts et applets : les balises <noscript>, <noembed>, le contenu alternatif des balises <object> sont bien pris en compte par les moteurs.
Frames : le contenu des balises <noframe> est bien pris en compte par les moteurs (mais utiliser les frames pose d’autres problèmes…)
Vidéo et audio : le mieux reste de fournir un transcript, éventuellement un résumé ou une description.,[object Object]
«  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) »
[object Object]
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 compte Les moteurs ne cliquent pas…
«  Utilisez des balises plutôt que des images pour transmettre l’information (3.1) »
[object Object]
Exploitez les possibilités typographique des CSS.
Utilisez des techniques accessibles de remplacement de textes (sIFR).
Commentez les contenus graphiques.Exemples de remplacement dynamique de textes
«  Créez des documents valides (3.2) »
[object Object]
La validité n’est pas liée à la pertinence.
La validité n’est pas l’accessibilité.
Toutefois la validité protège de quelques erreurs de codage qui pourraient affecter les moteurs (quoique ceux-ci sont tolérants).,[object Object]
[object Object]
CSS permet toutefois d’alléger les pages et d’accélerer leur chargement, ce qui est favorable à une bonne indexation.
Google a également annoncé prendre en compte la vitesse de chargement des pages dans son algorithme.,[object Object]
[object Object]
Le contenu des balises <h1> à <h6> et des balises <b> et <strong> en particulier se voit reconnaître une importance particulière.
<h1> <strong>Ne cédez pas au détournement de balises !</strong> </h1> ,[object Object]
[object Object]
Mais les tableaux de mise en page mal utilisés peuvent obscurcir le contenu, pour les moteurs comme pour les visiteurs.
L’imbrication (des tables dans des tables dans des tables dans…) est potentiellement la plus destructrice.Linéarisation « Ceci une phrase est » Imbrication
«  Assurez-vous que les pages restent utilisables quand les scripts, applets etc sont désactivés (6.3)  »
[object Object]
Sans contenu alternatif, un site Flash est un site vide pour un moteur.
Un site utilisant javascript peut être plus ou moins accessible, selon que javascript vient en surcouche ou non (dégradation élégante).,[object Object]
«  N'utilisez pas des balises pour rediriger les pages automatiquement. Utilisez des redirections coté serveur (7.5) »
[object Object]
Seules les redirections coté serveur sont correctement suivies par les moteurs (la 301 étant la seule transmettant du PageRank).,[object Object]
[object Object]
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 »…
«  Fournissez des meta-données pour ajouter de l’information sémantique aux pages et aux sites .  (13.2) »

Contenu connexe

Tendances

Etapes du référencement d'un site internet
Etapes du référencement d'un site internetEtapes du référencement d'un site internet
Etapes du référencement d'un site internet
Lawrence DAINES
 

Tendances (20)

Référencement Naturel (SEO)
Référencement Naturel (SEO)Référencement Naturel (SEO)
Référencement Naturel (SEO)
 
Un site Web de qualité
Un site Web de qualitéUn site Web de qualité
Un site Web de qualité
 
Le référencement
Le référencementLe référencement
Le référencement
 
20 techniques de referencement naturel
20 techniques de referencement naturel20 techniques de referencement naturel
20 techniques de referencement naturel
 
Les bases du référencement
Les bases du référencementLes bases du référencement
Les bases du référencement
 
Presentation référencement
Presentation référencementPresentation référencement
Presentation référencement
 
Drupal SEO - Optimiser son site
Drupal SEO - Optimiser son siteDrupal SEO - Optimiser son site
Drupal SEO - Optimiser son site
 
Créer du trafic sur son site
Créer du trafic sur son siteCréer du trafic sur son site
Créer du trafic sur son site
 
Booster son référencement naturel sur Google ( SEO ) - exemple de Magimix
Booster son référencement naturel sur Google ( SEO ) - exemple de MagimixBooster son référencement naturel sur Google ( SEO ) - exemple de Magimix
Booster son référencement naturel sur Google ( SEO ) - exemple de Magimix
 
Référencement
RéférencementRéférencement
Référencement
 
Optimiser le référencement naturel d'un site ou blog Wordpress
Optimiser le référencement naturel d'un site ou blog WordpressOptimiser le référencement naturel d'un site ou blog Wordpress
Optimiser le référencement naturel d'un site ou blog Wordpress
 
Redaction web fiche pedagogique 2 structurer sa page
Redaction web fiche pedagogique 2 structurer sa pageRedaction web fiche pedagogique 2 structurer sa page
Redaction web fiche pedagogique 2 structurer sa page
 
Serviciz Toulouse - Le Référencement naturel avec Cibleweb
Serviciz Toulouse - Le Référencement naturel avec Cibleweb Serviciz Toulouse - Le Référencement naturel avec Cibleweb
Serviciz Toulouse - Le Référencement naturel avec Cibleweb
 
Etapes du référencement d'un site internet
Etapes du référencement d'un site internetEtapes du référencement d'un site internet
Etapes du référencement d'un site internet
 
Webinar seo sea-2020-vff
Webinar seo sea-2020-vffWebinar seo sea-2020-vff
Webinar seo sea-2020-vff
 
seo optimisation editoriale - version 2010
seo   optimisation editoriale - version 2010seo   optimisation editoriale - version 2010
seo optimisation editoriale - version 2010
 
Audit de site web
Audit de site webAudit de site web
Audit de site web
 
Introduction au referencement naturel
Introduction au referencement naturelIntroduction au referencement naturel
Introduction au referencement naturel
 
Référencement  Naturel - les bases pour améliorer votre positionnement et vot...
Référencement  Naturel - les bases pour améliorer votre positionnement et vot...Référencement  Naturel - les bases pour améliorer votre positionnement et vot...
Référencement  Naturel - les bases pour améliorer votre positionnement et vot...
 
Referencement naturel - optimisation editoriale
Referencement naturel - optimisation editorialeReferencement naturel - optimisation editoriale
Referencement naturel - optimisation editoriale
 

En vedette

ppt sur le Référencement
ppt sur le Référencementppt sur le Référencement
ppt sur le Référencement
3Market
 

En vedette (20)

Conférence sur le Marketing Internet
Conférence sur le Marketing InternetConférence sur le Marketing Internet
Conférence sur le Marketing Internet
 
Référencement web : une stratégie payante!
Référencement web : une stratégie payante!Référencement web : une stratégie payante!
Référencement web : une stratégie payante!
 
Les outils de curation
Les outils de curationLes outils de curation
Les outils de curation
 
Enjeux stratégiques marketing et publicité
Enjeux stratégiques marketing et publicitéEnjeux stratégiques marketing et publicité
Enjeux stratégiques marketing et publicité
 
Epub
EpubEpub
Epub
 
Référencement naturel (SEO), e-marketing et visibilité web - 15 pratiques pou...
Référencement naturel (SEO), e-marketing et visibilité web - 15 pratiques pou...Référencement naturel (SEO), e-marketing et visibilité web - 15 pratiques pou...
Référencement naturel (SEO), e-marketing et visibilité web - 15 pratiques pou...
 
Guide pratique du référencement - La méthode bee coz
Guide pratique du référencement - La méthode bee cozGuide pratique du référencement - La méthode bee coz
Guide pratique du référencement - La méthode bee coz
 
Réseaux sociaux, Marketing viral et Buzz marketing
Réseaux sociaux, Marketing viral et Buzz marketingRéseaux sociaux, Marketing viral et Buzz marketing
Réseaux sociaux, Marketing viral et Buzz marketing
 
Construire une stratégie de référencement
Construire une stratégie de référencementConstruire une stratégie de référencement
Construire une stratégie de référencement
 
Atelier le référencement 2016
Atelier le référencement 2016Atelier le référencement 2016
Atelier le référencement 2016
 
Buzz et Marketing Viral : objectifs, techniques, étapes...
Buzz et Marketing Viral : objectifs, techniques, étapes...Buzz et Marketing Viral : objectifs, techniques, étapes...
Buzz et Marketing Viral : objectifs, techniques, étapes...
 
E-mail marketing : réussir sa campagne d'e-mailing (pour PME et indépendant)
E-mail marketing : réussir sa campagne d'e-mailing (pour PME et indépendant)E-mail marketing : réussir sa campagne d'e-mailing (pour PME et indépendant)
E-mail marketing : réussir sa campagne d'e-mailing (pour PME et indépendant)
 
Le Référencement Multicanal sur internet en 2012
Le Référencement Multicanal sur internet en 2012Le Référencement Multicanal sur internet en 2012
Le Référencement Multicanal sur internet en 2012
 
Les Medias Sociaux et Le Referencement
Les Medias Sociaux et Le ReferencementLes Medias Sociaux et Le Referencement
Les Medias Sociaux et Le Referencement
 
ppt sur le Référencement
ppt sur le Référencementppt sur le Référencement
ppt sur le Référencement
 
Communication Digitale
Communication DigitaleCommunication Digitale
Communication Digitale
 
Les outils SEO à utiliser en 2013 - Seo Campus
Les outils SEO à utiliser en 2013 - Seo CampusLes outils SEO à utiliser en 2013 - Seo Campus
Les outils SEO à utiliser en 2013 - Seo Campus
 
Référencement naturel (SEO), Référencement payant (SEM) à BEM Bordeaux Manage...
Référencement naturel (SEO), Référencement payant (SEM) à BEM Bordeaux Manage...Référencement naturel (SEO), Référencement payant (SEM) à BEM Bordeaux Manage...
Référencement naturel (SEO), Référencement payant (SEM) à BEM Bordeaux Manage...
 
C4021 séance 3 : Le référencement
C4021 séance 3 : Le référencementC4021 séance 3 : Le référencement
C4021 séance 3 : Le référencement
 
Exposé Marketing viral
Exposé Marketing viralExposé Marketing viral
Exposé Marketing viral
 

Similaire à Accessibilité et référencement - Paris Web 2010

Concilier accessibilité et SEO
Concilier accessibilité et SEOConcilier accessibilité et SEO
Concilier accessibilité et SEO
Sébastien Delorme
 
[Chambé-Carnet] L'accessibilité au service du référencement naturel
[Chambé-Carnet] L'accessibilité au service du référencement naturel[Chambé-Carnet] L'accessibilité au service du référencement naturel
[Chambé-Carnet] L'accessibilité au service du référencement naturel
Chambé-Carnet
 
Le référencement. Christian Ducharme, chef de projet W3line/CD-Script
Le référencement. Christian Ducharme, chef de projet W3line/CD-ScriptLe référencement. Christian Ducharme, chef de projet W3line/CD-Script
Le référencement. Christian Ducharme, chef de projet W3line/CD-Script
bdvo
 

Similaire à Accessibilité et référencement - Paris Web 2010 (20)

référencement naturel (SEO) : comment améliorer sa visibilité sur les moteurs...
référencement naturel (SEO) : comment améliorer sa visibilité sur les moteurs...référencement naturel (SEO) : comment améliorer sa visibilité sur les moteurs...
référencement naturel (SEO) : comment améliorer sa visibilité sur les moteurs...
 
Guide du référencement naturel - Copyright Google
Guide du référencement naturel - Copyright GoogleGuide du référencement naturel - Copyright Google
Guide du référencement naturel - Copyright Google
 
Composant optimisation seo
Composant optimisation seoComposant optimisation seo
Composant optimisation seo
 
Accessibilité et SEO - Sébastien Delorme - SEO Campus 2010
Accessibilité et SEO - Sébastien Delorme - SEO Campus 2010Accessibilité et SEO - Sébastien Delorme - SEO Campus 2010
Accessibilité et SEO - Sébastien Delorme - SEO Campus 2010
 
Concilier accessibilité et SEO
Concilier accessibilité et SEOConcilier accessibilité et SEO
Concilier accessibilité et SEO
 
Le référencement pour les developpeurs
Le référencement pour les developpeursLe référencement pour les developpeurs
Le référencement pour les developpeurs
 
Formation seo
Formation seoFormation seo
Formation seo
 
Guide Google
Guide GoogleGuide Google
Guide Google
 
Search engine-optimization-by-Google
Search engine-optimization-by-GoogleSearch engine-optimization-by-Google
Search engine-optimization-by-Google
 
[Chambé-Carnet] L'accessibilité au service du référencement naturel
[Chambé-Carnet] L'accessibilité au service du référencement naturel[Chambé-Carnet] L'accessibilité au service du référencement naturel
[Chambé-Carnet] L'accessibilité au service du référencement naturel
 
Fondamentaux du Référencement naturel
Fondamentaux du Référencement naturelFondamentaux du Référencement naturel
Fondamentaux du Référencement naturel
 
Le référencement. Christian Ducharme, chef de projet W3line/CD-Script
Le référencement. Christian Ducharme, chef de projet W3line/CD-ScriptLe référencement. Christian Ducharme, chef de projet W3line/CD-Script
Le référencement. Christian Ducharme, chef de projet W3line/CD-Script
 
ATELIER ANT N°8 - RÉFÉRENCEMENT NATUREL - SEO
ATELIER ANT N°8 - RÉFÉRENCEMENT NATUREL - SEOATELIER ANT N°8 - RÉFÉRENCEMENT NATUREL - SEO
ATELIER ANT N°8 - RÉFÉRENCEMENT NATUREL - SEO
 
Audit seo-12-2015
Audit seo-12-2015Audit seo-12-2015
Audit seo-12-2015
 
Guide de démarrage Google - Optimisation pour les moteurs de recherche
Guide de démarrage Google - Optimisation pour les moteurs de rechercheGuide de démarrage Google - Optimisation pour les moteurs de recherche
Guide de démarrage Google - Optimisation pour les moteurs de recherche
 
Search engine-optimization-starter-guide-fr
Search engine-optimization-starter-guide-frSearch engine-optimization-starter-guide-fr
Search engine-optimization-starter-guide-fr
 
Google search engine-optimization-starter-guide-fr
Google search engine-optimization-starter-guide-frGoogle search engine-optimization-starter-guide-fr
Google search engine-optimization-starter-guide-fr
 
Livre blanc de sensibilisation au SEO
Livre blanc de sensibilisation au SEOLivre blanc de sensibilisation au SEO
Livre blanc de sensibilisation au SEO
 
Les 3 piliers du référencement sur wordpress
Les 3 piliers du référencement sur wordpress Les 3 piliers du référencement sur wordpress
Les 3 piliers du référencement sur wordpress
 
Les bonnes pratiques SEO avec les frameworks javascript - SEO CAMPUS 9 mars 2017
Les bonnes pratiques SEO avec les frameworks javascript - SEO CAMPUS 9 mars 2017Les bonnes pratiques SEO avec les frameworks javascript - SEO CAMPUS 9 mars 2017
Les bonnes pratiques SEO avec les frameworks javascript - SEO CAMPUS 9 mars 2017
 

Plus de relevant_traffic_france

Identifier ce qui peut géner ou bloquer votre référencement
Identifier ce qui peut géner ou bloquer votre référencementIdentifier ce qui peut géner ou bloquer votre référencement
Identifier ce qui peut géner ou bloquer votre référencement
relevant_traffic_france
 

Plus de relevant_traffic_france (6)

Gros sites : comment RATER son référencement (SMX Paris 2010)
Gros sites : comment RATER son référencement (SMX Paris 2010)Gros sites : comment RATER son référencement (SMX Paris 2010)
Gros sites : comment RATER son référencement (SMX Paris 2010)
 
Cours master IDEMM 9 : les liens Sponsorises
Cours master IDEMM 9 : les liens SponsorisesCours master IDEMM 9 : les liens Sponsorises
Cours master IDEMM 9 : les liens Sponsorises
 
La boite à outils du référenceur - SEO Campus 2010
La boite à outils du référenceur - SEO Campus 2010La boite à outils du référenceur - SEO Campus 2010
La boite à outils du référenceur - SEO Campus 2010
 
Identifier ce qui peut géner ou bloquer votre référencement
Identifier ce qui peut géner ou bloquer votre référencementIdentifier ce qui peut géner ou bloquer votre référencement
Identifier ce qui peut géner ou bloquer votre référencement
 
Définir une politique de Search Marketing : Comment optimiser la visibilité d...
Définir une politique de Search Marketing : Comment optimiser la visibilité d...Définir une politique de Search Marketing : Comment optimiser la visibilité d...
Définir une politique de Search Marketing : Comment optimiser la visibilité d...
 
Le référencement en 2008, état des lieux et perspectives
Le référencement en 2008, état des lieux et perspectivesLe référencement en 2008, état des lieux et perspectives
Le référencement en 2008, état des lieux et perspectives
 

Accessibilité et référencement - Paris Web 2010

  • 1. Référencement & utilisabilité : des objectifs différents, des méthodes qui convergent Sébastien Billard, consultant référencement
  • 2.
  • 3. HTML 5 ne sera pas abordé, car non finalisé.
  • 4.
  • 5. Accessibilité web : ensembles des techniques visant à assurer l’accès aux contenus web pour les personnes handicapées.
  • 6.
  • 7. La trouvabilité dans les moteurs participe à une bonne utilisabilité générale du web (efficacité, efficience, satisfaction).
  • 8.
  • 9.
  • 10. « Fournissez un équivalent textuel à chaque élément non textuel (1.1) »
  • 11.
  • 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.
  • 15.
  • 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.
  • 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.
  • 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 compte Les moteurs ne cliquent pas…
  • 22. «  Utilisez des balises plutôt que des images pour transmettre l’information (3.1) »
  • 23.
  • 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.
  • 29. La validité n’est pas liée à la pertinence.
  • 30. La validité n’est pas l’accessibilité.
  • 31.
  • 32.
  • 33. CSS permet toutefois d’alléger les pages et d’accélerer leur chargement, ce qui est favorable à une bonne indexation.
  • 34.
  • 35.
  • 36. Le contenu des balises <h1> à <h6> et des balises <b> et <strong> en particulier se voit reconnaître une importance particulière.
  • 37.
  • 38.
  • 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.
  • 43. Sans contenu alternatif, un site Flash est un site vide pour un moteur.
  • 44.
  • 45. «  N'utilisez pas des balises pour rediriger les pages automatiquement. Utilisez des redirections coté serveur (7.5) »
  • 46.
  • 47.
  • 48.
  • 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) »
  • 51.
  • 52. Les balises meta ne comptent plus pour le positionnement. Mais le contenu de la balise <meta> description peut être affiché dans les résultats des moteurs.
  • 53.
  • 54.
  • 55.
  • 56.
  • 57.
  • 58.
  • 59. Certains référenceurs pensent que le contenu placé haut dans le code aurait un poids plus fort que le contenu placé plus bas. Mais la question fait débat.
  • 60.
  • 61. Les mots-clés visés doivent apparaître dès les premières phrases : cela est bon pour les utilisateurs comme pour les moteursBalise <title> INFORMATION PRINCIPALE (reprise dans <title>) Titre Principal 5W+2H Chapô DÉVELOPPEMENT DE L'INFORMATION PRINCIPALE Paragraphes Sous-titres INFORMATIONS DE MOINDRE IMPORTANCE Paragraphes Pied de page
  • 62. «  Utilisez le langage le plus clair et le plus simple possible adapté au contenu de votre site (14.1)  »
  • 63.
  • 64. Un langage clair, explicite permet une meilleure visibilité dans les moteurs.Rachète ? Autorise ? Progiciels ? Logiciels ?
  • 65. Voir comme un robot (ou comme certains utilisateurs)
  • 66. Vérifier l’accessibilité technique : Lynx URL du lien actif Lien actif Ouvrir une URL : "g" Activer des liens : "↓" et "↑" Défiler : "espace" Cliquer : "entrée" Page prec/suiv : "←" et "->" Source : "quot; Aide : "?" Lien Zone de saisie Titre <hn> Texte ordinaire
  • 67. Vérifier l’accessibilité : Web Developer …les cookies… …CSS… On désactive javascript… … et on linéarise le contenu de la page. …on remplace les images par leurs attributs alt…
  • 68. Vérifier l’accessibilité : Web Developer Lien image avec attribut alt Titre <h1> Liste <ul> Titre <h2> Titre <h3> paragraphe <p>
  • 69. Balisage sémantique : Web Developer On active la fonction « Display Element Information » (Ctrl+Maj+F)… …au survol d’un élément la structure HTML apparaît… … et le clic sur un élément affiche en surimpression des informations complémentaires
  • 70. Structure des titres : Headingsmap Un clic sur un titre le met en surbrillance On active le plugin en cliquant sur l’icône <h/> dans la barre de statut… Et la structure des titres apparaît
  • 71.
  • 75.
  • 76. Membre du groupe Kinnevik (www.kinnevik.se), Quotidien Metro, Milicom, Transcom, Tele2…
  • 77. Une présence pan européenne : Stockholm, Paris et Madrid