Llevo más de una década metido hasta el cuello en el mundo del SEO y el copywriting, y si hay algo que he aprendido es que los detalles más pequeños son los que marcan la diferencia. Uno de esos detalles, que parece una tontería técnica pero que tiene unas implicaciones brutales en la experiencia de usuario (UX), la seguridad y hasta en el SEO, es el famoso target="_blank" en los enlaces.
Muchos lo usan sin pensar, como un automatismo. «Enlace que va fuera de mi web, pues le pongo que abra en pestaña nueva y listo». Pero, ojo, porque detrás de esa simple línea de código hay mucho más de lo que parece. He visto a clientes perder tráfico y hasta crear brechas de seguridad por no entender bien cómo y, sobre todo, cuándo usarlo. Por eso, hoy te voy a contar todo lo que necesitas saber sobre el target="_blank", sin tecnicismos absurdos y yendo al grano, para que lo uses como un auténtico profesional.
Lo que aprenderás en este artículo:
- Cuándo usar target=»_blank» (y cuándo es un error) – Mi checklist personal para que decidas en 5 segundos si un enlace debe abrir en pestaña nueva o no.
- El riesgo de seguridad del que casi nadie habla – Cómo un simple enlace puede dejar tu web vulnerable y la solución obligatoria que debes aplicar siempre.
- Mitos y realidades sobre su impacto en SEO – Te explico claro si de verdad afecta a tu posicionamiento y cómo lo interpretan las métricas.
- Cómo implementarlo correctamente paso a paso – Guía práctica para añadirlo en HTML y en el editor de WordPress sin liarla.
¿Qué es exactamente un enlace con target=»_blank»?
Vamos a empezar por lo más básico para que estemos en la misma página. En el lenguaje HTML, que es el esqueleto de cualquier web, un enlace se crea con la etiqueta <a>. El atributo href le dice al navegador a qué URL debe ir. Por su parte, el atributo target le indica *dónde* debe abrir esa URL.
Por defecto, si no especificas nada, un enlace se abre en la misma pestaña (es como si tuviera un target="_self"). Cuando añades target="_blank", le estás dando una orden muy clara al navegador: «Oye, abre esta URL en una pestaña o ventana completamente nueva».
El código se vería así de simple:
<a href="https://ejemplo.com" target="_blank">Este enlace se abre en una pestaña nueva</a>
Hasta aquí, todo fácil. El problema es que esta decisión, que parece trivial, cambia por completo la navegación del usuario. Y ahí es donde empieza el lío.
La gran pregunta: ¿cuándo usar target=»_blank» y cuándo no?
En el sector lo tenemos bastante claro, aunque siempre hay debate. Mi regla de oro es muy sencilla: piensa en no romper el flujo del usuario. La gente espera un comportamiento predecible. Si le rompes la navegación sin un buen motivo, lo estás frustrando.
Situaciones donde SÍ recomiendo usarlo
Hay casos muy concretos en los que abrir una pestaña nueva es la mejor opción para el usuario. Aquí te dejo mi lista:
- Enlaces a documentos (PDF, DOCX, etc.): Si enlazas a un archivo descargable, es una faena que al hacer clic se reemplace tu página por una pantalla de descarga. Abrirlo en una nueva pestaña permite que el usuario gestione el archivo sin perder el hilo de lo que estaba leyendo.
- Enlaces que interrumpen un proceso: Imagina que un usuario está rellenando un formulario largo (un checkout, un registro) y hay un enlace a los «Términos y Condiciones». Si ese enlace se abre en la misma pestaña, perderá todos los datos introducidos. Un desastre. Aquí, el
target="_blank"es tu salvavidas. - Contenido secundario o de referencia: Si estás escribiendo un artículo y enlazas a una fuente externa para que el usuario consulte un dato específico, tiene sentido que lo haga en una nueva pestaña para poder volver fácilmente a tu contenido principal.
- Enlaces a herramientas o reproductores: Si desde tu web enlazas a un reproductor de música, un vídeo de YouTube a pantalla completa o una herramienta online, lo lógico es que se abra aparte para no interrumpir la experiencia en tu sitio.
Momentos en los que DEBES evitarlo
La regla general es: para la navegación interna de tu web, NUNCA uses target="_blank". He visto webs donde al hacer clic en «Contacto» o en un post del blog relacionado se abre una pestaña nueva. Es un cristo. El usuario acaba con 15 pestañas de la misma web abiertas y no sabe ni dónde está.
Darle el control al usuario es clave. Si quiere abrir un enlace interno en una nueva pestaña, ya sabe cómo hacerlo (clic derecho, rueda del ratón, etc.). No fuerces un comportamiento que rompe la navegación estándar. Es malo para la UX y para la accesibilidad.
El lado oscuro del target=»_blank»: seguridad y SEO
Aquí viene la parte que el 90% de la gente desconoce y que, como consultor SEO, me toca arreglar una y otra vez. Usar target="_blank" sin más, crea una vulnerabilidad de seguridad conocida como «tabnabbing».
La vulnerabilidad que muchos ignoran: el «tabnabbing»
Cuando abres una página en una nueva pestaña con target="_blank", esa nueva página tiene acceso a la página original a través de un objeto de JavaScript llamado window.opener. Esto es un peligro brutal.
Un atacante podría controlar la página a la que enlazas y usar ese acceso para redirigir tu página original (la que el usuario dejó atrás) a una web falsa de phishing. Por ejemplo, una imitación de la página de login de tu banco o de tu correo. Como el usuario confía en tu web, es muy probable que caiga en la trampa.
La solución: rel=»noopener noreferrer», tu mejor amigo
Por suerte, la solución es increíblemente sencilla. Solo tienes que añadir dos atributos más a tu etiqueta de enlace: rel="noopener noreferrer".
El código correcto y seguro siempre es este:
<a href="https://ejemplo.com" target="_blank" rel="noopener noreferrer">Este es un enlace seguro</a>
rel="noopener": Impide que la nueva pestaña pueda acceder al objetowindow.opener, bloqueando en seco el riesgo de tabnabbing.rel="noreferrer": Evita que la nueva página sepa de dónde viene el tráfico. Es una medida extra de privacidad y seguridad.
Ojo, esto es tan importante que los sistemas modernos como WordPress lo añaden automáticamente cuando marcas la opción de «Abrir en una pestaña nueva». Pero si tocas código a mano, es tu responsabilidad añadirlo siempre.
¿Y qué pasa con el SEO? Mitos y realidades
Existe el mito de que usar target="_blank" es malo para el SEO. La verdad es que no tiene un impacto directo en el ranking. Google no te va a penalizar por usarlo.
Sin embargo, sí tiene un impacto indirecto a través de las métricas de usuario. Por ejemplo, al abrir enlaces externos en una nueva pestaña, es probable que tu tasa de rebote baje y el tiempo en página aumente, porque el usuario no abandona tu sitio. Esto, en principio, son buenas señales para Google Analytics, pero no te obsesiones. Lo más importante es la experiencia del usuario real, no maquillar números. Un buen SEO se basa en una buena UX, y no al revés.
Cómo implementarlo correctamente (y sin liarla)
Vamos a la práctica. Aquí tienes el paso a paso para hacerlo bien.
En HTML puro
Simplemente escribe la etiqueta completa, asegurándote de incluir todos los atributos. Recuerda, este es el formato a prueba de balas:
<a href="URL_DESTINO" target="_blank" rel="noopener noreferrer">Texto del enlace</a>
En WordPress (el modo fácil)
Si usas el editor de bloques de WordPress (Gutenberg), el proceso es súper sencillo y seguro:
- Selecciona el texto que quieres convertir en enlace y haz clic en el icono de enlace.
- Pega la URL de destino.
- Haz clic en el icono de la flecha o en los tres puntos para abrir las opciones avanzadas.
- Activa el interruptor que dice «Abrir en una nueva pestaña».
Y ya está. Como te decía, WordPress es lo suficientemente listo como para añadir automáticamente el rel="noopener noreferrer" por ti. Así que puedes estar tranquilo.
Para que lo tengas todo aún más claro, te he preparado una tabla resumen con mis recomendaciones para distintos escenarios.
| Tipo de Enlace | ¿Usar target=»_blank»? | Atributos Completos Recomendados | La razón (el porqué) |
|---|---|---|---|
| Enlace a otra página de tu web | NO | <a href="/contacto"> |
Mantiene un flujo de navegación natural y predecible. No secuestres el navegador del usuario. |
| Enlace a una web externa (fuente) | SÍ | <a href="..." target="_blank" rel="noopener noreferrer nofollow"> |
Permite al usuario consultar la fuente sin perder tu artículo. Añado «nofollow» si es un enlace no editorial. |
| Enlace a un PDF o documento | SÍ | <a href="..." target="_blank" rel="noopener noreferrer"> |
Evita que la descarga del archivo reemplace la página actual, mejorando drásticamente la UX. |
| Enlace a «Términos» en un formulario | SÍ | <a href="..." target="_blank" rel="noopener noreferrer"> |
Es crítico para que el usuario no pierda los datos que ya ha rellenado en el formulario. |
Mi consejo final: piensa siempre en el usuario
Lo que debes llevarte claro de todo esto es que el uso de target="_blank" no es una decisión técnica, sino estratégica. Antes de añadirlo, hazte una simple pregunta: «¿Esto ayuda al usuario o le va a liar más?».
Si la respuesta es que le ayuda a mantener el contexto, a no perder un proceso o a gestionar un archivo, adelante. Si es por un capricho o porque crees que así «retienes» más tiempo al usuario, te estás equivocando de lleno. El control siempre debe tenerlo la persona que navega.
Y, por favor, grábate a fuego el rel="noopener noreferrer". Cada vez que escribas target="_blank", tu cerebro debe añadirlo automáticamente. Es una cuestión de higiene y seguridad básica para tu web y para tus usuarios.
Preguntas que siempre me hacen sobre el target=»_blank»
¿Afecta el «target=_blank» a la tasa de rebote?
Sí, la afecta directamente. Si un usuario llega a una página, hace clic en un enlace externo que se abre en una nueva pestaña y luego cierra tu página sin interactuar más, técnicamente no cuenta como rebote. Esto puede maquillar tus métricas, haciendo que tu tasa de rebote parezca más baja de lo que realmente es. Por eso te digo que no te obsesiones con ese KPI y te centres en la experiencia global.
¿Y qué pasa con el atributo rel=»nofollow»? ¿Debo usarlo también?
Son cosas distintas. nofollow es una directriz para los motores de búsqueda que les indica que no traspasen «autoridad» a la página enlazada. Lo debes usar para enlaces de afiliados, publicidad o contenido que no respaldas editorialmente. Puedes combinarlo sin problema: rel="noopener noreferrer nofollow".
¿Es malo para la accesibilidad web usar target=»_blank»?
Puede serlo si no se avisa al usuario. Para personas que usan lectores de pantalla, un cambio de contexto tan brusco puede ser muy desorientador. Las guías de accesibilidad (WCAG) recomiendan indicar visualmente (por ejemplo, con un icono) y en el texto del enlace que se abrirá en una nueva ventana para que no haya sorpresas.
¿Puedo hacer que todos mis enlaces externos se abran en una nueva pestaña automáticamente?
Técnicamente, sí, se puede hacer con JavaScript. En mi opinión, es una mala práctica. Automatizar esto te quita el control granular para decidir qué es lo mejor en cada contexto. Es mejor tomar la decisión de forma manual para cada enlace. Te llevará un segundo más y el resultado será mucho mejor.
