La función oculta de HTML5 que rastrea clics sin JavaScript

Desarrollo
, ,
1

La Función Oculta de HTML5 que Rastrea Clics Sin JavaScript

Amit Kumar

1400×933 672 KB

La Función Oculta de HTML5 que Rastrea Clics Sin JavaScript

La semana pasada estaba revisando un artículo interesante sobre uno de los elementos HTML más antiguos. Me refiero a nuestra querida etiqueta <a>.

A medida que HTML evolucionó con el tiempo, se agregaron numerosas características nuevas. Hoy voy a mostrar una de esas características interesantes que se añadieron a la etiqueta <a> en HTML5.

He probado esto para agregar capacidades de seguimiento para los clics en los enlaces. Veremos cómo funciona, cuáles son sus aplicaciones prácticas y cómo puede afectar la privacidad cuando se utiliza.

Comencemos con la parte divertida.

Rastrear Clics en Enlaces Sin JavaScript

Ahora intentemos comprender el atributo que permite rastrear clics en enlaces en tu aplicación web sin usar JavaScript.

El atributo ping es parte de la etiqueta <a>. Cuando alguien hace clic en un enlace con ping, el navegador envía una solicitud POST a la URL que especifiques. El usuario aún llega a su destino. El seguimiento ocurre en paralelo, en silencio.

<a href="https://example.com" ping="https://tracker.com/log">Visitar Ejemplo</a>

Haz clic en ese enlace y dos cosas suceden al mismo tiempo: el navegador navega a example.com, y envía una solicitud POST a tracker.com/log.

Puedes agregar más de un enlace al atributo ping:

<a
  id="exampleLink"
  href="https://example.com"
  ping="https://example-tracking.com https://example-analytics.com"
>Enlace Ejemplo</a>

¿Cómo Funciona en el Interior?

En el momento en que alguien hace clic, el navegador prepara dos acciones:

  • Una abre el destino.
  • La otra envía una solicitud POST con metadatos básicos: el href del enlace, el referente, tal vez algunos detalles del navegador.

Ambas acciones ocurren al mismo tiempo. Ninguna espera a la otra. La solicitud POST incluye: la URL que se hizo clic, la página donde ocurrió el clic, contexto mínimo del navegador. Eso es todo. Sin cargas útiles voluminosas. Sin encabezados complejos.

¿Por Qué Empecé a Usar Ping?

Intentemos entender por qué me encantó a primera vista:

  • Elimina dependencias: Solía configurar bibliotecas de seguimiento que agregaban 30 KB solo para registrar clics. Ping hace lo mismo con un solo atributo. Cero kilobytes. Cero llamadas externas.
  • Las páginas cargan más rápido: El seguimiento con JavaScript significa escuchadores de eventos, consultas del DOM, llamadas fetch, todo consumiendo ciclos. Ping es un comportamiento nativo del navegador. No afecta tu presupuesto de rendimiento.
  • Los usuarios fluyen naturalmente: Sin cadenas de redirección. Sin retrasos de ventanas emergentes. La gente hace clic y llega instantáneamente. El seguimiento ocurre donde debe: en segundo plano.
  • La conformidad se vuelve más fácil: Cuando solo envías un enlace y un referente, las políticas de privacidad se simplifican. No estás enviando perfiles de usuario completos a terceros.

La Preocupación por la Privacidad

Aquí es donde se pone complicado. Ping es silencioso. Los usuarios no lo ven disparándose. Hacen clic en un enlace, sin saber que una solicitud POST acaba de salir de su navegador.

Algunas personas lo llaman tramposo. Yo lo llamo invisible, pero invisible puede parecer tramposo si no eres transparente.

  • Rastreo sin conciencia: La mayoría de la gente no sabe que existe ping. Hacen clic, pensando que solo están navegando. Mientras tanto, su acción se registra en algún lugar.
  • Datos que van a lugares: Esa URL de ping podría dirigirse a cualquier parte. A tu servidor de análisis. A una red de terceros. A alguien a quien no pretendías compartir.
  • Control limitado: A diferencia de JavaScript, que puede ser bloqueado por herramientas comunes, ping pasa desapercibido. La mayoría de los usuarios no saben cómo desactivarlo.

Soporte del Navegador

Chrome, Firefox, Safari, Edge, todos soportan ping. Algunos navegadores enfocados en la privacidad lo deshabilitan por defecto. La mayoría de las extensiones no lo capturan a menos que estén buscando específicamente por ello.

Desactivar Ping por Privacidad

Para cualquiera preocupado por ser rastreado, aquí está cómo desactivarlo.

  • Firefox:

    • Escribe about:config en la barra de direcciones.
    • Busca browser.send_pings.
    • Establécelo en false.

  • Chrome:

    • Instala Privacy Badger o uBlock Origin.
    • Ambos bloquean las solicitudes ping por defecto.

  • Extensiones que ayudan:

    • Privacy Badger
    • uBlock Origin

Conclusión Final

Ping no es un reemplazo para plataformas de análisis robustas. No te dará mapas de calor, flujos de usuario ni análisis de embudo.

Pero si solo necesitas saber “¿alguien hizo clic en este enlace?”, es perfecto.

La trampa es la transparencia. Si estás usando ping, infórmale a tus visitantes. No lo escondas. No asumas que no les importará.

Respeta su privacidad. Usa los datos responsablemente. Así es como conviertes una característica técnica en algo genuinamente útil en lugar de algo que se siente desagradable.

Me encantaría ver tus pensamientos y sugerencias en los comentarios a continuación.

Gracias. Nos vemos de nuevo con otro pequeño pero interesante fragmento de HTML.

Amit Kumar

Escrito por Amit Kumar

4.4K seguidores

3 siguiendo

Amit Kumar es un desarrollador frontend que ama diseñar aplicaciones web con una interfaz de usuario limpia y consistente.