hreflang en Framer paso a paso: guía para que Google acierte
Cómo añadir hreflang en Framer paso a paso para que Google muestre el idioma correcto de tu web. Guía práctica con el método manual y la forma automática.
Has traducido tu web de Framer a varios idiomas y todo se ve perfecto. Pero pasan las semanas y Google sigue mostrando la versión en español a gente de Francia, o directamente ignora tus otras versiones. Falta una pieza: hreflang.
hreflang es la etiqueta que le dice a Google qué versión de tu página mostrar según el idioma de cada visitante. Sin ella, tu esfuerzo de traducción se queda a medias: el contenido existe, pero Google no sabe conectarlo. En esta guía te explico, paso a paso, cómo añadir hreflang en Framer —tanto a mano como de forma automática— para que cada idioma llegue a quien le corresponde.
Resumen rápido
- hreflang es una etiqueta HTML que indica a Google qué versión idiomática mostrar; sin ella, muestra el idioma equivocado o ignora tus traducciones.
- En Framer se puede añadir a mano, insertando código en el
<head>de cada página desde los ajustes de la página. - El método manual funciona, pero no escala: cada página y cada idioma nuevo multiplica el trabajo y el riesgo de errores.
- Las tres reglas de oro: reciprocidad (todas las versiones se apuntan entre sí), URLs absolutas y códigos de idioma correctos (ISO).
- Lo más fiable es automatizarlo: Lantis añade hreflang, URLs por idioma y sitemaps automáticos en cualquier web de Framer desde 2 €/mes por idioma.
Qué es hreflang y por qué Framer lo necesita
hreflang es una etiqueta que va en el <head> de cada página y le dice a Google: "esta página tiene versiones en otros idiomas, y están en estas URLs". Es un mapa que evita que Google se confunda entre tus idiomas.
Framer es una herramienta excelente para diseñar, pero no nace pensada como CMS multilingüe. Cuando montas varios idiomas —ya sea duplicando páginas, usando el CMS o una capa externa—, Google necesita que le expliques la relación entre esas versiones. Si no lo haces, pasan tres cosas malas:
- Muestra el idioma equivocado: alguien busca en francés y le sale tu página en español.
- Interpreta contenido duplicado: dos páginas parecidas sin conexión declarada pueden competir entre sí o diluir tu posicionamiento.
- Ignora idiomas enteros: si Google no encuentra el mapa, puede no indexar bien tus versiones traducidas.
Sin hreflang, traducir tu web es como abrir tiendas en varios países pero no poner ningún cartel que indique en qué idioma atiende cada una.
Que los buscadores prioricen la experiencia en el idioma del usuario no es un capricho técnico: según el CSA Research (informe Can't Read, Won't Buy), el 76 % de los compradores online prefiere comprar productos con información en su propio idioma, y el 40 % no compra en webs en otros idiomas. hreflang es lo que asegura que ese usuario aterrice en la versión correcta.
Cómo funciona hreflang (las reglas que no puedes saltarte)
Antes de tocar Framer, interioriza tres reglas. Si fallas en una, hreflang deja de funcionar.
1. Reciprocidad
Todas las versiones deben apuntarse entre sí. Si tu página en español enlaza a la francesa, la francesa tiene que enlazar de vuelta a la española (y a todas las demás). Es un acuerdo mutuo: si una versión no confirma la relación, Google la descarta.
2. URLs absolutas
Usa siempre la URL completa, con https:// y dominio incluido (https://tuweb.com/fr/), nunca rutas cortas como /fr/. hreflang no admite atajos.
3. Códigos de idioma correctos
Usa los códigos ISO estándar: es para español, en para inglés, fr para francés, de para alemán. Puedes afinar por país (es-MX, en-GB) solo si de verdad tienes contenido distinto por región. Y añade siempre una línea x-default para los usuarios cuyo idioma no coincide con ninguno: será tu versión "por defecto".
Un bloque hreflang bien formado en el <head> se parece a esto:
<link rel="alternate" hreflang="es" href="https://tuweb.com/" />
<link rel="alternate" hreflang="en" href="https://tuweb.com/en/" />
<link rel="alternate" hreflang="fr" href="https://tuweb.com/fr/" />
<link rel="alternate" hreflang="x-default" href="https://tuweb.com/" />
Método manual: añadir hreflang en Framer paso a paso
Se puede hacer a mano desde el propio Framer. Es viable para webs pequeñas y pocos idiomas. Estos son los pasos:
- Ten claras tus URLs por idioma. Anota la URL absoluta de cada versión de cada página (home, sobre nosotros, contacto…). Necesitarás todas para escribir los bloques.
- Abre los ajustes de la página en Framer. Selecciona la página, ve a su configuración y busca la sección para insertar código personalizado en el
<head>(Custom Code / End of<head>tag a nivel de página). - Pega el bloque hreflang de esa página. Incluye una línea
<link rel="alternate" hreflang="…">por cada idioma, más la líneax-default. Usa URLs absolutas. - Repite en la versión de cada idioma. La misma página en francés necesita su propio bloque, apuntando a todas las versiones (incluida la española). Aquí es donde entra la regla de reciprocidad.
- Repite para todas las páginas del sitio. Cada página distinta necesita su propio conjunto de bloques, con sus propias URLs.
- Publica y verifica. Publica el sitio y comprueba con la herramienta de inspección de URLs de Google Search Console que las etiquetas se leen bien.
El problema del método manual
Funciona, pero no escala. Piénsalo: si tienes 10 páginas y 4 idiomas, son 40 bloques hreflang que mantener a mano, cada uno con varias líneas. Cada página nueva y cada idioma nuevo multiplican el trabajo. Y un solo error —una URL relativa, un código mal escrito, una versión que no devuelve el enlace— rompe la reciprocidad y Google lo ignora en silencio. No te avisa; simplemente no funciona.
Por eso el método manual solo tiene sentido en sitios muy pequeños y estables. En cuanto tu web de Framer crece, mantener hreflang a mano se convierte en una fuente constante de errores difíciles de detectar.
Método automático: dejar que hreflang se genere solo
La forma fiable de tener hreflang en Framer es automatizarlo con una capa multilingüe que lo genere por ti en cada página. Es lo que hace Lantis: pegas una línea de código en tu web de Framer y, a partir de ahí, cada idioma tiene su URL propia (/fr/, /de/…), su hreflang correcto y su entrada en el sitemap, sin que toques una sola etiqueta.
Esta tabla resume las diferencias:
| Aspecto | hreflang manual en Framer | hreflang automático (Lantis) |
|---|---|---|
| Esfuerzo inicial | Alto: bloque por página e idioma | Mínimo: una línea de código |
| Al añadir un idioma | Editar todas las páginas | Automático |
| Al añadir una página | Escribir sus bloques a mano | Automático |
| Riesgo de error | Alto (reciprocidad, URLs, códigos) | Muy bajo |
| Sitemaps por idioma | Manual | Automáticos |
| Coste | Tu tiempo | Desde 2 €/mes por idioma |
La ventaja no es solo la comodidad. Es que eliminas la categoría entera de errores que hacen que Google ignore tus idiomas: reciprocidad rota, URLs relativas, códigos mal escritos. Si quieres profundizar en el concepto, tenemos una guía dedicada a hreflang explicado fácil, y otra sobre cómo traducir tu web de Framer de principio a fin.
Preguntas frecuentes
¿Cómo se añade hreflang en Framer?
En Framer, hreflang se puede añadir manualmente insertando etiquetas <link rel="alternate" hreflang="…"> en el código personalizado del <head> de cada página, desde los ajustes de esa página. Hay que incluir una línea por cada idioma más una x-default, usar URLs absolutas y asegurarse de que todas las versiones se enlazan entre sí (reciprocidad). Para webs con varias páginas o idiomas, lo más fiable es automatizarlo con una herramienta como Lantis, que genera el hreflang correcto en cada página sin trabajo manual.
¿Framer añade hreflang automáticamente?
Framer no genera etiquetas hreflang multilingües de forma automática por sí solo: si montas los idiomas a mano, también tienes que gestionar el hreflang a mano. Para que se genere solo —con su URL por idioma, hreflang recíproco y sitemap—, necesitas una capa multilingüe como Lantis, que se conecta a tu web de Framer con una línea de código y lo produce automáticamente en cada página.
¿Qué pasa si mi hreflang está mal configurado?
Si hreflang está mal, Google simplemente lo ignora sin avisar: puede mostrar el idioma equivocado a tus visitantes, tratar tus traducciones como contenido duplicado o no indexar bien tus versiones. Los errores más comunes son romper la reciprocidad (una versión no enlaza de vuelta), usar URLs relativas en lugar de absolutas y escribir mal los códigos de idioma. Automatizar la generación de hreflang evita estos tres fallos de raíz.
Conclusión
hreflang es la pieza que convierte tu web de Framer traducida en una web realmente multilingüe a ojos de Google. A mano es posible, pero solo compensa en sitios pequeños: en cuanto sumas páginas o idiomas, el mantenimiento se dispara y un error silencioso puede tirar por tierra todo tu SEO internacional.
Si prefieres olvidarte del tema, Lantis añade hreflang, URLs por idioma y sitemaps automáticos a cualquier web de Framer con una sola línea de código, desde 2 €/mes por idioma. Empieza gratis y deja que Google muestre el idioma correcto a cada visitante desde el primer día.
Pon tu web en varios idiomas hoy.
Una línea de código. SEO real por idioma. Traducción con IA. Sin tarjeta para empezar.