La web de Next.js generada con IA: por qué resulta familiar y qué se renderiza dónde

Next.js es un framework, no un diseño. El aspecto familiar viene de lo que se le pone encima por defecto.

• El mismo stack de arranque. Next.js con Tailwind y shadcn/ui es la respuesta más habitual de un modelo, así que los componentes, el espaciado y el radio se repiten de un sitio a otro.
• Restos de la plantilla de arranque. La fuente de la plantilla, un título genérico y una descripción vacía llegan a producción sorprendentemente a menudo.
• Una sola landing para todo. Una única ruta carga con todo el discurso, escrito para un visitante medio, en lugar de una página por cada pregunta que la gente hace de verdad.
• La voz media de cualquier SaaS: «Publica más rápido», «Pensado para equipos modernos», «Empieza gratis». Correcto, inobjetable y presente en todas las demás páginas.

Cada uno de estos se arregla en unos minutos en el código.

IntentGrid reescribe las palabras que lee un visitante: titulares, cuerpo de texto, descripciones de funciones y etiquetas de los botones, según cómo llegó ese visitante (fuente de tráfico, campaña, ciudad aproximada, dispositivo, idioma, hora local). Adapta el texto que ya renderizas, y los nombres de marca, los precios, las fechas y las cifras se quedan como están escritos.

No toca tu repositorio, tus componentes, tu build ni tu caché, y no necesita ninguna integración de framework. No cambia el diseño y no es una fuente de tráfico.

La parte que funciona hoy es una demo que muestra una copia reescrita de cualquier URL pública en un espacio aislado en intentgrid.ai; la adaptación en tu propio dominio es acceso anticipado y se configura sitio por sitio, a mano. Cómo funciona explica la diferencia.

En el App Router, las páginas son componentes de servidor por defecto y se renderizan en el servidor o se prerrenderizan en el momento del build. Los componentes marcados con “use client” también se renderizan primero a HTML en el servidor y se vuelven interactivos después, en el navegador. Así que en la mayoría de las páginas de Next.js el texto está en la respuesta HTML, y la demo puede reescribirlo.

Las excepciones importan tanto a los rastreadores como a la demo: texto que se descarga en el navegador después de que cargue la página, componentes cargados con el renderizado en el servidor desactivado y contenido que solo se renderiza tras un clic. La demo elimina los scripts y ve la página tal como llega al principio, que es más o menos lo que ve también un rastreador que no ejecuta JavaScript.

Puedes hacerte tú una versión de esto. Lee el parámetro de consulta utm_source en la página, asigna un titular a cada una de tus dos o tres fuentes principales y recurre a la versión por defecto para todos los demás, en la misma URL. Los rastreadores llegan sin el parámetro y reciben la versión por defecto.

Ten claro lo que cuesta. Leer parámetros de consulta hace que esa página se renderice en cada petición en lugar de servirse como un archivo ya construido, algo que está bien para una landing pero que conviene hacer a propósito. Y cada variante es texto que ahora mantienes a mano. Ese es el punto en que una herramienta se gana su sitio, y no antes.

Misma maquetación, mismos precios, mismas afirmaciones. Cada versión usa únicamente lo que ya dice la página original: en este caso inventado, la instalación con una etiqueta script, un archivo de configuración y menos tickets de soporte como objetivo declarado.

Son cambios de código, así que puedes hacerlos con la misma herramienta de IA que construyó el sitio.

• Cambia el tema de shadcn/ui. Modifica las variables CSS de color y radio para que los componentes dejen de parecerse a los de todo el mundo.
• Sustituye la fuente de la plantilla de arranque con next/font, y define un título y una descripción reales por ruta con la API de metadatos.
• Divide la página larga. Dale a cada pregunta real su propia ruta con su propio título, para que los buscadores y los motores de respuestas puedan aterrizar en la respuesta concreta.
• Guarda el texto en un solo archivo de contenido, separado del JSX, para que cambiar palabras sea una edición rápida y no una búsqueda del tesoro.
• Comprueba el renderizado con curl. Descarga tu URL desde la terminal y busca tu titular en la salida. Si no está, algo se está renderizando solo en el navegador.

La mitad de diseño, y por qué todas las herramientas de IA acaban en estos valores por defecto, se explican en por qué los sitios vibe coded se parecen.