veblog

liste de diffusion | contact

 accueil > archives > ergonomie, design web > Temps de chargement, une question moins simple qu'il n'y parait


liens associés

sur veblog.com

11 règles pour créer des sites faciles à utiliser:
un article certes utile, mais un peu trop simplificateur sur la question des temps de chargement. Je débutais...

ailleurs sur le web

"the truth about download times"
Jared Spool montre dans cette étude que le temps de chargement perçu par l'internaute n'est pas corrélé au temps de chargement réel.

Temps de chargement: une question moins simple qu'il n'y paraît

page créée le: 04/03/2002
réagir à cet article

Résumé: trop de recommandations ergonomiques sur le web réduisent le temps de chargement à un simple paramètre chronométrique. Cela est faux, le temps de chargement perçu par un utilisateur sur un site dépend d'autres facteurs plus subtils, et notamment de la capacité du site à répondre à ses besoins. 

Temps de chargement : une évidence ?

Tous les sites traitant d'ergonomie web vous le diront : sur le web, un temps de chargement élevé est l'ennemi du succès. Et nombreux sont les auteurs qui vous disent: "il faut qu'une page se charge en moins de 10 secondes", "faites des pages de moins de 30 Ko", etc...

Ahem. Une analyse un peu plus fine des success stories du web, et une observation d'utilisateurs du web en utilisation réelle de l'outil, montrent que les recommandations de ce type sont beaucoup trop simplistes, et que si vous ne pouvez pas encore considérer qu'une page d'accueil de 100 Ko avec 40 fichiers d'images soit une bonne chose pour votre site, vous pouvez dans certains cas créer des pages un peu plus lourdes que les 30 ou 40ko "réglementaires".

Même veblog ... - Avant de rentrer dans le vif du sujet, une petite autocritique. J'ai moi même écrit dans l'article le plus lu du site depuis sa création (11 règles pour créer des sites faciles à utiliser, règle numéro 2) qu'il fallait produire des pages inférieures à 30 Ko pour augmenter ses chances d'être lu. Aucun lecteur n'a été suffisamment perspicace (ou impertinent ?) pour me faire remarquer que la page en question pèse 46 ko, et que la page d'accueil de veblog oscille entre 40 et 50 Ko selon le volume de brèves qui y figurent. Cela n'a pas empêché le lectorat d'être multiplié par 5 en un an. Aurait-il été multiplié par 7 ou 8 si les pages avaient été plus légères ? On peut en douter. Alors, "faites ce que je dis, pas ce que je fais" ?

Amazon.com, le site d'e-commerce le plus fréquenté, a une page d'accueil qui oscille entre 50 et 60Ko en fonction du nombre de promotions qui y figurent. E-bay a quelque peu alourdi sa page d'accueil depuis quelque temps, sans que son succès diminue, bien au contraire. Apple.com multiplie les images lourdingues sur toutes ses pages, et pourtant l'applestore ne se défend pas si mal en terme de trafic et de ventes. Alors, "les histoires de temps de chargement, c'est du pipeau ?"

Temps réel et temps perçu

En fait, l'internaute reste en général un animal extrêmement impatient. Mais l'observation d'utilisateurs en surf libre (par exemple dans un cybercafé, ou sur un stand internet au salon de l'agriculture) montre que ce qui compte est le temps "qu'il perçoit", et non le temps chronométrique de chargement d'une page de son premier à son dernier octet. Et plus précisément, cette perception dépend un peu du temps de chargement effectif, mais aussi, voire surtout des facteurs suivants:

a- La latence, la progressivité et le déroulement du chargement

b- La stabilité de la mise en page pendant le chargement, et l'utilisabilité de la page alors qu'elle n'est pas intégralement chargée.

c- Et surtout, (critère compte double, triple voire même quadruple), la capacité du site à satisfaire le besoin de l'utilisateur, et à lui fournir une navigation lui montrant "qu'il est sur la bonne voie".

Détaillons un peu ces trois critères.


a- Latence, progressivité, déroulement du chargement

