Master IDEMM - Optimisation structurelle pour le référencement

OPTIMISATION STRUCTURELLE POURLE REFERENCEMENT

Auteur : Sébastien Billard ([email protected])

RAPPEL : LA PYRAMIDE DU REFERENCEMENT


CONTENU

STRUCTURE

POPULARITE

Le code qui contient le site et le met en forme

Essentiellement le contenu textuel du site

Ce que le web dit de votre site via les liens

Crédibilise Favorise

Valorise Redistribue

L'ensemble de ces composantes doit être optimisé pour obtenir une bonne visibilité :

On va travailler aujourd'hui surcet étage (ou plutôt les fondations...)

ROLES DE L'OPTIMISATION STRUCTURELLE


L'optimisation de la structure d'un site pour le référencement vise à satisfaire deux objectifs :

- A minima, assurer l'indexabilité du site par les robots d'indexation (accessibilité)

- Mettre en valeur le contenu pour un traitement optimal par les moteurs

CE QUI PEUT BLOQUER LES ROBOTS


- Contenus au format Flash

- Contenus dans des formats tiers nécessitant l'installation d'un plugin

- Scripts javascript

- Scripts Ajax (javascript et XML)

- Contenus accessible uniquement au travers d'un formulaire

- Fichiers robots.txt

CE QUI PEUT COMPLIQUER LE TRAVAIL DES MOTEURS


- Contenus sous forme d'images

- Mauvais usage des balises sémantique (ou absence d'usage)

- Contenus dupliqués

- Méthodes de redirections non adaptées

- Contenu délivrés en fonction de l'user-agent ou de l'adresse IP

- Splash pages

- Frames (cadres)

VOIR LE WEB COMME UN ROBOT


VOIR LE WEB COMME UN ROBOT : GRANDS PRINCIPES


Une bonne façon d'appréhender la structure d'un site ou d'une page, outre l'examen du code, est de se mettre dans la peau d'un robot, c'est-à-dire naviguer avec les même limitations :

- Pas d'images

- Pas de mise en forme (CSS)

- Pas de javascript

- Pas de Flash

- Pas de format tiers (Silverlight, Quicktime etc.)

- Lecture dans l'ordre du code (linéarisation)

- Pas de cookies

VOIR COMME UN ROBOT : LYNX


Lien actif

URL du lien actif

LienTitre

Emphase

Ouvrir une URL : "g"

Activer des liens : "↓" et "↑"

Défiler : "espace"

Cliquer : "entrée"

Page prec/suiv : "←" et "→"

Source : "\"

Aide : "?"

Télécharger : http://csant.info/lynx.htm

VOIR COMME UN ROBOT : WEB DEVELOPER


Télécharger : http://chrispederick.com/work/web-developer/

On désactivejavascript...

...les cookies...

...CSS...

on remplace les imagesPar leurs attributs alt...

...et on linéarisela page

VOIR COMME UN ROBOT : WEB DEVELOPER


Rendu navigateur

Rendu « moteur »

CE QUI PEUT BLOQUER LES ROBOTS


CONTENUS FLASH


- Flash n'est à l'origine pas un outil de publication, mais d'animation.

- Flash nécessite un plugin pour être lu (Flash Player). Ce n'est pas un standard du web, même si son usage est aujourd'hui très répandu.

- Flash n'est pas correctement lu par les moteurs, même s'ils arrivent désormais à extraire quelques informations.

- Il faut donc encore aujourd'hui considérer Flash comme étant totalement inaccessible (et l'indexation éventuelle comme un bonus).

L'indexation de Flash pose de nouveaux problèmes...

SITE 100% FLASH : EXEMPLE


Ce que voit l'utilisateur(s'il a Flash)

