Umami, l’alternative à Google Analytics

Protection des données

Le principal avantage d’Umami par rapport à Google Analytics est sa capacité à fournir des statistiques sans avoir à utiliser de cookies. Umami stocke uniquement des données anonymes pour générer ses rapports. Le respect de la vie privée et la confidentialité font donc partie intégrante de ce projet.

Ces points ont l’avantage d’en faire une solution compatible avec le règlement général sur la protection des données européen (RGPD).

L’infrastructure sur laquelle vous installez Umami stocke les données qui servent à la génération des rapports. Aucun serveur distant ne traite les données de vos visiteurs. En conservant le contrôle sur l’ensemble de la chaîne, vous garantissez ainsi à vos utilisateurs qu’aucun tiers n’aura accès à leurs données.

Facilité d’utilisation

L’interface proposée par Umami est bien plus simple à appréhender que celle de Google Analytics. Umami se concentre sur un nombre restreint de métriques qui ont l’avantage de tenir sur une seule page :

• Pages vues : indique le nombre de pages visitées sur votre site
• Visiteurs : indique le nombre de visiteurs différents qui ont visité votre site
• Taux de rebond : indique le pourcentage d’utilisateurs qui quittent votre site web sans avoir effectué aucune interaction
• Temps de visite moyen : indique le temps moyen passé sur votre site web
• Événements : permettent d’enregistrer des événements tels que les clics sur des boutons ou l’envoi d’un formulaire de contact par exemple

Umami est disponible dans plus de 10 langues, dont le français, l’allemand, l’italien, l’anglais. Son interface dispose d’un thème clair et sombre, et s’adapte à toute taille d’écran.

Comment installer Umami ?

Vous pouvez exécuter Umami à l’aide d’un conteneur docker ou en compilant le code source disponible sur le dépôt GitHub du projet. Nous allons nous pencher sur l’installation avec un conteneur docker dans cet article.

Via docker

Le choix de l’image à utiliser va dépendre du serveur de base de données que vous utilisez : MySQL/MariaDB ou PostgreSQL. Nous allons voir l’exemple pour MySQL ci-dessous, les étapes sont identiques pour la version PostgreSQL, seule la chaîne de connexion et le nom de l’image docker changent.

L’avantage de la version docker est de permettre de mettre à jour Umami de manière simple lorsqu’une nouvelle version est disponible.

Prérequis

• Serveur Docker
• Serveur MySQL/MariaDB
• Base de données MySQL dédiée à Umami
• Utilisateur MySQL avec les droits sur la base de données

Installation

1. Récupérer l’image docker

docker pull docker.umami.dev/umami-software/umami:mysql-latest

2. Lancer le conteneur docker en adaptant les variables d’environnement nécessaires

docker run --name=umami
-p 3000:3000 \
--restart always \
-e DATABASE_URL=mysql://dbusername:dbpassword@localhost:3306/dbname \
-e DATABASE_TYPE=mysql \
-e HASH_SALT=randomString \
umami:mysql-latest

• --name permet de définir le nom de votre conteneur docker. Si vous omettez ce paramètre, un nom aléatoire sera généré.
• -p 3000:3000 indique que le port 3000 de la machine hôte est rattaché au port 3000 du conteneur docker.
• --restart always permet au conteneur docker de redémarrer automatiquement en cas de plantage.
• -e DATABASE_URL variable d’environnement qui permet de définir la chaîne de connexion à la base de données MySQL.
• -e DATABASE_TYPE indique le type de base de données dont il s’agit (MySQL ou PostgreSQL).
• -e HASH_SALT « grain de sel » qui sera utilisé pour générer des valeurs uniques dans la base de données. Remplacez cette valeur par une chaine de caractères aléatoire et unique.

Il existe plusieurs autres variables d’environnement permettant d’aller plus loin dans la personnalisation d’Umami. La variable IGNORE_IP vous permet de définir des adresses IP publiques à ignorer dans les statistiques. Ou encore TRACKER_SCRIPT_NAME qui permet de modifier le nom du fichier permettant le suivi des statistiques afin qu’il ne soit pas bloqué par les bloqueurs tels que AdGuard, AdBlock, etc.

La liste complète des variables d’environnement supportées par Umami est disponible ici.

Le premier lancement du conteneur docker initialise la base de données et crée un utilisateur par défaut. Vous pouvez accéder à l’interface d’Umami via l’adresse http://localhost:3000, en utilisant le nom d’utilisateur admin et le mot de passe umami. 

Lors de votre première connexion, modifiez le mot de passe par défaut. Le changement de mot de passe s’effectue dans la partie « Profil » en haut à droite.

Si vous souhaitez utiliser Umami en production, il est recommandé de le placer derrière un proxy inversé pour obtenir une URL sans numéro de port, NGINX permet une telle configuration par exemple.

Ajouter Umami à votre site web

Vous pouvez ajouter votre premier site web et commencer à récolter des statistiques une fois votre instance Umami installée.

