Je travaille sur un site Web où nous avons des pages clients sur lesquelles nous mesurons les interactions des utilisateurs, telles que l'ouverture d'un formulaire de réservation ou la publication d'un avis.
L'une des interactions que nous voulons mesurer est lorsque les utilisateurs consultent les numéros de téléphone. Actuellement, nous le faisons comme ceci:
Téléphone 123 - XXX XXX
afficher le numéro
Afficher le numéro est un lien de bouton qui affiche le numéro complet au clic et nous permet de suivre l'interaction de l'utilisateur.
Nous avons récemment reçu des commentaires concernant les X dans le numéro de téléphone. Nos utilisateurs et clients trouvent cela déroutant.
Les informations client sont affichées sur une seule page et les onglets ne sont pas une option.
Une alternative serait d'avoir seulement le "bouton afficher le numéro de téléphone" sans afficher la version XXX de celui-ci.
D'autres suggestions?
Je recherche également de bons arguments pour afficher le nombre directement (car, bien sûr, c'est le meilleur pour l'utilisateur).
Il y a généralement un compromis entre UX et les informations administratives. À mon avis, un peu biaisé UX devrait être la priorité.
Posez-vous la question: "Est-ce que je préférerais avoir moins de clients moins satisfaits, mais en savoir plus à leur sujet, ou des clients plus heureux et en savoir moins à leur sujet?"
C'est l'essence même de ce que vous faites, et à moins qu'il y ait un avantage incroyable à savoir quand ils voient les numéros de téléphone, j'arrêterais vraiment de le faire.
Voici une réponse détaillée, car d'autres réponses ont couvert les "bonnes" façons de le faire.
Si vous devez masquer le numéro de téléphone, au lieu d'en faire une tâche purement punitive pour le montrer, faites-le simplement apparaître comme une étape supplémentaire involontaire.
Obscurcir le numéro de téléphone et le révéler uniquement lorsque l'utilisateur clique dessus, c'est comme balancer des informations devant des personnes. Ils peuvent également se demander s'ils ont besoin de vous donner quelque chose pour obtenir le numéro, par exemple, certains sites ne vous permettent pas de voir les détails réels jusqu'à ce que vous vous connectiez ou vous inscriviez ou autre chose.
Au lieu de cela, il suffit d'avoir un lien qui dit "afficher le numéro" comme vous le dites, ou quelque chose qui est étiqueté avec l'action que l'utilisateur essaie d'effectuer ou les données qu'il veut (un lien qui dit "Coordonnées"). Ce n'est pas une bonne conception d'interface graphique - c'est un clic supplémentaire - mais au moins, il ne cache pas de manière flagrante des choses.
Ou pressez votre design pour que le numéro de téléphone ne corresponde tout simplement pas, et mettez une flèche de divulgation ou un triangle ou quelque chose pour qu'il ressemble à un contrôle "plus".
Personnellement, je préfère afficher le numéro de téléphone et faire de mon mieux pour suivre les interactions avec celui-ci via diverses méthodes d'analyse:
Ajoutez un événement de survol sur l'élément parent qui se déclenche une fois par chargement de page lorsque l'utilisateur survole l'élément parent contenant le numéro de téléphone. Cela nécessite la création d'un événement personnalisé dans votre logiciel d'analyse, tel que Google Analtyics . Ce sorte de vous donne une certaine mesure d'intention pour les gens qui déplacent leur souris vers la partie de la page qu'ils consultent actuellement.
Faites-en un lien, comme
<a href="tel:18005554444">1-800-555-4444</a>
alors il est cliquable, vous pouvez donc également suivre cet événement (mais vous ne voudriez pas suivre celui-ci au-dessus de l'événement de survol mentionné en 1). Heureusement, la plupart des logiciels d'analyse détectent naturellement les clics sur les liens et, puisque HREF est unique, il devrait fournir de bonnes données. C'est bien parce que l'utilisateur peut cliquer ou appuyer sur le lien pour passer l'appel sur un appareil qui le prend en charge, mais cela peut être déroutant pour les utilisateurs lorsque leur navigateur de bureau normal ne fait rien après avoir cliqué. Cela mesurerait l'intention, mais pourrait frustrer certains d'entre eux comme une sorte de "bouton vers nulle part".
Plutôt que de simplement suivre les "vues" du numéro de téléphone, une alternative consiste à avoir un numéro de téléphone distinct pour le Web et à simplement suivre les appels réels vers celui-ci. numéro chaque mois lorsque la facture arrive. Vous y avez probablement déjà pensé, cependant
Étant donné que les X
sont suspectés de créer de la confusion, supprimez-les. Comme ça:
Téléphone: (afficher le numéro) et faites (show number)
cliquable pour que lorsqu'il est cliqué, il soit remplacé par un nombre réel. Pas de X
et assez intuitif et vous avez le même flux de travail que précédemment.
Il y a toujours une tension entre les besoins de l'entreprise et les besoins de l'UX, et je ne suis pas d'accord pour dire que l'UX devrait toujours gagner.
Si vous avez besoin de mesurer le nombre de fois qu'un utilisateur accède à un numéro de téléphone, il ne suffit tout simplement pas de l'afficher et de mesurer les pages vues.
Il me semble que les X sont la partie déroutante, et vous pouvez simplement remplacer le numéro de téléphone par le "lien afficher le numéro de téléphone".
Dans ce cas, le compromis est mineur car la quantité d'effort requise pour passer un appel téléphonique est bien plus importante que de cliquer sur un lien.
Personnellement, je trouve que très souvent, lorsque j'ai besoin de lire de telles informations à partir d'une page Web, je déplace le curseur de ma souris près de l'information qui m'intéresse. Vous pouvez essayer de voir si c'est juste ma façon étrange de ne pas me perdre dans la page, ou que plus d'utilisateurs le fassent. Si plus d'utilisateurs le font, cela pourrait être un moyen d'obtenir les informations que vous recherchez de manière non intrusive.
Voici une bonne solution JavaScript native:
Créez un lien de numéro de téléphone cliquable:
<a href="tel:09483473843" class="reveal-number" data-number="094 834 73 843">094 834 73 843</a>
Ajoutez une fonction pour masquer les 4 derniers caractères et les afficher au clic. De plus, il existe un événement de dépassement de délai pour expliquer à l'utilisateur ce qu'il doit faire ensuite.
function reveal_number_init() {
let phoneNumbers = document.getElementsByClassName('reveal-number');
let replaceLastNChars = function(str, replace, num) {
return str.slice(0, -num) + Array(num + 1).join(replace);
};
for (i = 0; i < phoneNumbers.length; i++) {
var element = phoneNumbers[i];
element.href = 'javascript:void(0);';
element.innerText = replaceLastNChars(element.innerText, '*', 4);
element.addEventListener('click', function (event) {
element.innerText = element.dataset.number;
setTimeout(function () {
element.href = 'tel:' + element.dataset.number;
element.innerHTML += '<br><small class="phone-reveal-help">Click again to call.</small>';
}, 1000);
});
}
}
// Initialise the function:
document.addEventListener('DOMContentLoaded', function () {
if (document.querySelector('.reveal-number')) {
reveal_number_init();
}
});
Ensuite, vous pouvez utiliser un appel AJAX pour stocker les clics sur le numéro de téléphone, selon votre système de gestion de contenu ou la structure de votre base de données.
Découvrez son raisonnement et ses fonctionnalités ici - Comment suivre et mesurer les vues de numéros de téléphone avec JavaScript