La mayoría cree que basta con inyectar código: el error silencioso del SEO en Framer

En noviembre del año pasado me tocó revisar el sitio de una marca de suplementos que vendía bastante bien. Su diseñador había montado todo en Framer en tiempo récord: animaciones fluidas, tipografía impecable, una tasa de conversión decente en desktop. Pero tenían un problema que no entendían: Google Search Console les marcaba errores críticos en 240 URLs de producto. Llevaban 41 días perdiendo las estrellas de valoración y los precios destacados en los resultados de búsqueda. El tráfico orgánico se les había caído un 28%.

Cuando abrí la configuración del proyecto, vi exactamente lo que me esperaba. En la sección de "Custom Code" del CMS habían pegado un bloque de texto plano con la etiqueta <script type="application/ld+json">, rellenando variables a mano. Parecía limpio a simple vista. Pero bastaba con que el título de un producto tuviera comillas dobles (por ejemplo, para indicar pulgadas o mililitros) o que la descripción incluyera un salto de línea para que todo el JSON se rompiera en pedazos al renderizar en el navegador.

Ese es el mito: creer que estructurar datos en Framer es un simple trabajo de copiar y pegar.

Por qué el "copiar y pegar" falla silenciosamente

Framer no es WordPress ni un motor estático tradicional. Es una aplicación React que renderiza en el cliente y genera páginas optimizadas al compilar. Cuando ustedes inyectan código JSON-LD directamente en el head o en un campo de texto enriquecido del CMS sin sanitizar, están jugando a la ruleta rusa con los algoritmos de Google.

El parser de JSON es implacable. No perdona. Una coma extra al final de un arreglo, un caracter especial no escapado en el nombre de una variante, o un campo de precio que llega vacío porque el editor olvidó llenarlo en el CMS, y el bot de Google simplemente descarta todo el bloque de datos estructurados. Lo peor de todo: su sitio no se va a caer. Visualmente se verá perfecto. No hay pantallas rojas ni alertas visibles para el usuario. Solo descubren que algo está mal semanas después, cuando sus fichas enriquecidas desaparecen de las SERPs.

He visto a decenas de fundadores convencerse de que "ya tienen SEO técnico" porque leyeron un hilo en Twitter y pegaron una plantilla básica de Schema.org en los ajustes de página. La realidad técnica es otra.

Lo que exige un esquema real de Product y FAQPage

Implementar correctamente una arquitectura de JSON LD Framer Product FAQPage requiere entender cómo dialogan los bots con su contenido dinámico. Google no solo busca que el código sea sintácticamente válido; exige campos obligatorios específicos que cambian según el tipo de entidad.

Para un esquema de Product, no basta con poner el nombre y el precio:

Si no incluyen el objeto offers con su respectiva priceCurrency, el estado de disponibilidad (InStock o OutOfStock), y un identificador único como SKU o gtin13, Google Search Console les va a arrojar advertencias que tarde o temprano degradan la visibilidad del snippet. Si además manejan reseñas, el cálculo de aggregateRating debe coincidir de forma exacta con lo que el usuario ve en pantalla; de lo contrario, se exponen a penalizaciones manuales por datos estructurados engañosos.

Con las preguntas frecuentes pasa algo similar. Un esquema FAQPage mal estructurado —por ejemplo, metiendo HTML sucio dentro del campo acceptedAnswer.text o creando entidades individuales separadas en lugar de un único nodo con una lista ordenada de entidades principales— es ignorado casi de inmediato por los rastreadores.

La solución no es más texto: son componentes de código

Después de reparar el mismo error en ocho proyectos diferentes, entendí que no podíamos seguir confiando en que un editor de contenido recordara escapar comillas o no dejar campos vacíos en el CMS. La solución limpia en Framer es construir componentes de código (React Code Components) dedicados exclusivamente a la generación de metadatos.

Un componente bien hecho hace tres cosas en segundo plano antes de escupir una sola línea de código al DOM:

Primero, toma las propiedades directamente desde las variables del CMS o los controles visuales de Framer y las sanitiza. Convierte caracteres conflictivos, limpia espacios invisibles y formatea los números con los decimales que el estándar ISO exige.

Segundo, valida dependencias. Si un producto no tiene definida una moneda, el componente previene la inyección de un bloque incompleto y emite una advertencia clara en el entorno de desarrollo en lugar de enviar basura a producción.

Tercero, inyecta el script mediante React Helmet o manipulando el document.head en el ciclo de vida correcto, asegurando que el contenido esté disponible tanto para los bots que procesan JavaScript como para los motores de búsqueda que solo leen el HTML inicial.

Dejen de improvisar con su visibilidad

El SEO técnico no es magia negra, pero sí es ingeniería de precisión. Si están operando una tienda seria o una startup con contenido educativo en Framer, tratar la capa de datos estructurados como un detalle secundario les está costando clics todos los días frente a competidores en Shopify o Webflow que ya tienen esto resuelto de fábrica.

Cuando alguien me contrata en mi rol de framer jsonld freelance en GuardLabs, lo primero que hago es auditar esas inyecciones manuales. Desarrollamos un componente especializado con validador integrado para asegurar que cada propiedad requerida esté en su lugar antes de publicar. Si necesitan resolver esto de raíz y dejar su sitio blindado para buscadores y agentes de IA, pueden revisar nuestro servicio de JSON-LD разметка для сайта на Framer (Product, FAQPage).