Ce que voit le moteur(c'est à dire pas grand chose)

Tout le site est inclus dans un fichier Flash (swf), non lisible par les moteurs

http://www.villat.ch/home.html

OPTIMISATION DES CONTENUS FLASH : APPROCHES POSSIBLES


- Ne pas construire de sites 100% Flash. Par contre l'inclusion d'éléments Flash dans des sites majoritairement en HTML, avec du contenu autour, est parfaitement possible.

- Construire deux versions, une Flash, une HTML. Problème : la version Flash devient inutile puisque c'est la version HTML qui sera la mieux référencée, et donc la plus visitée au final.

- Fournir un contenu alternatif : pis-aller pour un site Flash ordinaire (URL unique), intéressant pour les sites Flash à plusieurs URLs. La méthode la plus connue est swfObject (http://code.google.com/p/swfobject/).

<script type="text/javascript" src="swfobject.js"></script><div id="flashcontent">Texte alternatif, visible pour les utilisateurs sans Flash ou sans javascript, ainsi que pour les moteurs</div><script type="text/javascript"> var so = new SWFObject("flash.swf", "flash", 200, 100, 7, "#336699");so.write("flashcontent");</script>

Exemple d'utilisation de SWFObject

JAVASCRIPT


- Javascript est un langage de programmation interprété coté client (c'est le navigateur qui execute le code, pas le serveur).

- Javascript n'est pas interprété par les moteurs, même si des chaines de caractères comme des URLs peuvent éventuellement être extraites du code javascript.

- Il est souvent possible d'utiliser Javascript tout en restant accessible (concept de dégradation élégante ou d'amélioration progressive).

- Les applications de Javascript les plus problématiques pour le référencement sont typiquement les menus déroulants, les pop-ups et les contenus AJAX.

EXEMPLES DE JAVASCRIPTS ACCESSIBLES ET NON-ACCESSIBLES

Auteur : Sébastien Billard ([email protected])http://s.billard.free.fr/dotclear/

Un clic sur ce lien ouvre un pop-up, grâce à javascript...

Ce popup reste accessible aux moteurs et visiteurs, car le code javascript vient en surcouche de HTML

<a href = "javascript:ouvreFenetre(‘http://s.billard.free.fr/radio.blog/index.php', 300, 222)">FS Radio (popup)</a>

Ce code aurait été inaccessible

REFERENCEMENT ET JAVASCRIPT : APPROCHES POSSIBLES


- Ne pas rendre la navigation d'un site dépendant de javascript : cela garantie un minimum d'accessibilité pour les moteurs, comme pour les visiteurs.

- Pour être accessible, javascript doit venir en surcouche de HTML, pas en remplacement de celui-ci.

- Si un menu javascript inaccessible ne peut être modifié, intégrer des liens alternatifs HTML qui seront suivis par les robots. Cela peut être fait dans dans le contenu lui-même, dans la balise <noscript>, dans le footer, dans un plan de site...

FORMULAIRES


- Les moteurs ne savent par remplir un formulaire, ni sélectionner un élément, ni cliquer sur un bouton radio.

- Seuls les résultats de type GET (paramètres passé dans l'URL) sont indexables.

- La méthode POST ne permet pas l'indexation, car le résultat du formulaire ne peut être rappelé via une URL.

FORMULAIRES : EXEMPLE


...la seule façon d'accéder à l'intégralité du contenu était de renseigner un formulaire

Hormis quelques liens vers lesrecettes les plus populaires...

Une navigation alternative a été proposée

FORMULAIRES : OPTIMISATIONS POSSIBLES


- Ne pas utiliser de formulaires comme moyen unique de navigation si le site doit être indexé.

- Utiliser la méthode GET (paramètres passé dans l'URL), et non pas POST.

- Permettre une navigation arborescente alternative, utilisant des liens HTML.

Page de recherche avancée

Page index par ingrédient

Page index par type de

plat

Page index par champ

Liste recettes Soupe

Liste recettes Risotto

Liste recettes

Aubergine

Liste recettes Pommes de terre

Liste recettes Poulet

Liste recettes Gratin

Liste recettes Champ 1



Exemple d'arborescence proposée pour un site de cuisine

ROBOTS.TXT


- Ce protocole sert à restreindre volontairement l'indexation d'un site par les robots. Il y a de très bonnes raisons de ne pas souhaiter l'indexation de certaines pages (prévention du duplicate content, contenu inutiles...)

- On oublie parfois d'enlever le fichier robots.txt lors d'une mise en ligne, ou bien on se trompe dans la syntaxe d'où des cas de non-indexation involontaires.

- Le fichier est un simple fichier texte. Il se place obligatoirement à la racine du site. Ex: http://www.site.fr.robots.txt ou http://sous-domaine.site.fr/robots.txt.

- Le fichiers robots.txt n'est pas une protection contre les intrusions. Il n'empêche pas l'accès aux pages. Les robots peuvent décider ou non de respecter le protocole (les moteurs courants respectent tous les directives robots.txt).

- Attention à ne pas oublier le « s » à « robots » !

ROBOTS.TXT : SYNTAXE


User-agent: *Disallow: /repertoire_un/Disallow: /repertoire_deux/fichier.htmlDisallow: *.xml

Le user-agent spécifie à quel(s) robot(s) s'adressent les directives. Le wildcard (*) signifie tous les robots. On aurait pu spécifier « Googlebot ». On peut donner des instructions différentes selon les robots.

Le disallow spécifie les répertoires ou fichiers interdits d'indexation

Le wildcard est accepté par les moteurs majeurs pour les noms de fichiers, même si cela ne fait pas partie du protocole originel

En savoir plus : http://www.robotstxt.org/

CE QUI PEUT COMPLIQUER LE TRAVAIL DES MOTEURS


IMAGES


- Les moteurs ne savent pas lire les images. Toute information contenue dans une image non optimisée peut être considérée comme inexistante pour les moteurs.

- Toute image porteuse d'information devrait être dotée d'un attribut alt pertinent, idéalement de moins de 80 caractères.

- Les images décoratives devraient comporter un attribut alt vide.

- Une image peut être balisée sémantiquement, par exemple intégrée dans une balise <hn> s'il s'agit d'un titre en image.

- Un texte HTML est en général jugé plus efficace pour le référencement qu'un texte en image doté d'un attribut alt.

<img src="logo-idemm.gif" alt="IDEMM – Ingénierie Documentaire, Edition et Mediation Multimedia " />

Exemple d'image dotée d'un attribut alt pertinent

BALISAGE SEMANTIQUE


- Les balises sémantiques servent à définir la fonction, le « sens », de chaque élément dans le contenu.

- Certaines balises sémantiques se voient reconnaître un poids plus fort par les moteurs de recherche : balises de titre (<hn>), emphases (<strong>)...

- Il faut utiliser les balises pour leur fonction, et non pas pour leur impact supposé sur le référencement, ou leur rendu graphique (pas de détournement de balise).

- Le détournement de balise est souvent contre-productif. Les poids sont relatifs : si tout est balisé comme un titre, il n'y a alors plus de titre.

- Un certain nombre de balises sémantiques n'ont a l'heure actuelle pas une grande utilité pour le référencement. Ce qui ne veut pas dire qu'il ne faut pas les utiliser, ni qu'elles ne seront jamais prises en compte

Spécifications HTML 4 en français : http://www.la-grange.net/w3c/html4.01/cover.html

DES BALISES MOINS UTILES (POUR LE REFERENCEMENT )


Source : http://www.minet.net/spip/IMG/pdf/FichePratiqueHtmlSemantique-2-2-2.pdf

BALISAGE SEMANTIQUE : EXEMPLE DE RECOMMANDATIONS


COMMENT BALISER LES ELEMENTS D'UNE PAGE WEB ?


- Un logo-titre : rien, ou <h1> (différentes opinions sur le sujet, rien semble préférable)

- Un titre ou un sous-titre : <h1>, <h2>, <h3>...

- Un bloc de texte : <p> (peut être considéré comme la balise par défaut)

- Un passage important, ou un chapô : <strong> (cette balise peut être incluse dans une autre, par ex <p>)

- Une énumération non ordonnée (bullet points, tirets) : <ul>

- Une énumération ordonnée : <ol>

- Les liens d'un menu : <ul> (car un menu est une liste de liens)

DUPLICATION DE CONTENU


- Les moteurs de recherche sont des bases de données, et font donc la chasse aux doublons.

- Quand un même contenu est disponible sur plusieurs URLs, les moteurs vont en général favoriser une URL. La loi de Murphy étant universelle, ce sera rarement la bonne ;)

- La duplication de contenu peut diluer la popularité, celle-ci se répartissant entre les différentes URLs.

- La duplication peut être complète, ou partielle (near duplicate).

SOURCES COURANTES DE DUPLICATION


- Noms de domaines multiples (contenu visible sur un .fr et un .com, ou sur plusieurs domaines).

- Non canonisation des domaines (site accessible avec et sans « www »)

- Identifiants de sessions passé dans les URLs.

- Mauvaise gestion de la réécriture d'URLs (absence de redirection 301)

- Inversion de l'ordre des paramètres dans les URLs.

- Pages d'impression.

Mauvaise canonisation

Pages d'impression

Identifiants de session

EVITER LA DUPLICATION DE CONTENU


- Utiliser un seul nom de domaine, et rediriger les autres vers celui-ci, via des redirections 301.

- Canonisation : faire en sorte qu'une seule version soit accessible, en redirigeant l'autre vers la première, via une redirection 301.

- Eviter les identifiants de session passé dans les URLs. Préférer l'identification par cookies.

- URL rewriting : toujours rediriger la version non-réécrite vers la version réécrite, via une redirection 301.

- Inversion de l'ordre des paramètres dans les URLs : faire attention :)

- Pages d'impression : interdire leur indexation par robots.txt, ou meta tags.

- Eventuellement : utiliser la balise <link> rel=canonical. Attention cette balise est une indication, pas une directive.

EVITER LA DUPLICATION DE CONTENU : 301 ET REL=CANONICAL


URL actuelleAncienne URL

301

Ok ! j'indexe l'URL actuelle et lui transfère

le « linkjuice » des anciennes URLs

URL canoniqueContenu dupliqué

rel=canonical

Ok ! j'indexe l'URL canonique et lui

transfère le « linkjuice » des versions dupliquées

<link rel="canonical" href="http://www.site.fr/version-canonique.html" />

La balise link rel=canonical s'insère dans le <head> des documents. Ne pas interdire l'indexation sinon la balise ne pourra être prise en compte. Syntaxe :

REDIRECTIONS


- Seules les redirections coté serveur (redirections HTTP) sont suivies par les moteurs. Elles peuvent être gérée au niveau du serveur (.htaccess, mod_rewrite) ou du code des pages (header en PHP).

- Les redirections à base de javascript ou de balises meta refresh sont à éviter.

- Parmi les redirections coté serveur, seules les redirections 301 (permanentes) transmettent correctement la popularité et permettent une bonne indexation des pages. Eviter les redirections 302 (temporaires).

- Les redirections successives sont à éviter autant que possible, même les 301.

<meta http-equiv="refresh" content="0;url=http://www.site.fr/" />

<script type="text/javascript"></script>

Exemple de redirection javascript, à placer dans le <head>

Exemple de redirection utilisant la balise meta refresh

COMPORTEMENT DES MOTEURS FACE AUX REDIRECTIONS 301 ET 302


URL actuelleURL de base

302

Ok ! J'indexe le contenu de l'URL actuelle mais

garde l'ancienne adresse. Mon linkgraph

reste le même

URL actuelleAncienne URL

301

Ok ! j'indexe l'URL actuelle et lui transfère

le « linkjuice » des anciennes URLs

TESTER UNE REDIRECTION AVEC WEBBUG


Télécharger : http://www.cyberspyder.com/webbug.html

Spécifier l'URL à tester Sélectionner HTTP 1.1

Cliquer sur « Get »

Le logiciel affiche la réponse HTTP, ici une redirection 301

Le logiciel affiche l'IP du serveur

TESTER LES REPONSES HTTP D'UN SITE AVEC XML SITEMAP


URL : http://www.auditmypc.com/xml-sitemap.asp

URL de départ

URLs à inclure URLs à exclure

On respecte ou non le protocole robots.txt

On exclue les images

On lance le crawl

TESTER LES REPONSES HTTP D'UN SITE AVEC XML SITEMAP


URLs crawléesURLs crawléesBalises <title>

Liens entrants et sortants

Réponses HTTP

Les résultats du crawl sont visibles dans l'onglet « Sitemap »

NEGOCIATION DE CONTENU ET « CLOAKING » NON MALICIEUX


Il est possible de personnaliser le contenu d'une page en fonction de la localisation de l'utilisateur, ou de sa langue. Cela peut poser des problèmes en matière de référencement, pour trois raisons :

- L'adresse IP d'un robot d'indexation n'est pas forcément localisée dans la même région que vos visiteurs cibles.

- Les robots d'indexation en général ne déclarent pas de langage.

- Plusieurs versions d'un contenu vont se partager une URL unique, une seule version sera donc indexée.

Mieux vaut donc éviter en général la négociation de contenu, et proposer à l'utilisateur de sélectionner la langue et/ou le pays de son choix.

Géolocalisation sur IP

Localisation en fonction de la

langue

STRUCTURATION DES SITES INTERNATIONAUX (LOCALISATION)


- Les extensions locales sont souvent favorisées par les versions locales des moteurs. Des domaines séparés avec TLD locaux (.fr, .be, .co.uk...) sont donc la solution à préférer.

- Si certains TLD locaux ne sont pas disponibles, envisager un domaine avec extension internationale (.com...). Le nom de domaine peut comporter un indicateur de localisation, par ex : nom-societe-usa.com.

- Si tous les sites doivent être hébergés sur un domaine unique, bien séparer les versions locales, par des sous-domaines (ex : usa.societe.com) ou par des repertoires (ex : www.societe.com/usa/).

- Les sous-domaines apparaissent préférables, car il est plus facile d'effectuer des actions de référencement spécifiques.

STRUCTURATION DES SITES INTERNATIONAUX (LANGUE)


- La langue des documents est déterminée automatiquement par les moteurs de recherche, en fonction des termes présents dans le contenu.

- L'attribut « lang » n'est pas pris en compte par les principaux moteurs.

Master IDEMM - Optimisation structurelle pour le référencement

Technology