SEO Técnico

Atributo Referrer para SEO

En todas las guías de la vieja escuela del SEO se habla del atributo rel= para las etiquetas <a>, es decir para los enlaces.

El atributo rel tiene varios valores:

  • Noreferrer
  • Noopener
  • Nofollow / UGC / Sponsored

Si quieres profundizar más hay un artículo bastante claro de Erik Sarissky sobre los atributos noreferrer/noopener/nofollow. Y como respuesta corta a lo que probablemente te estés preguntando, sí, Google interpreta igual el nofollow que el ugc que el sponsored.

Sin embargo quiero hacer hincapié en el Referrer para este artículo, pues puede tener más usos para el SEO y más a día de hoy de lo que muchos profesionales se podrían esperar.

El atributo rel="noreferrer", como su propio nombre indica, evita que el navegador envíe el encabezado HTTP Referer al destino del enlace. He querido empezar la introducción por aquí porque, para la mayoría de SEOs, este suele ser el primer punto de contacto con el concepto de referrer y, sin embargo, se trata de un atributo habitualmente infravalorado que puede ofrecernos mucha más utilidad de la que a priori cabría esperar.

Dato curioso: Si bien es cierto que muchos navegadores modernos tienen noopener por defecto cuando es target=”_blank”, también se añade de forma automática si pones noreferrer.

El referrer (o Referer) es un encabezado HTTP que el navegador envía al servidor de destino e indica la URL desde la que se ha originado la petición. Se utiliza habitualmente para identificar el origen del tráfico, medir referencias entre páginas y aplicar lógica de analítica, seguridad o control de acceso.

Anécdota curiosa:

Habrás podido ver que he puesto referrer pero también he hablado de referer, la realidad es que se escribe oficialmente con rr. Sin embargo, en el estándar original de HTTP se cometió una errata y el encabezado quedó como Referer.

ContextoEscritura Correcta
Atributo HTMLrel=“noreferrer”
Cabecera HTTPReferer
Política de seguridadReferrer-Policy

Para mí es mucho más sencillo de ver y entender con ejemplos visuales, así que voy a mostrarlo por medio de imágenes. Así que te voy a mostrar 2 ejemplos, uno con referrer y otro con noreferrer para que veas la diferencia.

Si vamos a Site Explorer de Ahrefs y examinamos un proyecto, cuando estamos en vista general nos aparece arriba el enlace del proyecto que estemos examinando. En este caso en la herramienta tenemos una etiqueta <a>que no añade ningún noreferrer.

Análisis de atributo referer desde la consola de Ahrefs

Si le damos al enlace se abrirá la web en otra pestaña (en el referrer es irrelevante que se abra en la misma pestaña o en otra).

Si en esa nueva pestaña abrimos la consola de Chrome.

Teclado resaltando las teclas Control y Shift

  • Con windows: Ctrl+Shift+I
  • Con Mac: ⌘+Option+I

Una vez abierta (recargamos con f5 sin inhabilitar el caché si no sale nada) seguimos este proceso:

  1. Hacemos clic en red.
  2. Seleccionamos el archivo HTML, que será el primero que nos salga.
  3. Nos quedamos en la pestaña de encabezados que es la primera que nos sale.
  4. Abrimos la subpestaña de encabezados de solicitud (no confundir con la de encabezados de respuesta).
  5. Buscamos donde pone referrer y ahí vemos de dónde ha provenido nuestra solicitud.

Análisis de referer desde la consola de Chrome

Y esto es lo que utilizan muchas de las herramientas conocidas de medición para saber el origen de los clics, aunque se debe tener cuidado con los bots para no sacar falsos positivos.

Si ese mismo método lo hacemos para comprobar el clic desde el dashboard de ahrefs, es decir desde aquí a nuestro proyecto directamente, no podremos verlo, ya que hay un noreferrer.

Ejemplo de atributo noreferrer desde Ahrefs.com

Como era de esperar, toda esta explicación no era simplemente para entretenerte, sino para regalarte usos reales a menudo infravalorados y a menudo no planteados que pueden ser una buena solución.

Analítica

Está claro que el uso más conocido del Referrer es la analítica, y vamos a comenzar por ella ya que es la más simple y su uso principal, pero vamos a darle una vuelta de tuerca, ya que las herramientas como GA4 o Ahrefs Web Analytics ya incorporan este referrer.

Con conocimientos de programación, un equipo de programadores o incluso con tiempo y tu LLM para código y ganas puedes analizar y guardarte la información de ciertos aspectos clave muy sencillos.

Análisis de Link Building

¿Has obtenido un enlace y quieres saber si merece la pena a nivel de tráfico? Se suele valorar el posible impacto que tiene en el SEO y a día de hoy en las inteligencias artificiales, pero la calidad de un enlace también se puede medir en si te trae tráfico directamente.

