Ce document s'adresse aux développeurs qui souhaitent mesurer les pages vues sur leur application monopage à l'aide de Google Analytics.
Les applications monopages (SPA) sont des sites Web qui chargent un document HTML une seule fois et récupèrent tout contenu supplémentaire à l'aide d'API JavaScript.
Exemple : Supposons que vous ayez un formulaire pour acquérir des prospects. Il comporte trois écrans :
- Le premier écran permet de recueillir les informations sur le client.
- Le deuxième écran permet aux clients d'indiquer leur intérêt pour certains services.
- Le troisième écran permet aux clients de s'inscrire à des webinaires liés à leurs centres d'intérêt.
Pour mesurer correctement les pages vues à partir des SPA, vous devez compter les pages vues pour chaque écran avec lequel un utilisateur interagit et obtenir le bon référent de la page. Vous pourrez ainsi suivre correctement le parcours utilisateur.
Avant de commencer
Cette page suppose que vous disposez déjà des éléments suivants :
Un compte et une propriété Google Analytics 4 pour votre site Web. Découvrez comment configurer Google Analytics Set up Google Analytics.
Une balise Google implémentée sur votre site Web qui se déclenche lorsque la page se charge initialement. Découvrez comment configurer la balise Google.
Implémenter la mesure des applications monopages
Pour implémenter une mesure précise des SPA, utilisez l'une des méthodes suivantes pour déclencher une nouvelle page vue virtuelle :
Modifications de l'historique du navigateur (recommandé) : si votre SPA utilise l'API History, en particulier les méthodes
pushState()etreplaceState()pour mettre à jour les écrans, utilisez cette option.Événements personnalisés : si votre site Web utilise l'
DocumentFragmentobjet pour afficher différents écrans, utilisez cette option.
Implémentation de la modification de l'historique du navigateur
Si votre SPA utilise l'API History, vous pouvez activer les mesures améliorées dans Google Analytics pour suivre automatiquement les pages vues en fonction des événements de l'historique du navigateur.
Activer les mesures améliorées dans GA4
Pour mesurer automatiquement les page_views en fonction de l'historique du navigateur :
Ouvrez Google Analytics.
Dans Administration, sous Collecte et modification des données, cliquez sur Flux de données > Web.
Sous Mesures améliorées, faites glisser le bouton sur Activé pour activer toutes les options.
Cliquez pour modifier des options individuelles. Sous Pages vues, cliquez sur Afficher les paramètres avancés. Veillez à activer Chargements de pages et Changements de pages selon les événements de l'historique du navigateur.
Enregistrez les modifications.
Remarque : Lorsque les mesures améliorées sont activées pour "Changements de pages selon les événements de l'historique du navigateur", Google Analytics écoute automatiquement les événements d'historique (comme ceux utilisés dans les SPA) et envoie des événements page_view. Vous n'avez pas besoin de configurer des variables ou des déclencheurs d'historique spécifiques dans Google Tag Manager pour envoyer des pages vues à GA4.
Utiliser des déclencheurs Google Tag Manager pour les événements d'historique
Si vous devez déclencher d'autres types de balises dans Google Tag Manager en fonction des modifications de l'historique du navigateur, par exemple pour envoyer des données à d'autres plates-formes marketing, vous pouvez utiliser le type de déclencheur "Modification de l'historique".
Lorsque vous configurez des balises ou des variables pour qu'elles fonctionnent avec le déclencheur "Modification de l'historique", veillez à utiliser les variables intégrées appropriées fournies par Google Tag Manager :
History New URL Fragment: fragment de l'URL après l'événement d'historique.History Old URL Fragment: fragment de l'URL avant l'événement d'historique.History New State: nouvel objet d'état de l'historique.History Old State: ancien objet d'état de l'historique.History Source: source de l'événement d'historique (par exemple,popstate,pushState,replaceState).
Vous devrez peut-être activer ces variables intégrées dans Google Tag Manager sous Variables > Configurer.
Pour en savoir plus sur ce déclencheur, consultez la section Déclencheur "Modification de l'historique".
Vérifier votre configuration de mesure
Pour vérifier que votre application monopage mesure correctement les pages vues :
Activez le mode débogage pour chaque balise de votre configuration de mesure de SPA. Découvrez comment surveiller les événements dans DebugView.
Cliquez sur votre application monopage. Lorsque vous cliquez sur un nouvel écran virtuel, un nouvel événement
page_viewdoit s'afficher dans DebugView. Comparez les paramètres de l'événementpage_viewavec l'événementpage_viewprécédent pour vérifier si le référent de la page et l'emplacement de la page ont été correctement mis à jour.
Impact sur les événements automatiques
Si vous implémentez correctement la mesure des pages vues virtuelles dans votre SPA, Google Analytics gérera correctement les autres événements automatiques. Si les pages vues virtuelles ne sont pas enregistrées pour les changements d'écran, Google Analytics traite la SPA comme une seule page, ce qui entraîne des métriques faussées.
Par exemple, l'événement user_engagement mesure le temps qu'un utilisateur passe activement sur une page. Sans les pages vues virtuelles, tout le temps d'engagement est attribué au chargement initial de la page, ce qui rend impossible l'analyse du temps passé sur des écrans individuels.
Lorsque la mesure des pages vues virtuelles est correctement implémentée :
- L'événement
user_engagementest envoyé lorsque l'utilisateur passe d'une page virtuelle à une autre. - Le temps d'engagement pour la page virtuelle précédente est calculé et envoyé avec l'événement
user_engagement, généralement juste avant le traitement de l'événementpage_viewpour la nouvelle page virtuelle. - D'autres événements, tels que les clics ou les défilements, sont associés au
page_locationde la page virtuelle que l'utilisateur consulte actuellement.
Vous pouvez ainsi analyser l'engagement des utilisateurs et d'autres métriques pour des écrans ou des sections individuels de votre SPA, ce qui vous permet de mieux comprendre le parcours utilisateur.