Introduction
Ce guide est conçu pour vous aider à concevoir et à élaborer des sites Web rapides et simples d'utilisation qui seront pris en charge sur les connexions à bande passante faible.
Paramètres
A quelle vitesse les pages doivent-elles se charger ?
Quarante ans de recherche en Interaction humain-ordinateur ont permis, conformément aux limites perceptives des utilisateurs, de déterminer le temps de réponse de plus approprié en matière de systèmes informatiques. L'article en ligne de Jakob Nielsen, "Temps de réponse (anglais)"[1], offre une bonne introduction. Diverses études montrent que les utilisateurs abandonnent les pages Web dont le chargement dure plus de 10 secondes. Si des données utiles commencent toutefois à apparaître au bout de 2 secondes, ils sont alors prêts à patienter jusqu'à 30 secondes, le temps que la page finisse de se charger[2].
En résumé, les principales règles sont les suivantes :
- Les pages doivent se charger en moins de 10 secondes.
- Les pages à affichage incrémentiel doivent présenter du contenu pertinent dans les 2 secondes qui suivent leur initialisation et finir de se charger en moins de 30 secondes.
La vitesse de chargement d'une page dépend de la taille de celle-ci, du nombre et de la taille des fichiers externes référencés (JavaScript, feuilles de style, images et fichiers multimédia) et des propriétés de la connexion Internet de l'utilisateur (bande passante et latence).
Les connexions Internet varient d'un pays à l'autre. Au moment où nous terminons la rédaction de cet article, au Kenya, toutes les connexions internationales sont acheminées par le biais de liaisons satellites à haute latence. Cela signifie que le délai minimal de chargement d'une page au Kenya est d'environ deux secondes et que, des deux règles énoncées ci-dessus, la première règle est plus facile à observer que la deuxième.
Quelle taille maximale une page doit-elle présenter pour se charger en moins de 10 secondes ?
En règle générale, chaque page doit être de 25 Ko maximum.
Cette taille dépend de la bande passante disponible, donc l'estimation est malheureusement souvent difficile à établir. Nous avons choisi de nous baser sur les universités africaines dans la mesure où des enquêtes statistiques récentes existent nous permettant d'évaluer la bande passante disponible. Plusieurs initiatives visant à fournir des informations pédagogiques à ces universités (African Online Digital Library, AGORA, HINARI, JSTOR et PERI) sont également affectées par un manque de bande passante.
Selon le sondage ATICS 2006 (African Tertiary Institutions Connectivity Survey)[3], la bande passante moyenne disponible dans une université africaine est de 1254 Kbits/s. Par ailleurs, chaque université dispose d'environ 600 ordinateurs connectés. En supposant qu'à tout moment donné, au moins un ordinateur sur 20 est connecté à Internet (d'après les taux de contention ADSL), cela équivaut à environ 40 Kbits/s en moyenne.
Toutefois, la plupart de ces connexions universitaires ne font état d'aucun débit garanti (ou CIR, Committed Information Rate), ce qui signifie que leur véritable bande passante est environ deux fois moins élevée que celle indiqué lors de l'achat. En outre, de nombreuses institutions mondiales utilisent des méthodes de gestion de bande passante inefficaces, ce qui contribue à réduire davantage encore la bande passante disponible[4].
Tous ces facteurs amènent ainsi à un total de 20 Kbits/s de bande passante maximale par utilisateur, un chiffre qui semble corroborer notre expérience personnelle.
Limites de taille de page
Pour obtenir un temps de réponse approprié à 20 Kbits/s, la taille maximale de chaque type de page est donc la suivante :
Type de page | Taille |
---|---|
Page à chargement non incrémentiel (10 secondes) | 25 Ko |
Page à chargement incrémentiel (30 secondes) | 75 Ko (avec contenu pertinent dans les cinq premiers kilooctets) |
Ces limites s'appliquent à l'ensemble de la page, y compris aux images et aux fichiers JavaScript et CSS externes qu'elle contient. Le partage des images, des fichiers de script et des fichiers CSS entre les différentes pages est recommandé, dans la mesure où il permet la mise en cache de ces éléments dans le navigateur de l'utilisateur et la réduction du temps de chargement des pages suivantes. Ces composants doivent toutefois être inclus dans la taille de la page car ils sont susceptibles de ralentir l'affichage de la première page de votre site, affectant ainsi la première impression de l'utilisateur.
Le Rapport sur la rapidité des pages Web (anglais)[5] recommande :
Indicateurs de taille
Tout objet dont la taille dépasse 75 Ko (image, document PDF etc.) peut nécessiter jusqu'à 30 secondes pour se charger. Des études d'utilisabilité suggèrent que les utilisateurs abandonnent souvent les processus lents sans retour d'information. Par conséquent, tout lien vers un objet dont la taille est supérieure à 75 Ko doit impérativement être libellé en indiquant la taille de l'objet, tel que dans l'exemple suivant :
Rapport PDF (237 Ko)
Accessibilité
Tout site Web doit être conçu pour être accessible aux personnes handicapées. Bien que les limitations propres à l'accessibilité et aux bandes passantes faibles soient très similaires, notez toutefois que ce guide de conception Web pour bande passante faible n'inclut aucune instruction spécifique à l'accessibilité. Veuillez consulter le Projet WebAIM (anglais)[7] pour des instructions plus détaillées quant aux normes propres à l'accessibilité.
Synthèse
Le facteur le plus important en matière de sites Web et d'utilisabilité est le temps de réponse, qui dépend de la taille de la page. Dans les pays en voie de développement, de nombreux sites volumineux sont si lents qu'ils en deviennent inutilisables. En supposant que chaque utilisateur dispose de 20 Kbits/s maximum de bande passante, il est recommandé de limiter la taille des pages Web tel qu'indiqué ci-dessous :
Type de page | Taille |
---|---|
Page Web normale | 25 Ko maximum |
Page à chargement incrémentiel | 75 Ko maximum |
Références
[#1] Jakob Neilsen "Temps de réponse : les trois limites importantes" (anglais), http://www.useit.com/papers/responsetime.html
[#2] Andrew King "Accélérez votre site
: optimisation de site Web" (anglais), New Riders Publishing
2003
[#3] Sondage ATICS 2006, téléchargé le
15/07/2007 depuis :
http://www.gesci.org/files/Connectivity%20in%20African%20tertiary%20institutions.pdf
(399kB)
[#4] http://www.aptivate.org/attach/Projects.BMOPositionPaper/AptivateBMOPositionPaper.pdf (133kB)
[#5] http://www.websiteoptimization.com/services/analyze/wso.php
[#6] W3C, Spécifications du HTML 4.01 :
recommendations du W3C, le 24 décembre 1999, http://www.w3.org/TR/html4/intro/intro.html