Conseils pour un site web

Préalables

Motivations et présentation générale du site

• quel est le thème du site ?
• quels services seront fournis ?
• quels sont les objectifs du client ? (vendre son produit ? se faire connaître ?)
• quels sont les avantages (commerciaux, humains, financiers, marketing, communication) ? les risques ? les économies ?

Public visé

• quel type de public ?
• qu'attend l'internaute ? quels sont ses besoins ?
• quels mots-clefs tapés dans un moteur de recherche doivent amener sur le site ?
• dans quels annuaires doit-on être présent ? sous quelle rubrique ?
• à quels sites proposer un échange de liens ?
• quelles sont les personnes ou organismes à prévenir lors de la sortie du site ? dans quelles régions géographiques ?

Concurrence

• quels sont les sites concurrents ou proposant des services comparables ? quelles sont les différences ?
• quels mots-clefs ont utilisés ces sites ?

Pages

• quelles seront les pages types ?
• quelle sera leur apparence graphique ?
• quels seront les liens entre les pages ?
• quels seront la forme et le contenu des formulaires ?

Base de données

• nature de l'information à stocker ? utilité d'une base de données ?
• modalités d'interation avec l'utilisateur ? interrogation ? mise à jour ?
• schéma de la base ?
• lien avec les formulaires ?
• quel public a le droit d'utiliser quel formulaire ?

Mise en œuvre

Assurer l'accès au site pour tous

W3C et normes

Le respect des normes du W3C est le meilleur moyen d'assurer la bonne visualisation des pages du site par l'ensemble des navigateurs.

La première ligne du document doit donc spécifier la norme qu'il suit et plus précisément, la document type declaration (DTD) qu'il respecte . Par exemple,

Optimisé pour Internet Explorer (par exemple...)

Quiconque appose sur une page du web un logo du type : 'Cette page est optimisée pour le navigateur X' est quelqu'un qui semble souhaiter revenir à l'époque préhistorique d'avant le web, lorsque l'on avait très peu de chances de pouvoir lire un document écrit sur un autre ordinateur, un autre traitement de texte, ou un autre réseau. Tim Berners-Lee, Technology Review, Juillet 1996.

Par une politique d'optimisation de site, vous signifiez simplement que vous ne voulez pas suivre les recommandations du W3C et excluez certains visiteurs.

En bref, c'est pas bien et totalement crétin.

Sur ce sujet, vous pouvez lire :

• Pas de bellaminettes pour les sites optimisés pour IE par Bruno Bellamy

Feuilles de style

La plupart des navigateurs n'intègrent pas encore l'ensemble des spécifications du W3C sur les feuilles de style. Il faut donc tester l'apparence de vos pages en utilisant tous les navigateurs auquel vous pouvez accéder... et vous restreindre aux feuilles de styles visibles sur tous.

JavaScript

Microsoft et ses concurrents persistent à baser leurs navigateurs sur des langages JavaScript différents et il est donc difficile d'écrire un code JavaScript qui s'exécutera correctement chez tous les clients. Pour garder un site lisible par tous, trois possibilités s'offrent à nous :

• se restreindre au noyau JavaScript commun à tous les navigateurs ;
• écrire les programmes en double et exécuter l'un des deux selon le navigateur du visiteur ;
• ne pas utiliser JavaScript (ce qui me semble assez raisonnable car l'intérêt de ce langage m'apparaît de moins en moins clairement).

Java et Flash

Le Flash peut demander un temps de chargement assez long ; le Java lui exige le lancement d'une machine virtuelle avant de se lancer ce qui à nouveau exige du temps.

Un perte de temps donc pour un apport peu évident, en particulier pour les utilisateurs dont le comportement le plus couramment observé est de quitter la page sans attendre.

Poids des pages

