L'écran "parcours utilisateurs" : Suivez la rapidité de votre site

Dans cet article

data_car.png

 

Premières observations : la vue d'ensemble

Sur la page “Parcours Utilisateur" vous retrouvez tous les parcours qui ont été créés pour votre site.

Cette première page est une vue d'ensemble de tous vos parcours. Elle vous permet d'analyser de manière rapide et efficace la performance de votre site.

user-journey.jpg

Vous y trouverez d'abord, la disponibilité (uptime, downtime) ainsi que le nombre d'incidents par parcours sur la période que vous avez sélectionnée. 

Puis on y voit apparaître la moyenne, la variation et la note pour les 4 indicateurs clés de performance détaillées ci-dessous. Pour chacune de ces cinq sections une petite loupe en fin de ligne vous permet de sortir de la vue d'ensemble afin de vous rendre dans la vue détaillée de la section sélectionnée.  

Par exemple la première loupe va vous permettre d'avoir la liste complète des incidents de la période en cliquant dessus, vous pourrez ainsi connaître le détail de chaque incident et vous aurez la possibilité de tous les exporter en CSV.

 

Définition des indicateurs clés

Le Hero Time

Mesure du temps écoulé entre le début d'une interaction d'un parcours utilisateur jusqu'à l'attente de la réalisation de toutes ses vérifications. Cette mesure permet donc d'attendre que les éléments demandés dans les vérifications des actions soit bien insérées dans la page ou encore que les requêtes attendues soit effectuées pour considérer l'interaction comme terminée.

Cette mesure est particulièrement importante et va vous permettre de controller exactement les points clefs de chacune de vos pages. Contrairement à la "Fin du chargement" ou le “Speed Index”, cette mesure va se baser sur les éléments que vous avez vous même configurés au niveau de votre parcours utilisateur. Le Hero Time va vous permettre de vérifier le temps de chargement d'un ou plusieurs éléments (texte, image, carousel, formulaire, requête…) qui sont pour vous et vos utilisateurs indispensables à l’utilisation de votre site.

 

Le premier octet (Time To First Byte)

Mesure du temps qui sépare l’émission de la première requête HTTP (demande initiale d’une page web) par le navigateur et le début de la réception de la réponse, soit la réception du premier octet de donnée. Il s’agit donc du temps de chargement du premier octet de la page demandée.

Ce temps représente donc la capacité de votre applicatif et infrastructure à produire et délivrer rapidement le code HTML de la page demandée.

 

Le  Speed Index

Véritable référence de la Web Performance, le Speed Index est une bonne expression du ressenti utilisateur dans le chargement d'une page. Ce test mesure le temps écoulé entre la demande d'une page web par le navigateur et l’affichage de la partie visible (au dessus de la ligne de flottaison) de celle-ci.

Plus précisément, ce temps est issu d'un calcul mathématique représentant la progression d'affichage des pixels présents à l'écran au fil du temps, en comparaison avec l'image finale du site entièrement chargé. Ce temps, exprimé en millisecondes, va donc être majoritairement bon si une majorité des visuels de la page s'affiche rapidement à l'utilisateur, même s'il manque des petits éléments qui tardent encore plusieurs secondes à arriver pour compléter le chargement total.

C'est cette différence qui fait du Speed Index un indicateur plus proche du ressenti utilisateur, car finalement, si 95% de la page est affichée à l'écran, l'utilisateur a tendance a considérer que la page est chargée. Les derniers 5% peuvent tarder, cela importera généralement peu.

 

La fin du chargement

Mesure du temps écoulée entre la demande d’une page web par le navigateur et le chargement de l’ensemble des éléments listés dans celle-ci (Code HTML, images, scripts, tag des parties tierces).

Cela représente le temps nécessaire à l’obtention, l’affichage et la dynamisation de la totalité d’une page web demandée.

À la différence du Speed Index, la Fin du chargement de la page peut se retrouver extrêmement rallongée par le moindre élément manquant d’une page. Vu le nombre croissant d’éléments présents dans une page d’un site (parfois plusieurs centaines), on voit bien que cette mesure peut facilement “exploser" car pénalisée statistiquement par un tout petit élément ralenti dans la page.

 

Les notes vont de A à F, A étant le plus performant, F le moins performant. Les notes tiennent compte de la bande passante configurée dans vos scénarios. En effet, un utilisateur en 3G sur son smartphone n'a pas les mêmes attentes qu'un utilisateur connecté en fibre sur son ordinateur.

 

Pour aller plus loin

Pour chaque indicateur évoqué en cliquant sur la loupe vous entrez dans une vue détaillée par scénario qui vous présente toutes les étapes, les composants et les variations de temps de chacune d'entre elle sur la métrique selectionnée. Des onglets présents en haut de la vue détaillée vont vous permettre de naviguer librement entre les différentes métriques sans avoir à revenir sur la vue d'ensemble.

mceclip0.png

Puis pour chacune des interactions vous avez de nouveau un niveau de détail supérieur qui vous permettra d'obtenir des mesures de performance aussi sur l'application, les échanges réseaux, les données de performance de navigation ainsi que le découpage et le poids des resources de vos pages.

Les graphes sont dynamiques, vous pouvez modifier la période affichée en utilisation le Calendrier (en haut à droite). La période est appliquée à l'ensemble des graphes de la page et commune à toutes les fonctionnalités de l'app, c'est-à-dire qu'en changeant de section dans l'app vous gardez toujours la même échelle de temps.

Vous pouvez aussi aisément zoomer et dézoomer en sélectionnant dans les graphes de gauche à droite la zone sur laquelle vous souhaitez zoomer et de droite à gauche pour dézoomer.

mceclip1.png

Sur l'axe vertical du graphique vous retrouverez le temps total que notre sonde a mis pour parcourir l'ensemble des intéractions de votre parcours utilisateur.

Sur L'axe horizontal vous pourrez retrouver l'heure exacte de chaque point de mesure.

En dessous du graphique, vous retrouverez de détail des temps de chargement de chacune de vos pages. Nous vous retranscrivons les temps minimum (min), moyen (moyenne) et maximum (max) que QUANTA aura mesuré durant la période sélectionnée.

 

Comment analyser vos temps de chargement ?

Votre objectif est d'avoir des temps de réponse stables et en moyenne en-dessous de seuils définit dans l'application.  Une barre colorée apparait en haut des différents graphique afin de vous donner une lecture rapide de votre performance moyenne sur la période sélectionnée :

  • Vous allez voir une barre verte si votre site suit les bonnes pratiques et est optimisé pour une bonne expérience utilisateur
  • Une barre orange s'affiche, vous êtes dans la moyenne de la performance acceptable, néanmoins
    • Des optimisations sont possibles pour améliorer le temps de chargement et l’expérience utilisateur
  • Si votre barre est rouge votre site n’est pas optimisé pour une bonne expérience utilisateur, important la conversion et le SEO !
    • A ce seuil, vous risquez des pénalités importantes et ne maximisez plus votre conversion et vos visiteurs commencent à s'impatienter.

Aller plus loin dans l'analyse

 

 

 

Cet article vous a-t-il été utile ?
Utilisateurs qui ont trouvé cela utile : 1 sur 1
Vous avez d’autres questions ? Envoyer une demande

0 Commentaires

Vous devez vous connecter pour laisser un commentaire.