Diseño web + SEO con IA

Este sitio: construir un sitio de agencia para la era de la IA con un grafo de entidades completo

El caso de estudio más inspeccionable que una agencia puede publicar es su propio sitio web, porque lo estás mirando justo ahora. Reconstruimos optimoweb.net como un sitio estático en Astro de 102 páginas con paridad total inglés/español en todo el funnel, un grafo de entidades JSON-LD en cascada enraizado en un único nodo Organization, y manifiestos llms.txt para crawlers de IA. Resultados medidos: Lighthouse performance 100, largest contentful paint 1,0 s, y bytes en cable −70% mediante gzip, revalidación ETag y caché por niveles.

OptimoWeb LLC Actualizado 8 de julio de 2026

De un vistazo

Los números reales.

MétricaNúmero
Páginas estáticas construidas (paridad total EN/ES, hreflang recíproco)102
Hubs de área de servicio por ubicación con contexto de mercado por ciudad27
Hubs de industria / guías pilar / comparaciones de competidores7 / 8 / 5
Tarjetas sociales 1200×630 de marca generadas en build102 (una por página)
Puntaje de performance en Lighthouse100
Largest contentful paint1,0 s
Bytes en cable tras gzip + ETag + caché por niveles−70%

Todos los números son de primera mano — medidos en nuestra propia build, no estimados.

El punto de partida

El sitio de una agencia es un sitio de marketing: el contenido cambia cuando nosotros decidimos que cambie, nadie inicia sesión y no hay carrito. Ese perfil es justo donde una build totalmente estática gana — sin base de datos que atacar, sin stack de plugins que parchear, nada dinámico que ralentice. Es también el perfil donde la búsqueda cambia más rápido: los asistentes de IA y los AI Overviews de Google responden cada vez más sin un clic, así que el sitio tenía que construirse para ser citado, no solo rankeado — la tesis de nuestra guía de SEO en la era de la IA y del servicio de SEO con IA del que proviene.

La otra restricción era la transparencia sobre el alcance: esta es la misma arquitectura que vendemos como diseño y desarrollo web, así que tiene que demostrar el playbook, no solo describirlo — la diferencia que exponemos en OptimoWeb vs una agencia tradicional.

El enfoque

El sitio es dirigido por datos, no construido a mano página por página. Servicios, ubicaciones, industrias, guías, comparaciones y precios viven cada uno en archivos de contenido tipados; las plantillas de Astro los renderizan en páginas hub completas en tiempo de build. La consistencia en enlaces internos, migas de pan y schema es por tanto una propiedad de la arquitectura, no una propiedad de la diligencia — cada una de las 102 páginas recibe el mismo tratamiento porque sale de la misma fuente de verdad.

  • Paridad total de locale: todo el funnel — servicios, precios, ubicaciones, industrias, guías, comparaciones — existe tanto en inglés como en español, con hreflang recíproco en cada par. No una traducción de última hora; la misma profundidad en ambos idiomas.
  • 27 hubs de ubicación con contexto de mercado real por ciudad (16 metros de EE. UU., 11 ciudades colombianas), no texto genérico con la ciudad cambiada.
  • 7 hubs de industria, 8 guías pilar, 5 comparaciones de competidores — cada una una página completa con FAQ, rieles de enlaces internos y schema.
  • Un hub de precios con schema OfferCatalog, para que los paquetes sean legibles por máquina — ver precios.
  • Un mega menú CSS-first: paneles hover construidos con enlaces <a> reales y rastreables, sin JavaScript requerido para navegar.

El stack

  • Astro, salida estática — cada página pre-renderizada a HTML en tiempo de build.
  • Archivos de contenido tipados que alimentan plantillas hub (servicios, ubicaciones, industrias, guías, comparaciones, casos de estudio).
  • Un grafo de entidades JSON-LD en cascada desde una única raíz Organization con @id: nodos Service con areaServed, WebPage con Speakable, BreadcrumbList y FAQPage en cada página que muestra una FAQ visible.
  • Generador de tarjetas sociales en build — 102 tarjetas og:image 1200×630 de marca, una por página, renderizadas durante el build.
  • llms.txt + llms-full.txt — manifiestos en texto plano que dan a los crawlers de IA un mapa limpio y factual del negocio.
  • Capa de entrega: pre-compresión gzip, revalidación ETag/304, Cache-Control por niveles — sobre nuestra propia infraestructura self-hosted.
  • Formulario de contacto por correo self-hosted — sin servicio SaaS de formularios en el circuito.