temps de latence - La "latence" est le temps qui sépare le clic sur un lien, (ou sélection d'une adresse dans la barre), et le début réel du chargement. Si votre serveur fonctionne bien, et si le réseau n'est pas encombré, ce temps est faible voire imperceptible. Mais si une de ces conditions n'est pas remplie, alors il peut se passer plusieurs secondes avant que la page "courante" affichée ne disparaisse pour laisser la place au début du chargement de la suivante. La répétition de ce type de temps d'attente peut être pénible pour l'utilisateur, qui a l'impression que "le site ne marche pas". Là, l'ergonomie ne peut rien pour vous, c'est la performance de votre serveur qui compte: vérifiez la fréquemment, et si vous utilisez des technologies dynamiques, choisissez en une qui ne fatigue pas trop le serveur (ne me demandez pas laquelle est la meilleure de ce point de vue, je ne suis pas suffisamment technicien).

Créez des pages progressives - Plus importante est la notion de "progressivité" du chargement: votre page va-t-elle rester blanche plusieurs secondes puis apparaître d'un seul coup ? Ou va-t-elle se remplir petit à petit du haut vers le bas de la page ? Cet aspect est essentiel : lorsqu'une page reste "blanche" trop longtemps, l'utilisateur a tendance à croire que "le site ne marche pas", et risque d'appuyer soit sur le bouton retour, soit sur la touche "interrompre le chargement".

Qu'entendre par "trop longtemps" ? Là encore, cela varie d'un utilisateur à l'autre, mais d'après des observations personnelles, et conduites dans des conditions insuffisamment scientifiques, d'où ma prudence, je situe la fourchette entre 4 et 10 secondes, avec une moyenne à 6. Il faudrait que des laboratoires professionnels (exemple: axance ou yuseo, les deux seuls professionnels sérieux du test que je connaisse sur paris actuellement, c'est dire si le marché tarde à décoller...) se penchent sur la question.

Evitez le tableau unique - Or trop de sites ont encore un gabarit de page "non progressif", c'est à dire enfermé dans un seul grand tableau. Les navigateurs actuels (au moins netscape4 et IE5, j'avoue ne pas encore avoir tâté IE6), lorsqu'ils rencontrent une balise <table>, attendent de recevoir la contre-balise </table>, qui indiquent la fin du tableau, pour en afficher le contenu. Si le contenu de votre tableau est trop lourd, il risque de se passer de nombreuses secondes avant que quelque chose n'apparaisse à l'écran.

Pour éviter cela, deux solutions:

1- fractionner vos gabarits de page en plusieurs tableaux successifs. C'est la méthode choisie par veblog, cf. Schéma ci dessous

 schéma du gabarit de page à tableaux multiples de veblog
Un gabarit de pages en plusieurs tableaux
se chargeant successivement

Ainsi, très rapidement, l'en tête de page, le titre et le résumé de l'article apparaissent, aussi même si je me laisse aller à des textes très longs sur une seule page, le haut de l'écran est il très vite rempli d'informations utiles, et le temps que l'utilisateur lise cette information, le bas de la page se sera chargé.

Pour que cette tactique fonctionne, il est préférable que les tableaux de haut de page soient légers et que donc les images "frivoles" -i.e. non directement utiles à l'identification du site ou à sa navigation - en soient bannies.

2- adopter une mise en page partiellement sans tableaux, ce qui permet d'afficher "en continu" les longues séquences de texte. Mais cela limite vos possibilités de mise en page.

b- Stabilité de la mise en page pendant le chargement et utilisabilité de la page partiellement chargée.

La plaie : la bougeotte du texte - De nombreux sites commencent à afficher du texte rapidement, mais du fait de quelques erreurs de design, ce texte ne va pas rester en place durant le chargement des images ou l'application d'une feuille de style. Résultat, le texte se met à bouger alors que l'internaute en a commencé la lecture: horripilant (un exemple de site particulièrement pénible de ce point de vue: vnunet-mac).

En général, il suffit de spécifier la taille des images contenues dans la page pour que le problème soit au moins partiellement résolu: gros problème, solution facile, si ce pouvait être toujours le cas...

Où cliquer ? - Plus ennuyeux sont les pages qui sont inutilisables, "non navigables" jusqu'à ce que 12 images "bouton" servant à la navigation se soient chargées. En général, le texte est en ligne depuis longtemps, mais faute de liens textuels, l'utilisateur ne sait ou cliquer: cela va considérablement renforcer l'impression de lenteur. Au contraire, si votre navigation repose essentiellement sur des liens textuels dans le contenu, ou si vos éventuelles barres de menu sont textuelles, vos utilisateurs ne souffriront pas de cet inconvénient.

Par conséquent, pour maximiser l'impression de rapidité créée par votre site, faites en sorte que le texte une fois chargé ne bouge plus à l'écran en attendant les images, et que ce texte contienne des liens explicites par rapport aux objectifs supposés du visiteur.

c) Capacité de votre site à satisfaire les utilisateurs:

La patience de l'internaute varie - J'ai pu observer que lorsque les toutes premières pages d'un site donnent à l'internaute une partie des informations qu'il était venu y trouver, ou lui donnent une piste facile à suivre vers cette information, alors la patience de l'internaute augmente au fur et à mesure qu'il surfe sur ce site. Au contraire, si l'une des deux conditions ci dessus n'est pas remplie, la moindre attente peut devenir insupportable et augmentera fortement la probabilité que l'utilisateur "zappe" vers une autre destination.

De même, si un site remplit régulièrement les objectifs du visiteur, en faisant un client fidèle, celui ci sera plus patient que s'il découvre un site pour la première fois, et pourra pardonner ici une petite faiblesse du serveur, là une page au contenu fortement illustré...

