Conseils pour webmaster

Tester ses pages

Testez vos pages, en ligne, sur différents navigateurs. Si votre code source est propre et respecte les standards du W3C il ne devrait pas y avoir trop de problème. En cas de doute de la validité du HTML, des outils en ligne, comme le validateur, sont à votre disposition.

En matière de dimensions, la longueur verticale ne doit pas dépasser la hauteur de deux écrans. La longueur horizontale est un peu plus complexe puisqu'elle dépend d'un ordinateur à un autre. Faites en sorte que votre site s'affiche correctement pour les résolutions égales ou supérieures à 800*600. Dans le cas où vous travaillez avec des tableaux, 760 pixels de large est un maximum pour un affichage écran et 700 pixels pour une version imprimable.

SizeOMatic est un logiciel gratuit qui simule les résolutions.

La page d'accueil

Accès rapide

Même si les connexions haut débit (ADSL, câble...) se généralisent, il reste encore une majorité d'acces par modem analogique. Une page d'accueil plus lourde que 50 Ko (images comprises) risque d'entraîner des délais d'attente de chargement trop long pour le visiteur. N'oubliez pas qu'il s'agit de la page la plus importante puisque le visiteur décidera si votre site en vaut la peine ou non.

Dans son interview par le Journal du Net, Jakob Nielsen, indique un temps de chargement idéal inférieur à une seconde. Cette estimation est purement théorique puisque le délais d'attente dépend d'une série de facteurs: la connexion de l'utilisateur, l'encombrement du réseau, la qualité du serveur, etc. Au-delà de 10 secondes, il y a de fortes chances que votre visiteur potentiel partira frustré et ne reviendra pas.

Forme et contenu

Forme - La page d'accueil représente votre entreprise, elle vous représente. Tout en étant léger, le graphisme doit séduire en quelques dixièmes de secondes pour donner envie d'entrer. Cette impression peut être justifiée ou non mais de toute façon il faudra "flasher" par la mise en page, les images, la finesse. Si cette impression est mauvaise, vous avez peu de chance de récupérer votre visiteur, même si le contenu est intéressant.

Contenu - Après cette première impression, l'utilisateur va chercher à savoir où il est, qu'est ce que le site peut lui apporter de plus que celui de vos concurrents et quel est le chemin pour y arriver. Présentez donc des liens vers du contenu et abstenez-vous d'afficher des pages peu informatives (bienvenue, historique, ...).

Logo et signature en haut à gauche

Le logo doit apparaître de préférence dans le coin supérieur gauche. Cela peut paraître très conventionnel mais ce n'est pas sans raison. Premièrement, si la page met un certain temps à charger, le visiteur apercevra en premier le logo suivi de sa signature. Deuxièmement, la trajectoire de l'œil sur un écran se fait en diagonale. Elle part du côté supérieur gauche pour descendre à droite, repartir à gauche, etc. Dernièrement, les internautes ont pris l'habitude de cette disposition. Si vous décidez de mettre les informations de votre site tout en bas au milieu, cela risque de dérouter certains internautes. La signature (baseline en anglais) résume en quelques mots l'activité de l'entreprise ou sa philosophie. Si elle est bien faite, votre visiteur aura vite fait de comprendre la nature de votre site.

Des fichiers nommés correctement

Prenez le réflexe de nommer explicitement vos pages, images et autres. Non seulement vos fichiers seront plus évocateurs mais ils seront d'une aide précieuse pour le référencement. Évitez les majuscules (les serveurs Unix font la différence entre les majuscules et les minuscules), les espaces et les caractères spéciaux (point d'exclamation, dièse, virgule...) à l'exception de l'underscore ( _ ) qui peut vous servir à séparer les mots.

À éviter absolument

"Bienvenue"

De nombreux sites web souhaitent la bienvenue à ses visiteurs. Cette marque de sympathie n'apporte rien d'utile et encombre l'espace de la page d'accueil. Consacrez cet espace pour décrire l'activité de la société ou la nature du site. Ce conseil est valable également pour le nom de la page d'accueil. Rien de plus désagréable de chercher un favoris s'ils commencent tous par Bienvenue.

