Microsoft Clarity: Guía completa para el análisis de experiencia de usuario
Published: 2024-02-14 22:36:37

Hoy en día dada la necesidad de entender si una página web está funcionando correctamente y mejorar la experiencia del usuario, Microsoft desarrolla Microsoft Clarity. Esta herramienta te ayuda a obtener las estadísticas de uso de usuarios, grabaciones de sesión y mapas de calor con el fin de corregir y mejorar la experiencia del usuario en un sitio web.

## ¿Qué es Microsoft Clarity?

Microsoft Clarity es una poderosa herramienta **completamente gratuita** y muy fácil de usar para análisis para sitios web que ofrece una visión detallada del comportamiento de los usuarios. Su implementación es muy fácil y no necesitas ser un experto, solo necesitas algunos minutos. Además, **cumple con los requisitos de la GDPR y la CCPA,** sin muestreo y de código abierto.

![Microsoft Clarity Página Oficial](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qsu941bd2pgdrnylw2qf.png)
Mientras que otras herramientas se centran en métricas como el tráfico, palabras clave y rendimiento de la página, Clarity va más allá al ofrecer informes detallados sobre cómo los usuarios interactúan con el sitio. Esta información valiosa ayuda a los propietarios de sitios web a identificar áreas de mejora, detectar errores y predecir conversiones.

Todos estos datos son proporcionados casi en tiempo real, incluyendo información sobre el dispositivo utilizado, la ubicación geográfica y el comportamiento en vivo o registrado de los usuarios.
## ¿Quién puede usar Microsoft Clarity?

Cualquier persona que disponga de un blog o un sitio web puede usar **Microsoft Clarity**. Microsoft no ha puesto limitaciones en cuanto al tráfico de la página web y su implantación no afecta en los tiempos de carga de la página en cuestión.

## Compatibilidad de Privacidad

