Deux nouvelles conceptions de site Web ont récemment gagné en popularité pendant que les spécialistes du marketing recherchez des manières propres et concises de raconter l’histoire de leur compagnie. La conception d’une seule page est — vous l’avez deviné — un site Web qui utilise une page Web pour afficher tout le contenu du site. Parallaxe défilement a été autour dans les jeux vidéo depuis des années, mais devient une partie de plus en plus commune de la fonction de défilement d’une page Web. Le défilement parallaxe utilise plusieurs arrière-plans qui semblent se déplacer à des vitesses différentes pour créer un effet 3D. Souvent, la conception d’une seule page et le défilement parallaxe sont utilisés ensemble.
Il est facile de voir pourquoi les gens aiment les sites qui utilisent ces techniques de conception. Ils sont convaincants et faciles à suivre. Cependant, parce que tous les graphiques et le texte sont sur une page et ces sites utilisent souvent la vidéo, ils peuvent également être un cauchemar de performance si elle n’est pas optimisée correctement.
Slow Pages Sink Sites
Comme nous le savons, les temps de chargement des pages et le temps d’interagir (ITT) sont des mesures importantes à suivre lorsqu’il s’agit de créer une grande expérience utilisateur. Le temps de chargement optimal de la page est encore inférieur à trois secondes; plus longtemps et les sites risquent de perdre des clients et des ventes. (À quelle vitesse votre site Web se charge-t-il? Testez-le ici). Toutefois, les sites Web ne font pas un bon travail pour répondre à cette norme de l’industrie comme l’indique une récente enquête sur l’état de l’Union de Radware. En fait, les temps de chargement des pages continuent d’être plus lents.
Un autre côté de la créativité
Les concepteurs Web sont créatifs, mais maintenant ils doivent aussi être créatifs en termes de façon dont ils abordent la performance Web. Voici trois conseils à garder à l’esprit lors de la création de la conception d’une seule page et parallaxe sites de défilement:
- Gardez à l’esprit que les effets réseau (recherche DNS, latence, interactions réseau intégrées) ont un impact significatif et croissant basé sur la géographie et l’utilisation d’éléments hébergés par des tiers.
- Utilisez JavaScript et Flash, ainsi que HTML et CSS, pour adapter plus de contenu sur une page sans augmenter considérablement les temps de chargement.
- Utilisez le chargement paresseux pour charger uniquement le contenu visible immédiatement par l’utilisateur. Pendant que l’utilisateur s’engage avec ce contenu, chargez d’autres contenus afin que l’utilisateur ne subisse pas d’interruptions ou de temps d’attente. Les techniques de chargement paresseuses peuvent être codées en dur dans votre site Web avec JavaScript à l’aide de plugins.
- Utilisez des outils de performance de site Web pour tester régulièrement les performances de votre site Web à l’aide de différents navigateurs afin de vous assurer que les modifications apportées aux performances du site Web n’ont pas d’impact sur l’expérience utilisateur.
Les développeurs de sites Web qui gardent l’esthétique ainsi que les performances à l’esprit lors de l’utilisation de ces nouvelles techniques de conception web récolteront les fruits d’un beau site qui répond aux attentes des utilisateurs pour la vitesse de chargement des pages ainsi que l’ITT.