"Under construction"

Il est frustrant pour un visiteur de s'apercevoir qu'une rubrique n'est pas terminée. Prenez plus de temps pour finir toutes les pages pour le soumettre ensuite en ligne. Testez que tous vos liens fonctionnent également. Généralement les éditeurs HTML possède une fonction automatique pour détecter les liens brisés.

"Optimisé pour... "

Capture d'écran InfoGSM (23 juin 2007)

Il n'est pas rare de voir un site optimisé pour une résolution ou une version d'un navigateur. Cette façon peu courtoise risque de déplaire à un bon nombre de vos visiteurs et d'en frustrer plus d'un. Vous êtes concepteur d'un site web, il est de votre devoir de faire en sorte qu'il soit accessible au plus grand nombre. Si vous êtes incompétent d'un point de vue technique ne faites pas supporter cet handicap au visiteur.

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

Plus d'info: « Optimisé pour IE en 800*600 » (Openweb).

Gadgets divers

Affichage de l'heure, indication des températures pour une région du pays, installation d'un compteur de visites... tout ces éléments chargent inutilement la page d'un point de vue visuel mais aussi en quantité de données transférées. D'autant plus qu'un compteur peut être faiclement bidouillé et qu'il est souvent présent pour flatter l'ego du concepteur. Concentrez-vous sur le contenu.

Musique

Dans la plupart des cas, la musique est a proscrire pour des raisons multiples:

• alourdit la page
• manque de discretion: surf dans un lieu public, au travail, les enfants dorment
• interfère avec la musique du visiteur
• agace le visiteur

Quand bien même vous décidez de l'ajouter, utilisez une musique d'ambiance plutôt qu'un clip et permettez à vos visiteurs de l'arrêter à tout moment grâce à un bouton de fermeture visible.

À éviter si possible

Splashscreen

Le splashscreen est la première page d'un site web qui affiche une composition graphique, une animation flash ou le choix de la langue. Cette page redirige - automatiquement ou non- le visiteur vers la page d'accueil proprement dite. Si elle a un certain effet visuel intéressant lors de la première visite, elle comporte un certain nombre d'inconvénients:

• elle retarde d'une page l'accès à l'information pour les visiteurs, leur proposant une page souvent pauvre en contenu
• elle offre également une page d'accueil difficile à référencer pour les moteurs de recherche, car elle contient pas ou peu de contenu référencable
• si l'image est de grand format ou si l'introduction en Flash est complexe, la page risque d'être longue à charger

Conformité W3C

Cette image indique que le site est conforme aux standards des CSS. Dans un monde parfait, les sites web ne devraient pas l'afficher puisqu'ils respecteraient les standards du web. Malheureusement ce n'est pas le cas.

Ce logo n'est pas compris par la plupart des internautes et ce n'est pas leur soucis. Il vaut donc mieux ne pas l'afficher directement sur les pages mais plutôt dans une rubrique intitulée « À propos du site » et accompagné d'un bref descriptif.

Tableaux de mise en page

Au début du web, les concepteurs utilisaient les tableaux pour des mises en pages élaborées. Cette technique imaginée par Davide Siegel en 1997 est toujours utilisée abondamment. Aujourd'hui les feuilles de style, ou CSS, permettent de venir en aide à cette lacune. Les tableaux sont donc utilisés uniquement pour les données tabulaires.

Plus d'infos: « En quoi la mise en page par tableaux est-elle stupide » (Cybercodeur.net).

Icônes redondantes

« Ajouter aux favoris »

« Imprimer »

De nouveau cette information est inutile et revient au navigateur de le faire. Un site correctement codé dispose d'une feuille de style pour l'impression. Elle permet alors d'afficher les adresses web complètes des liens ou e-mails, d'optimiser la mise en page pour l'impression, d'ajouter la signification des abréviations, etc.

« Augmenter la police »