Attention à la taille de vos fichiers : si le fichier HTML ainsi que les images qu'il inclut sont de taille trop importante, le temps de chargement s'en ressentira et vous prenez le risque de perdre des utilisateurs impatients (ce qui est le cas du plus grand nombre, en pratique, personne n'attend plus de 30 secondes).

Il est donc préférable de penser vos pages de manière à ce que chacune d'elle soit récupérable en moins de 10 secondes par votre utilisateur ayant la connexion la plus faible.

Ce type de raisonnement amène souvent à limiter le poids des pages à 50 ko.

Et encore...

• Ne pas utiliser les frames sur le web : elles empêchent les utilisateurs de poser des signets sur les pages de votre site et les moteurs de recherche proposeraient vos pages sans les cadres de navigation.
• Éviter de changer la couleur des liens, les gens se sont habitués au bleu et il est déstabilisant de parcourir un site où les liens sont d'une autre couleur, a fortiori si ils ne sont pas soulignés.
• Ne pas souligner autre chose que des liens.
• Préciser dans l'en-tête de chaque page le codage utilisé :

  <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1">
  

• Finalement, valider toutes les pages HTML du site et les feuilles de style par exemple en utilisant des vérificateurs automatiques.

Cohérence graphique

L'écriture et le respect d'une charte graphique est impérative. D'abord pour l'identité du site : l'utilisateur ne doit pas avoir l'impression de quitter le site lorsqu'il change simplement de rubriques.

Ensuite, pour faciliter l'apprentissage du site : l'utilisateur doit retrouver la même organisation et le même aspect sur toutes les pages.

Navigation

• Garantir un accès rapide à n'importe quelle page du site, éviter les arborescences trop profondes, ne pas hésiter à multiplier les liens transversaux.
• Proposer un plan du site, c'est-à-dire une page reprenant toutes les pages du site et laissant deviner son organisation.
• Idéalement, proposer un moteur de recherche interne à votre site.
• Éviter les menus trop denses, pas plus de 6 ou 7 liens par menu.

Maintenance

Pistes

• Déléguer le respect de la charte graphique à une feuille de style et à des procédures d'affichage dans un langage comme PHP, par exemple.
• Organiser le contenu dans une source unique : une base de données ou un fichier XML.
• Se donner les outils nécessaires pour l'administration : envoi de mails automatiquement, formulaires HTML et scripts PHP associés pour intervenir sur la base de données.

À faire régulièrement

• toujours mettre à jour et augmenter le contenu ;
• rechercher d'éventuels liens morts ;
• vérifier le bon état de marche des scritps du site.

Référencement

Principes des moteurs et de leurs robots

L'indexation du web est réalisée par des programmes automatiques que l'on appelle souvent des robots. Un tel robot accède à une page et l'indexe c'est-à-dire qu'il en extrait des informations et les stocke dans une base de données qui sera ensuite utilisée par le moteur de recherche lorsque vous lui soumettrez une requête. En même temps, il extrait les liens contenus dans ce document. Plus tard, ces liens lui serviront à récupérer de nouvelles pages.

Les détails de la phase d'indexation et en particulier les éléments qui interviennent dans l'évaluation d'une page ne sont en général pas divulgués par les moteurs de recherche. Citons simplement les éléments qui sont accessibles à ces robots et qui peuvent donc intervenir dans son travail :

• les informations présentes dans l'en-tête du document ;
• le contenu du document lui-même ;
• les liens morts présents dans la page ;
• le fait que le document a subi une modification depuis sa dernière visite ;
• les liens existants vers ce document depuis d'autres pages du web.

Nous détaillons maintenant certains de ces points avec l'idée d'aider les robots dans leur tâche d'indexation.

Les balises sémantiques

La première recommandation est d'utiliser les balises HTML à bon escient. Par exemple, le titre de la page devrait être encadré par la balise H1, les sous-titres par des H2, etc. Cela indique clairement aux robots que les mots apparaissant dans ces balises sont particulièrement significatifs. Cette information est perdue si vous utilisez par exemple une balise FONT incluse dans un tableau pour mettre en page vos titres.

Il s'agit donc d'utiliser en priorité les balises qui précisent la nature du texte encadré et d'abandonner celles qui n'indiquent que la mise en forme du contenu. À titre indicatif, voici une partition raisonnable des balises HTML :

• balises sémantiques :
  • h1 h2 h3 h4 h5 h6 ;
  • table tr th td (si les tableaux ne sont pas utilisés pour faire de la mise en page !) ;
  • ol ul li ;
  • em strong kbd ;
  • form input textarea select option ;
  • map area ;
  • p a img ;
  • div span (avec une classe associée).
• balises de mise en forme :
  • font ;
  • b i tt u s ;
  • big small ;
  • br center.

Précisons enfin que cette classification dépend surtout de l'utilisation que l'on fait des balises. Ainsi, les balises table tr th td sont considérées comme sémantiques lorsqu'elles décrivent un tableau de valeurs, mais pas si elles ne sont utilisées que pour permettre une mise en page particulière.

Si vous suivez ces recommandations, vous en arriverez assez naturellement à écrire vos documents en XHTML et à utiliser des feuilles de style pour décrire leur apparence.

Les balises TITLE et META

La balise TITLE apparaissant dans l'en-tête permet de donner un titre au document. Il s'agit de décrire le sujet abordé de la manière la plus concise possible (gardez à l'esprit que ce titre sera également utilisé pour renseigner les signets de vos visiteurs).

La balise META a une utilisation plus générale : elle possède deux attributs, NAME et CONTENT, le premier étant un mot désignant ce dont on va parler et le second le descriptif lui-même. Sa syntaxe est :

Le tableau suivant reprend les informations les plus souvent utilisées :

Et un exemple pratique d'utilisation de cette balise :

<meta name="description" content="Comment référencer son site auprès des
                                  moteurs de recherche et des annuaires.">

<meta name="keywords" content="référencement, moteurs, site, web, 
                               balises meta, supports de cours">

<meta name="author" content="Fabien Torre">

Les robots peuvent être plus ou moins susceptibles : s'ils estiment que les indications données sont manifestement fausses et visent à les tromper, ils peuvent purement et simplement refuser l'indexation de votre page. Voici quelques pratiques qui peuvent les agacer :

• des descriptifs très longs ;
• les mêmes mots clefs répétés de nombreuses fois ;
• des mots indiqués comme clefs mais qui n'apparaissent pas dans le contenu ;
• des mots qui apparaissent dans le contenu mais dans une couleur identique à celle du fond (pour être invisibles à l'utilisateur humain) ;
• une demande de visites trop fréquentes.

Multilinguisme

Balise LANG

Balise META HTTP-EQUIV

Balise LINK REL

<LINK TITLE="version anglaise" REL="alternate" TYPE="text/html"
      HREFLANG="en" HREF="index.en.html">

Prévenir le web de la naissance du site

Obtenir des liens

importance du texte dans la balise A, échange de liens, anneaux.

Déclaration aux annuaires

Déclaration aux moteurs de recherche

Évaluation

Pistes

• le site est-il bien référencé par les moteurs de recherche ? est-il proposé pour les mots-clefs choisis ? est-il présent dans les annuaires et sites désignés comme important ?
• quel est le volume de traffic sur le site ? que viennent y chercher les visiteurs ? le trouvent-ils ? comment utilisent-ils la navagiation ?
• quelles sont les pages les plus regardées ? quels sont sites qui envoient le plus de visiteurs ? quels chemins suivent les utilisateurs à travers le site ? si un moteur interne est présent, quelles sont les recherches effectuées ?
• le site remplit-il les objectifs initiaux ? le contenu est-il bien approprié à la cible choisie ?
• pas de liens morts, scripts en état de marche.

Statistiques possibles

Lors d'une transaction HTTP un bon nombre d'informations sont fournies au serveur par le client. Ces informations peuvent être retrouvées dans le fichier de logs du serveur ou être stockées par exemple dans une base de données à chaque requête sur une page dynamique.

Ces éléments autorisent le calcul de différents indicateurs qui pourront être rassemblés sur une page générée automatiquement : soit une page de statistiques d'accès au site visible de tous, soit une page servant de tableau de bord aux administrateurs du site.

Machines accèdant au site

Compter les machines différentes qui font des requêtes sur le site peut-être un bon indicateur du nombre de personnes qui fréquentent le site.

Il faut tout de meme prendre garde à repérer et écarter des ces calculs, les robots qui viennent indexer les pages du site. Cependant, dénombrer ces robots a un intérêt en soit : déterminer si les moteurs de recherche jugés interessants ont bien connaissance de l'existence de notre site et y envoient leurs robots.

Pour un exemple, voir les machines qui visitent ce site.

Origines des visiteurs

Quelles sont les pages externes sur lesquelles les utilisateurs empruntent un lien vers notre site ? Repérer ceux qui nous en amènent beaucoup, ainsi que leurs thématiques.

Parmi ces pages menant sur notre site, on devrait trouver des moteurs de recherche, ce qui nous amène aux indicateurs suivants.

Pour un exemple, voir l'origine des visiteurs de ce site.

Recherches amenant au site

À nouveau, on détermine les moteurs de recherche qui nous référencent

Dans l'adresse d'origine, toujours lorsqu'il s'agit d'un moteur de recherche, on va retrouver l'expression recherchée par l'utilisateur. Il est intéressant de regarder les mots les plus souvent cherchés et qui conduisent sur notre site. Il est enrichissant également de confronter ces mots à la liste de mots-clefs établie lors du cahier des charges du site.

Pour un exemple, voir les mots-clefs qui amènent à ce site.

Pages consultées

Établir un classement des pages du site, éventuellement suivant la langue. Observer les pages les moins consultées, comprendre leur manque de succès et y remédier.

Cette analyse peut également être menée sur des rubriques entière du site plutôt que les pages isolément.

Pour un exemple, voir les statistiques par page de ce site.

Utilisateurs

S'il y a une identification, faire des statistiques sur les utilisateurs, leurs habitudes de navigation, etc.

Interaction avec les utilisateurs

Faciliter le retour de la part des utilisateurs :

• indiquer sur les pages une adresse mail pour recevoir les commentaires des visiteurs ;
• mettre en place un livre d'or ou encore un forum.

Dans tous les cas, ne mettre ces outils en place que si l'on est en mesure d'y être réactif.