Ejemplo de Prompt para un WordPress:

Creame un plugin para WordPress que guarde en la DDBB cada vez que acceda un usuario a mi web con
un referrer de {loquequieras}.com o cualquiera de sus subdominios. 

Quiero que se me registre en la DDBB el día y la hora. Créame una tabla en la base de datos con el
propio código (y pon un condicional de que si existe esa tabla no me la vuelva a crear).

Permíteme que vea los datos de las visitas en el back de wordpress con ese código.
Luego explícame brevemente como guardar el archivo, comprimirlo en zip y subirlo
en mi panel de wordpress.

Y nos quedaría un plugin básico, simple y sin impacto en la velocidad de la web que funcionaría así (yo he puesto el ejemplo con enlaces desde ahrefs a una página test):

Ejempllo de un widget para WordPress para analizar referrer logs

(ya lo puedes complementar más si le quieres añadir blacklist de IPs y de user-agents y opciones para exportar y limpiar las tablas, pero es para que veas el concepto).

Análisis de Log

También puedes ver registros de todo lo que ha entrado en tu web por referrer previamente si tienes activados los Logs en tu web y luego puedes extraer de diversas formas la información para analizar la procedencia del tráfico de tu web con los logs.

El punto bueno es que tendrás toda la información, el punto malo es que al tener toda la información luego tienes que filtrar mucho para extraer los datos.

Referrer de los LLMs

La mayoría de los LLMs conocidos permiten analizarlos por medio de referrer. Además en este caso se enturbian menos los datos porque al ser enlaces que se le generan a los usuarios, es menos probable que los bots los generen y hagan clic.

En algunos LLMs como ChatGPT funciona pero hay excepciones como las visitas por Iphone en móviles (que hay otras formas de analizarlo), pero a excepción de Deepseek, Openevidence y alguna más, todas estas permiten el referrer.

No obstante, teniendo el referrer como base, puedes jugar bastante a la hora de mostrarte las visitas que te viene por medio de los usuarios a través de sus LLM y analizar día, hora, páginas más visitadas, si estas páginas arrojan un código de respuesta correcto o cualquier métrica necesaria para los LLMs.

Dashboard de visitas a un sitio web

Ejemplo de Plugin comercial que se puede generar con el Referrer como base

Todo esto sin necesidad de JavaScript o consentir Cookies, pudiendo comprobar gracias al referrer y un poco de código, combinado con otras herramientas como Brand Radar de Ahrefs si tus estrategias con los LLMs van funcionando.

Y si, con algo tan sencillo como el referrer puedes mejorar la UX de un sitio web, con casos que a la gente no se le suele ocurrir.

Migraciones

Imagina que trabajas en un proyecto donde una empresa ha comprado a otra o se han fusionado.

Trabajan en el mismo sector, pero quieren unificarlo a una marca.

Pongamos que está la web A y la web B, y se va a unificar todo en la web A.

En principio, si la marca B ha dejado de existir, tiene sentido redireccionar todo a la web A, unificar esfuerzos y hacer crecer la marca A.

Pero es bastante posible que hubiera clientes habituales de la web B.

Las sensaciones que puede tener un cliente de la web B a una redirección de una marca distinta pueden ser entre otras:

  • Que ha pinchado en un anuncio de Google Ads.
  • Que se ha equivocado, es un error suyo y no sabe llegar a donde solía ir.
  • Que hay un fallo que no identifica.
  • Que la marca A se ha comido a la marca B y no sabe si tendrá las mismas cosas que la marca B le ofrecía.

En muchos de los posibles escenarios, el usuario puede acabar realizando otra búsqueda en Google, una consulta en los LLMs o cualquier situación donde ante la desaparición de la web donde solía hacer sus compras/gestiones acabe desembocando en páginas de la competencia al buscar alternativas.

Con el referrer podríamos hacer un ajuste muy sencillo, ya que el referrer también viaja a través de las redirecciones.

Podríamos hacer que si el usuario procede de la web B salte un Pop-Up en la web A explicando la adquisición y comentandole si tendrá los mismos servicios, precios y dándole una bienvenida personalizada explicando todo de una forma amable y mejorando muchísimo la experiencia.

Dando esa cálida bienvenida podemos reducir bastante el porcentaje de usuarios que buscan información sobre lo que ha ocurrido fuera de la web, y además no tenemos por qué “molestar” con información innecesaria a los que ya eran veteranos de la web A.

Contenido dinámico

Con el referrer puedes gestionar más dinamismo entre webs, ya sea por la obtención de un enlace desde alguna web con sinergia o algún público objetivo al que le puedas ofrecer un descuento.

Por ejemplo, en la web del Andalu-SEO pasa algo especial si accedes desde Ahrefs.