C'est très tendance d'afficher des icônes A, A-, A+, A++ pour augmenter ou diminuer la taille des caractères. Un code HTML correct prévoit des valeurs relatives pour les tailles de police. De cette manière, le visiteur peut aisément grossir ou rétrécir le texte via les raccourcis-clavier ou le menu de son navigateur. Inutile de se substituer au navigateur.

[capture d'écran d'un site]

Captcha

Le spam est le mal du siècle sur internet. Pour éviter de se faire pomper sauvagement son adresse électronique certains webmasters préfèrent indiquer leur e-mail sous la forme « pseudo AT fournisseur DOT com ». Ce charrabia est incompréhensible pour l'utilisateur lambda ! Ce problème de spam est le vôtre et il existe d'autres méthodes pour y remédier. Pensez par exemple à un formulaire en PHP.

Le pourriel (autre nom du spam) s'infiltre également dans les blogs et on voit apparaître des systèmes de protection particulier. Le captcha est un code composé de chiffres et de lettres et présenté sous la forme d'une image. En principe, seul un être humain est capable d'identifier le contenu. Des récents tests ont montré leur inéficacité à 85 %.

Aux oubliettes les frames

Lors de l'apparition des frames (cadre en français) en mars 1996 par Netscape, les webmasters se sont rués sur cette nouvelle possibilité de mise en page. In fine, ils possèdent plus d'inconvénients que d'avantages et ne sont pas reconnus par le W3C.

• tous les navigateurs ne réagissent pas de la même façon
• pose problème au référencement
• une page interne peut se retrouver isolée de son système de navigation lors d'une recherche
• l'adresse du site reste identique quelque soit la page visitée, les liens profonds sont donc impossibles
• l'impression offre parfois des surprises en fonction de la position du curseur

Plus d'info: « Pour en finir avec les cadres » (Openweb).

Écrire sur le web

On écrit pas de la même manière dans un quotidien que sur le web. Préférez une rédaction épurée de description, allez droit au but. On sait qu'un visiteur passe en moyenne 15 secondes sur un site. Il a une lecture en diagonale, c'est-à-dire qu'il survole la page pour repérer ce qu'il pourrait l'intéresser. Si le sujet l'intéresse il lira alors le contenu. Regroupez votre texte en petits paragraphes. Le tout ne doit pas dépasser en longueur deux écrans d'ordinateur. La longueur peut être considérée comme un manque de synthèse des auteurs.

Conception uniforme

L'ensemble de vos pages doivent se ressembler par leur style. Élaborez une charte graphique avec une page d'accueil et une page modèle pour donner une cohérence graphique et une identité visuelle.

Ergonomie ou facilité de navigation

Ah l'ergonomie! C'est un sujet récurrent ces derniers temps. Un expert dans le domaine, M. Nielsen n'hésite pas à critiquer (de manière constructive) les grands portails américains. Pourtant, je vous invite à consulter son site: Useit.com. L'esthétique du site fait peur mais l'ergonomie (usability en anglais) excelle. Voici quelques pistes à suivre:

• utilisez une police d'écriture adaptée à l'affichage écran et contrastée avec le fond
• facilitez la navigation par des menus accessibles en permanence
• faites en sorte qu'on puisse accéder en trois clics maximum à n'importe quelle information à partir de la page d'accueil (souvent contesté à juste titre)
• évitez les pop-up publicitaires agressifs qui agacent et nuisent à votre image

Plus d'infos sur l'ergonomie.

Respect des droits d'auteurs

Le web permet d'utiliser n'importe quelle image d'un site. Vous êtes tout à fait libre des les utiliser à titre personnel puisqu'elles se retrouvent dans le cache de votre ordinateur automatiquement. Par contre, si vous envisagez faire profiter d'autres internautes, prenez soin d'avertir les auteurs avant publication et d'avoir leur autorisation explicite. Ensuite, créditez sur vos pages les auteurs ou les créateurs de contenu.

Réalisé le 28 août 2003. Mis à jour le 23 juin 2007.