Enfin, si une images se charge un peu lentement, mais que le texte, la légende ou la balise "alt" montrent à l'utilisateur que cette image en vaut la peine car elle apporte une information essentielle, celui ci sera enclin à l'attendre, alors que si rien n'indique à l'internaute pourquoi il investit son temps, celui ci ira le dépenser ailleurs.

L'utilisateur valorise inconsciemment son temps - En fait, l'utilisateur, en fonction des informations qu'il reçoit, va estimer plus ou moins consciemment si les attentes qu'un site occasionnent en valent la peine, et moduler son impatience en conséquence. Si vous avez à un moment quelconque un texte un peu long ou richement illustré à charger, vous devez faire en sorte que les informations reçues par le visiteur en amont de cette page (libellé du lien, indication du temps de chargement, etc...) ou au début du chargement progressif de la page (un titre parlant, un résumé encourageant...) l'incitent à patienter, parce qu'il aura décidé que la page vaut l'attente.

Et bien sûr, il ne faudra pas décevoir le visiteur: si la page qui se charge ne correspond finalement pas à ce que vous aviez indiqué, son "capital patience" envers votre site va fondre très rapidement, et regagner sa confiance sera délicat. On voit là encore que les différentes règles pour créer des sites utilisables sont interdépendantes, et que le temps de chargement perçu par l'internaute ne dépend pas que des performances chronométriques du site, mais de la qualité globale de son expérience utilisateur.

Une étude convergente - Jared Spool, le gourou d'UIE, arrive à la même conclusion. Dans une étude, son cabinet a demandé aux testeurs d'estimer quels sites étaient plus rapides à la fin d'un test, dans un panel assez large. Certains de ces sites avaient plutôt bien répondu aux objectifs de visite des visiteurs, d'autres beaucoup plus mal. Et bien, les utilisateurs ont majoritairement estimé que les premiers étaient "les plus rapides", même si la mesure chronométrique des temps de chargement montrait qu'à l'évidence, il n'en était rien, certains sites jugés rapides subjectivement étant même parmi les plus lents du panel.

Par conséquent, le temps réel de chargement des pages ne correspond pas à la perception de l'utilisateur. Et si parfois vous devez alourdir certaines pages, notamment intérieures, pour mieux satisfaire vos clients, sous peine que vous respectiez les recommandations ci dessus (chargement progressif, texte immobile et navigable), alors allez-y.

Question subsidiaire : "faut il couper les longues pages en plusieurs ?"

De ce qui précède, il découle qu'une page de contenu à chargement progressif pourra être relativement longue sans qu'il ne soit nécessaire de la tronçonner en plusieurs pages courtes. Aujourd'hui, l'utilisateur n'a plus de problème à utiliser les ascenseurs verticaux (pour ceux qui utilisent des écritures horizontales en tout cas), et tronçonner un texte en plusieurs parties vous fait courir le risque de perdre de nombreux utilisateurs en route. Je considère pour ma part que dans le cas d'un texte chargé par blocs successifs, l'équivalent de 5 à 7 pages A4 passe correctement sur une page web.

Si vous avez un texte vraiment très long à publier, vous pouvez le traiter non pas comme un article unique, mais comme un dossier découpé en chapitres cohérents et pertinents. Et si votre gabarit de page est "sans tableaux ni calques", c'est à dire que le texte se charge en continu (cas fréquent des "versions imprimables"), alors n'ayez pas peur de le laisser sur une seule page web, car l'utilisateur pourra l'imprimer pour la lire au calme, et le chargement continu garantit que s'il lit à l'écran, sauf incident réseau, sa vitesse de lecture sera inférieure à celle du chargement de la page.

Conclusion

Ne rêvez pas, ce qui précède ne constitue pas un blanc seing pour pouvoir créer sans précaution des pages lourdes comme un pudding. Simplement, pour gérer l'impression de rapidité ou de lenteur perçue par l'internaute, comptabiliser des temps de chargement ne suffit pas. Il faut soigner le déroulement du chargement des pages, et il faut donner à l'utilisateur l'impression que le temps passé sur vos pages a été bien employé.

Ceux qui croient qu'il suffit de "faire léger" pour faire bien opèrent une simplification abusive de ce que représente le temps pour un utilisateur. Aussi, tout en essayant constamment de réduire la "charge pondérale" superflue de vos pages (celle qui n'apporte rien), ne réduisez pas toujours la "charge utile" de vos contenus pour vous conformer au dogme des 30Ko ou des 10 secondes.

L'ingéniérie du design web, comme toutes les autres disciplines techniques, est une affaire de compromis. Le poids des pages est un critère important, mais vous devez parvenir à un bon équilibre entre ce paramètre et les autres éléments de la qualité de l'expérience utilisateur, sans sacrifier les uns au détriment des autres.

Liste de diffusion
Abonnez vous pour être prévenu(e) à chaque nouvel article de veblog


Respect de la vie privée, désabonnement : plus d'infos


contact: vincent@veblog.com

©informations légales & vie privée

accueil - haut de page

statistiques par