Statistiques d’utilisation du dark mode

Hier suite à un Tweet de Thomas Defossez, je me suis demandé quel était le pourcentage d’utilisateurs du dark mode, aussi appelé mode nuit, sur leurs navigateurs.

J’ai donc fait un petit script en JavaScript pour mesurer le pourcentage de visiteurs sur mon site qui naviguent en mode sombre.

Vous pouvez consulter vous-même les résultats en direct.

Comment ça fonctionne ?

Il faut savoir qu’il est possible d’identifier en CSS si le mode sombre est activé dans le navigateur du visiteur via le media query prefers-color-scheme.

De là on a vite fait de faire un window.matchMedia(‘(prefers-color-scheme: dark)’).matches qui va nous retourner un true si le navigateur est en mode nuit.

On fait un petit appel à une page qui va incrémenter soit un fichier jour.txt, soit nuit.txt sur le serveur et zou, c’est terminé.

Enfin, presque.
Pour ne pas qu’un visiteur soit compté à chaque page visitée, j’ai ajouté un cookie de 45mn en me disant qu’un visiteur pourrait avoir un dark mode automatique à partir d’une certaine heure. (Je n’en sais rien du tout, j’imagine).

Après, si vous le souhaitez, vous pouvez même intégrer cette donnée à votre Google Analytics, ou tout autre logiciel de stats.
Comme ça vous pourrez comparer les taux de transformation de vos visiteurs utilisant le mode sombre VS ceux qui ne l’utilisent pas.
Si vous ne savez pas par où commencer pour le faire ; Oubliez.