Cliquez sur le bouton « Ajouter un site web », entrez le nom du site tel que vous souhaitez qu’il s’affiche sur le tableau de bord, puis entrez le nom de domaine du site web. Si vous le souhaitez, vous pouvez activer l’URL partagée afin que les statistiques de votre site web soient publiques et accessibles à n’importe qui.

Vous obtenez ensuite le code à ajouter à votre site web afin que le suivi des statistiques puisse se faire. Le code doit être ajouté entre les balises <head></head> de votre code HTML :

<!DOCTYPE html>
<html lang="fr">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta name="description" content="Description de mon site web" />
  <title>Mon site web</title>
  <link href="css/style.css" rel="stylesheet" />
  <script async defer data-website-id="a123ee4f-1de1-2c1e-6c40-441aeg3k1074" src="https://umami.example.com/umami.js"></script>
</head>
<body>
  <h1>Bienvenue</h1>
</body>
</html>

Une fois le code ajouté à votre site web, consultez-le et ouvrez la vue « Temps réel » proposée par Umami en parallèle. Vous devriez à présent obtenir des statistiques en temps réel !

Il est possible d’ajouter autant de sites web que vous le souhaitez sur une même instance d’Umami. Vous disposerez ainsi de codes de suivi différents pour chacun d’eux.

Suivi des événements

Le suivi des événements, aussi appelé « goals » ou « objectifs » sur d’autres plateformes, s’effectue de manière très simple avec Umami. Il suffit d’ajouter une classe CSS à l’élément de votre site web qui va générer l’événement dont vous souhaitez obtenir des statistiques.

L’exemple ci-dessous est un formulaire de contact, nous avons ajouté l’événement contact-button au bouton d’envoi du formulaire grâce à une classe CSS construite sous la forme umami--evenement--nom-evenement.

<form>      
  <input name="name" type="text placeholder="Nom" />   
  <input name="email" type="email" placeholder="Adresse email" />
  <textarea name="text" placeholder="Votre message"></textarea>
  <button type="submit" class="umami--click--contact-button" id="send-form">Envoyer</button>
</form>

Umami enregistre l’événement lorsqu’un internaute clique sur le bouton d’envoi. L’événement enregistré est alors visible sur le tableau de bord Umami sous le nom contact-button.

Si vous souhaitez enregistrer un événement à un moment particulier de l’exécution de votre code, vous pouvez utiliser les fonctionnalités JavaScript d’Umami. L’exemple ci-dessous envoie un événement en fonction d’une condition :

if (formSuccess) {
  umami('contact-button')
}

Dans cet exemple, formSuccess pourrait être défini à true dans le cas où le formulaire a correctement été rempli et envoyé. On s’assure ainsi que l’événement n’est pas comptabilisé si le formulaire n’a pas été réellement envoyé.

Le type d’événement sera alors défini sur « custom » contrairement à l’exemple utilisant la classe CSS qui indiquait qu’il s’agissait d’un événement de type « click ». Il est possible de définir des types d’événements personnalisés en utilisant les fonctionnalités avancées exposées par le script d’Umami.

Conclusion

Limitations d’Umami

Umami peut montrer ses limites dans certains cas. Les annonceurs qui diffusent des publicités sur les réseaux sociaux ou les moteurs de recherche ne trouveront pas leur compte avec Umami. Il ne leur sera pas possible de recouper les données pour savoir quelle campagne de publicité performe et laquelle doit être adaptée.

Un projet qui évolue

Lancé en 2020 par une équipe de trois développeurs, Umami a déjà connu de nombreuses mises à jour lui apportant de nouvelles fonctionnalités. Une feuille de route est accessible publiquement et liste les évolutions à venir dans les prochaines versions :

• La gestion des « tunnels » de conversion
• La possibilité de gérer des groupes de permissions
• La création de rapports avancés

Ces améliorations visent à rendre Umami plus polyvalent, pour les utilisateurs qui ne peuvent pas encore se passer de certaines fonctionnalités proposées par Google Analytics.

Une alternative crédible

En résumé, la majorité des créateurs de sites web n’ont pas l’utilité de la quantité de données personnelles qui sont collectées par Google Analytics. Umami peut leur apporter une solution alternative et respectueuse de la vie privée de leurs visiteurs, tout en ne les privant pas des statistiques les plus courantes à propos de leur site web.

Le fait de pouvoir héberger Umami sur l’infrastructure de votre choix contribue également à la protection des données et vous permet d’en rester maître. Les données ne sont pas transmises à l’étranger et encore moins partagées et revendues à des tiers à des fins publicitaires.

Les différents règlements sur la protection des données (RGPD et CCPA par exemple) sont par ailleurs respectés avec Umami, car aucun cookie n’est déposé dans le navigateur de vos visiteurs. Les données récoltées sont 100 % anonymes et ne permettent pas d’établir de profil. De plus, les instances Umami ne communiquent pas entre-elles, les visiteurs ne peuvent donc pas être pistés d’un site web à l’autre.