Aunque Microsoft Clarity monitorea el comportamiento del usuario en el sitio web, Clarity, [GDPR de la UE](https://privacy.microsoft.com/en-US/privacystatement) y [CCPA](https://privacy.microsoft.com/ccpa) totalmente compatible con los requisitos de privacidad. Clarity minimiza el proceso de recopilación de datos personales para proteger la privacidad del usuario. No hay identificación de usuario ni monitoreo de información personal.

![Privacidad GDPR y CCPA de Microsoft Clarity](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jq8rv3cfchf1j1q9gkku.png)
## Impacto de Microsoft Clarity en la Velocidad de un sitio web

El código JavaScript de Microsoft Clarity está marcado como asincrónico y no afecta el rendimiento del sitio web, según [afirma Microsoft](https://learn.microsoft.com/en-us/clarity/faq#will-clarity-reduce-my-site-s-performance-).

![Microsoft Clarity No afecta la velocidad de carga de un sitio web](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ovdovb3lb3etx0v5sapy.png)

## ¿Cómo instalar/integrar Microsoft Clarity en tu sitio web?
Para instalar Clarity en tu sitio web, simplemente necesitas una cuenta en la página oficial de Clarity. Después de iniciar sesión o crear una nueva cuenta, puedes comenzar la configuración del proyecto añadiendo un "Nuevo proyecto" desde el panel de "Mis proyectos". Solo necesitas añadir un nombre y el dominio de tu sitio web.

![Añadir un nuevo proyecto de Microsoft Clarity](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/quwvu6yg71rq18a4wb2x.png)
Luego, elige el método de instalación: puedes instalarlo con alguna plataforma de terceros (si tu sitio web está hecho con Wordpress, por ejemplo) o hacer una instalación manual copiando y pegando el código de seguimiento dentro de la etiqueta <head> de tu sitio.

![Método de Instalación de Microsoft Clarity(Terceros y manual)](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3a6gfe2kwdwt9cc0xazb.png)
Si deseas más detalles o una guía específica para tu plataforma, puedes consultar la [lista de las plataformas de terceros](https://learn.microsoft.com/en-us/clarity/third-party-integrations/clarity-third-platform) en la página oficial de Clarity.

## Características de Microsoft Clarity

Las características principales de Microsoft Clarity son:

- **Clarity Insights:** Proporciona métricas detalladas del tráfico del sitio web, ayudando a evaluar su rendimiento general.
- **Registros de sesión:** Ofrecen una visualización de las interacciones de los usuarios en el sitio, permitiendo comprender mejor su experiencia y identificar áreas de mejora.
- **Mapas de calor:** Permiten identificar los puntos calientes de una página web mediante el seguimiento de acciones como clics y desplazamientos de los usuarios.

### Clarity Insights

En el panel de un proyecto, puedes acceder a métricas masivas del tráfico del sitio web, que ayudarán a evaluar su rendimiento general. La interfaz es similar con otras herramientas de análisis, pero hay muchas métricas diferentes.

![Clarity Insights](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rdf94i7t0caj6y0aytvv.png)
#### Métricas que se pueden mostrar a primera vista:

- Número de visitas al sitio en un tiempo determinado.
- Páginas vistas por sesión.
- Profundidad de desplazamiento.
- Tiempo de un usuario activo en el sitio.
- Información sobre la procedencia del tráfico (origen, canal, campaña, fuente)
- Dispositivos utilizados en las visitas al sitio.
- Páginas con más visitas del sitio web.
- Errores simultáneos de JavaScript que ocurren en las sesiones.

Las estadísticas proporcionadas se pueden dividir utilizando filtros y segmentos que permiten examinar comportamientos específicos dentro de los rangos configurados.

### Grabación de sesiones en Microsoft Clarity

Los grabaciones o registros de sesión son una forma visual de observar las interacciones de los usuarios en su sitio. Esto le permite seguir la experiencia del sitio web de los usuarios y comprender qué puntos prefieren sus visitantes o en qué secciones pueden necesitar mejoras. Los registros detectan actividades como cambios, clics, desplazamientos, y pueden mantenerse durante un período de 90 días.

![Página de Grabación de sesiones en Microsoft Clarity](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ifedx3o17u2eb01vlov7.png)
Los registros de la sesión ayudan a responder preguntas importantes como:

- ¿Qué intenta hacer un visitante en su sitio web?
- ¿Qué ven sus visitantes como contenido principal?
- ¿Su visitante perdió información importante como CTA porque no se desplazó lo suficiente?
- ¿Dónde están las áreas donde el usuario está decepcionado o enojado?
- ¿Qué se puede mejorar en el sitio?

### Mapas de calor en Microsoft Clarity

Los mapas de calor te permiten identificar los puntos calientes de una página web, rastreando acciones como clics y desplazamientos de los usuarios. Hay diferentes tipos de mapas de calor disponibles, incluyendo **mapas de clics, mapas de desplazamiento y mapas de área**, cada uno proporcionando información útil para mejorar la experiencia del usuario y depurar problemas de la página web.

Clarity Heat Maps proporciona tres tipos de datos:

#### Mapas de calor basados en clics

El nivel de interacción de diferentes partes de un sitio web nos brinda información sobre dónde hacen clic los usuarios, o incluso si hay elementos en los que no se puede hacer clic.

Estos datos se pueden refinar y segmentar aún más con filtros para examinar a más detalle.

![Mapas de calor basados en clics de Microsoft Clarity](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k09wgiizrdgna5mdkciz.png)
Hay diferentes tipos de mapas de clics disponibles:

1. **Todos los clics :** Muestra todos los tipos de clics de usuario en una página, incluidos los clics muertos, los clics de ira, los primeros clics y los últimos clics.
2. **Clics sin actividad :** Muestra dónde los usuarios hacen clic en una página sin efecto / respuesta. El clic muerto también ocurre si un elemento interactivo no responde dentro de un tiempo razonable.
3. **Clics de ira:** Muestra dónde los usuarios hacen clic de nuevo a atrás muy rápidamente en el mismo espacio pequeño.
4. **Error clics :** Muestra clics que ocurrieron justo antes de los errores de JavaScript.
5. **Primeros clics:** Muestra los primeros clics del usuario en una página. Estos clics son útiles para aprender el patrón de sesión en el sitio web del usuario.
6. **Clics recientes :** Muestra clics del usuario final en una página. Estos clics son útiles para rastrear la transmisión del usuario dentro del sitio web y averiguar dónde perdió al usuario en la página.

Puedes revisar información detallada sobre los [mapas de clics de microsoft clarity aquí](https://learn.microsoft.com/en-us/clarity/heatmaps/click-maps).

#### Mapas de calor basados en desplazamiento

Los mapas de calor de desplazamiento muestran hasta qué punto los usuarios han realizado “scroll“ en un sitio web. Los datos del Mapa de calor de desplazamiento son increíblemente útiles porque pueden mostrar dónde los usuarios se desplazan hacia arriba y dejan de desplazarse por minuto antes de hacer clic en un elemento de llamada a la acción.

![Mapas de calor basados en desplazamiento de Microsoft Clarity](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/t7f0y74tjkut3mtmnw35.png)
Los datos del mapa de calor de desplazamiento muestran en qué punto los usuarios se rinden en su sitio o si los usuarios no pueden alcanzar cierto contenido y abandonan el sitio sin conversión. Todos estos datos de los mapas de calor son útiles para depurar problemas de una página web.

Puedes revisar información detallada sobre los **[mapas de desplazamiento de microsoft clarity aquí](https://learn.microsoft.com/en-us/clarity/heatmaps/scroll-maps).**

#### Mapas de calor basados en el área

En el mapa de calor basado en área, puedes ver el número total de clics para todos los elementos en un área marcada. A diferencia del mapa de calor basado en clics, puede seleccionar un campo y ver el clic total de todos los elementos en el campo y las grabaciones relacionadas. También puede acceder a mapas de campo pertenecientes a una sola página o grupo de páginas. Puedes obtener más información **[aquí](https://learn.microsoft.com/en-us/clarity/heatmaps/area-maps).**

![Mapas de calor basados en el área de Microsoft Clarity](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jgxj4q11ux538fwn8y1e.png)
Finalizando este artículo, ahora conoces más sobre Microsoft Clarity, una herramienta que puede ayudarte a mejorar la experiencia del usuario en tus sitios web. Con sus funciones intuitivas y su enfoque en la privacidad, Clarity proporciona información valiosa para optimizar la usabilidad y aumentar las conversiones. Es una solución esencial para impulsar el rendimiento de cualquier sitio web.