Pop-up de Andalu-SEO que aparece al tráfico proveniente de Ahrefs

Este mismo ejemplo se puede utilizar para cualquier idea que se te ocurra de una web que mencione a la tuya.

Prevenir el Hotlinking

Uno de los usos más clásicos —pero a la vez más infravalorados— del referrer es la prevención del hotlinking, es decir, evitar que terceros carguen directamente recursos de tu web (principalmente imágenes, vídeos o PDFs) desde sus propias páginas.

El hotlinking tiene dos impactos claros:

  • Consumo innecesario de recursos del servidor (ancho de banda, peticiones, CPU).
  • Pérdida de control del contexto en el que se muestra tu contenido (marca, anuncios, UX).

Aquí es donde el referrer se convierte en una herramienta extremadamente útil y limpia, ya que permite saber desde qué dominio se está solicitando un recurso, sin necesidad de JavaScript, cookies ni consentimiento de usuario.

¿Cómo funciona a nivel conceptual?

Cuando un navegador carga una imagen (<img>), un vídeo (<video>) o cualquier otro recurso, envía el encabezado HTTP Referer indicando desde qué página se está realizando la petición.

  • Si el recurso se carga desde tu propia web, el referrer será tu dominio.
  • Si se carga desde una web externa, el referrer será ese dominio externo.
  • Si no hay referrer (por ejemplo, noreferrer o accesos directos), también puedes detectarlo.

Con esta información puedes aplicar lógica condicional a nivel de servidor.

Formas de usar el Referrer para evitar el Hotlinking

Algunas de las estrategias más comunes y efectivas son:

1. Bloquear directamente la carga del recurso

Si el referrer no pertenece a tu dominio ni a una whitelist, puedes devolver:

  • 403 Forbidden
  • 404 Not Found
  • 204 No Content (Ahora hablamos de ello)

Esto evita que el recurso se muestre fuera de tu web.

2. Sustituir el recurso por otro

En lugar de bloquear, puedes:

  • Mostrar una imagen alternativa (por ejemplo, un banner con tu marca).
  • Mostrar una imagen con menor calidad o pixelada.
  • Mostrar un mensaje tipo “Imagen protegida. Visita el sitio original”.

Esta opción es interesante cuando quieres mantener visibilidad de marca incluso en casos de uso indebido.

3. Permitir solo ciertos referrers (whitelist)

Puedes permitir explícitamente:

  • Tu dominio y subdominios.
  • Partners concretos.
  • Herramientas específicas (por ejemplo, Google Images, redes sociales, etc.).

Esto es especialmente útil cuando colaboras con otros medios o cuando necesitas que ciertos recursos se embeban legítimamente.

Limitar la calidad de imagen en Google imágenes

Si alguna vez has intentado copiar o descargar una imagen desde Google y, a pesar de haber filtrado por tamaño grande, la calidad era mediocre, pero al acceder a la web de origen la imagen se veía perfectamente, no se trataba de un error ni de una casualidad: era algo hecho de forma deliberada.

Es una práctica permitida por Google y se hace parecido al hotlinking pero decretando un 204 en las imágenes cuando el referrer es de Google.

Aquí podemos ver un ejemplo práctico de como queda:

Limitando la calidad de imagen en Google imágenes con referrer

Ejemplo de cómo limitar la calidad de imagen en Google imágenes con referrer

Es la misma imagen, pero a la izquierda vemos la original y a la derecha el resultado en Google Images.

En este caso tiene bastante sentido, porque así el usuario se ve forzado a entrar en la web e incluso tener que visualizar los anuncios para ver el contenido que se busca en la web.

Te dejo una guía de cómo pixelar las imágenes en Google Images si quieres saber como hacer la implementación técnica.

Reflexiones finales

El referrer (o referer, cuando nos referimos al encabezado HTTP) informa a la página de destino cuál fue la página de origen del usuario, es decir, de dónde vino.

Si bien la página de origen puede evitar que se envíe este dato, cuando lo recibimos podemos darle distintos usos tal y como hemos visto en el artículo, por ejemplo:

  • SEO & IA: Identificar qué LLMs (ChatGPT, Perplexity) están enviando tráfico real.
  • UX: Personalizar mensajes tras una migración o compra de dominios.
  • Analítica: El uso tradicional que nos puede servir para saber qué campañas nos están funcionando.
  • Conversión: Ofrecer descuentos dinámicos según la web de procedencia.
  • WPO / Seguridad: Evitar el robo de ancho de banda (Hotlinking) y proteger activos.

Y el mejor uso que le puedes dar es con tu imaginación y el contexto de las necesidades del proyecto. La información es poder y lo que te ofrece el referrer es la información de donde viene el usuario.