Resuelve los problemas de SEO específicos de SPAs, SSR y apps JavaScript: el renderizado, el Core Web Vitals y las optimizaciones técnicas que diferencian a los developers que entienden de SEO.
Cuándo usarlo: Auditoría y optimización de SEO técnico en aplicaciones web modernas con JavaScript y frameworks SPA/SSR.
Herramienta recomendada: Claude
Actúa como un ingeniero de software especializado en SEO técnico con experiencia resolviendo los problemas de posicionamiento que son específicos de las aplicaciones web modernas: las SPAs con React, Vue o Angular, las aplicaciones con renderizado en servidor (SSR), los frameworks como Next.js o Nuxt, y los sitios con JavaScript pesado donde el SEO mal implementado puede hacer que Google no indexe nada. Necesito auditar o mejorar el SEO técnico de mi aplicación. Para asesorarte bien, primero pregúntame: 1. ¿Qué stack estás usando: SPA pura (React/Vue/Angular con CSR), SSR (Next.js, Nuxt, SvelteKit), SSG (sitio generado estáticamente), o una aplicación híbrida? 2. ¿Cuáles son los problemas de indexación que ya has detectado o sospechas que tienes? 3. ¿Has revisado los Core Web Vitals en Google Search Console? ¿Qué puntuaciones tienes? 4. ¿Tienes JavaScript que bloquea el renderizado o recursos de terceros que impactan la velocidad de carga? 5. ¿Qué herramientas de SEO técnico has usado ya (Screaming Frog, Google Search Console, PageSpeed Insights)? Con esas respuestas, desarrolla la auditoría y el plan de mejoras: **1. El problema del renderizado en SPAs: por qué Google puede no estar indexando tu contenido** El mayor problema de SEO en aplicaciones JavaScript es que Googlebot puede no ver el contenido si depende de JavaScript para renderizarse. Explica el problema en profundidad: la diferencia entre CSR (el HTML que llega al bot está vacío hasta que JavaScript lo rellena), SSR (el HTML llega ya renderizado desde el servidor), SSG (las páginas se generan en build time) e ISR (generación incremental). Define el diagnóstico: cómo comprobar qué ve Googlebot realmente con la herramienta de Inspección de URLs de Search Console vs. lo que ve un usuario, y las señales que indican que hay un problema de renderizado (páginas indexadas pero sin contenido, bajo CTR de páginas que deberían posicionar). **2. Core Web Vitals: las métricas de rendimiento que son factor de ranking** Los Core Web Vitals son métricas de experiencia de usuario que Google usa como señal de ranking. Define qué mide cada una y cómo mejorarla: LCP (Largest Contentful Paint, el tiempo hasta que el elemento más grande es visible; optimización: precarga de imágenes, servidor rápido, eliminación de recursos que bloquean el renderizado), CLS (Cumulative Layout Shift, el desplazamiento del contenido mientras carga; optimización: dimensiones explícitas en imágenes y videos, fuentes de sistema o preload de web fonts), INP (Interaction to Next Paint, la respuesta a la interacción del usuario; optimización: no bloquear el hilo principal, dividir las tareas JavaScript largas). **3. Optimización de la velocidad de carga en aplicaciones modernas** La velocidad de carga no es solo una métrica de SEO, es una métrica de negocio. Define las técnicas específicas para aplicaciones JavaScript modernas: el code splitting para cargar solo el JavaScript necesario para cada página, el lazy loading de imágenes y componentes, la optimización de imágenes (formato WebP/AVIF, srcset para responsive, CDN para distribución), la estrategia de caché (Cache-Control, Service Workers), la eliminación de JavaScript y CSS no utilizado y la reducción del TTFB (Time to First Byte) con un CDN edge y un servidor de origen rápido. **4. Gestión dinámica de metadatos y datos estructurados** En una aplicación JavaScript, los metadatos deben actualizarse con cada cambio de ruta. Define la implementación correcta: cómo gestionar el title, la description, los Open Graph tags y el canonical en Next.js (Metadata API), en Nuxt (useHead), en Vue puro (vue-meta) y en React sin framework (react-helmet). Añade la implementación de datos estructurados (JSON-LD) para los tipos de schema más relevantes según el tipo de aplicación (Product, Article, Organization, BreadcrumbList, FAQPage) y cómo validarlos con el Rich Results Test de Google. **5. Rastreabilidad: el sitemap, el robots.txt y la estructura de URLs** Ayuda a Googlebot a rastrear e indexar tu sitio eficientemente. Define las mejores prácticas: el sitemap XML generado dinámicamente (especialmente crítico en sitios con miles de URLs dinámicas), el robots.txt que bloquea las páginas que no deben indexarse (paneles de admin, páginas de pago, duplicados), la gestión de URLs canónicas para evitar contenido duplicado, la implementación de hreflang para aplicaciones multiidioma y la estructura de URLs SEO-friendly (sin parámetros innecesarios, con slugs descriptivos). **6. Monitorización y alertas de SEO técnico** Un problema de SEO técnico puede destruir posiciones antes de que lo detectes. Define el sistema de monitorización: las alertas en Google Search Console que detectan caídas de indexación o de cobertura, la monitorización del rendimiento de Core Web Vitals en campo (no solo en lab) con el CrUX report, las herramientas de crawling periódico (Screaming Frog, Sitebulb) que detectan errores 404, redirecciones rotas o metadatos duplicados, y las alertas de posición para las keywords más importantes. Termina con el checklist de SEO técnico que deberías revisar antes de cada deployment importante de la aplicación.