Lo que entregamos

La capa medible, sobre la build en vivo: Lighthouse performance 100, largest contentful paint de 1,0 s, y bytes en cable −70% tras la pasada de entrega — las métricas que explicamos para no desarrolladores en Core Web Vitals para dueños de negocio. Cada página trae su propia tarjeta social de marca, así que nada se comparte como un rectángulo gris. Y todo esto cuesta lo que cuesta el hosting estático — la forma de propiedad de la guía de la matemática a 5 años, aplicada a nosotros mismos. Lo que una build como esta le cuesta a un cliente se detalla con transparencia en cuánto cuesta realmente una página web en 2026.

La regla que aplicamos en este sitio y en cada build de cliente: el schema nunca reclama lo que la página no dice visiblemente. Sin calificaciones inventadas, sin reseñas fantasma. El marcado FAQPage de esta página es la FAQ que puedes leer abajo — ese es todo el truco.

El trade-off realista: un sitio estático implica un rebuild por cada cambio de contenido. Para un sitio que editamos por git de todas formas, eso no cuesta nada. Para un equipo de marketing que publica a diario lo ponderaríamos distinto — y la bifurcación entre esto y una plataforma constructora es justo lo que recorre OptimoWeb vs Squarespace.

Resultados

Lo que esto entregó — con transparencia.

  • 102 páginas estáticas con paridad total inglés/español y hreflang recíproco en todo el funnel
  • 27 hubs de ubicación, 7 hubs de industria, 8 guías pilar, 5 comparaciones de competidores, hub de precios con schema OfferCatalog
  • Grafo de entidades JSON-LD en cascada desde una única raíz Organization con @id — Service/areaServed, WebPage/Speakable, BreadcrumbList, FAQPage en cada página
  • Manifiestos llms.txt + llms-full.txt para crawlers de IA
  • 102 tarjetas sociales og:image 1200×630 de marca generadas en tiempo de build
  • Lighthouse performance 100; LCP 1,0 s; bytes en cable −70% vía gzip + ETag + caché por niveles
  • Mega menú CSS-first — enlaces rastreables, cero JS requerido para navegar
  • Formulario de contacto entregando por correo self-hosted — sin servicio SaaS de formularios

Solo métricas técnicas. No publicamos ingresos, conteos de clientes ni testimonios que no podamos verificar.

Preguntas

Preguntas frecuentes

¿Por qué publicar su propio sitio web como caso de estudio?

Porque es el único proyecto donde cada afirmación es inspeccionable desde tu navegador justo ahora — las 102 páginas, el grafo de entidades, las tarjetas sociales, el puntaje de Lighthouse. Nada está inflado porque nada puede estarlo: estás dentro del artefacto.

¿Qué significa realmente «grafo de entidades completo»?

Un único nodo Organization canónico con un @id fijo es la raíz; cada página emite nodos WebPage, BreadcrumbList, Service o FAQPage que lo referencian. Las señales de autoridad caen en cascada desde una sola raíz en vez de fragmentarse en bloques de schema desconectados por página.

¿Construirían el sitio de mi negocio así?

Si tu perfil de contenido encaja — sitios de marketing, documentación, sistemas de aterrizaje que cambian según tu calendario — sí, estático es la opción más fuerte. Si tu equipo publica a diario, necesita una UI de edición o vende en línea, recomendaremos WordPress o un stack de comercio headless, y explicaremos el trade-off.

¿Es Lighthouse 100 realista para un sitio de negocio normal?

En un stack estático o bien afinado, sí para las plantillas que importan. Lo que suele hacerlo imposible son los scripts de terceros — widgets de chat, píxeles de rastreo, video embebido. Eso lo dimensionamos con transparencia por proyecto.

¿Qué son llms.txt y llms-full.txt?

Manifiestos en texto plano en la raíz del sitio que dan a los crawlers de IA un resumen limpio y factual del negocio — servicios, áreas, anclas de precios y URLs canónicas — para que los asistentes citen el sitio con precisión en vez de adivinar a partir de fragmentos raspados.

¿Quieres tu sitio construido así?

La misma arquitectura, tu negocio: un sitio rápido, propio y legible por IA, con el grafo de entidades, la paridad de idiomas y los números de performance para demostrarlo.