Verificador de SEO Next.js

Audita tu sitio Next.js en busca de problemas de SSR, renderizado, metadatos y rastreabilidad. Más de 20 verificaciones en 7 categorías.

El Problema #1 de SEO en Next.js

El uso excesivo de directivas "use client" hace que el contenido se renderice solo en navegadores. Los motores de búsqueda y rastreadores de IA (ChatGPT, Claude, Perplexity) pueden ver una carcasa HTML vacía en lugar de tu contenido.

  • Detecta problemas de SSR vs CSR
  • Verifica disponibilidad de metadatos
  • Analiza Core Web Vitals

Funciona mejor con sitios Next.js, pero puede analizar cualquier sitio web

Preguntas Frecuentes

¿Qué verifica esta herramienta?

Esta herramienta realiza más de 20 verificaciones de SEO en 7 categorías:

  • Renderizado y SSR: Detecta carcasas HTML vacías, renderizado solo del cliente, problemas de hidratación
  • Metadatos y Head: Título, descripción, Open Graph, canonical, viewport
  • Performance: Core Web Vitals (FCP, LCP, TTFB), recursos que bloquean el renderizado
  • Imágenes: Texto alternativo, uso de next/image, carga diferida
  • Datos Estructurados: Validación de marcado de esquema JSON-LD
  • Rastreabilidad: Meta robots, enlaces internos, hreflang
  • HTML Semántico: Encabezados, landmarks, atributos ARIA

¿Por qué SSR/SSG es importante para SEO?

Los motores de búsqueda y rastreadores de IA inicialmente ven solo el HTML sin procesar de tu servidor. Si tu contenido se renderiza solo a través de JavaScript (del lado del cliente), los rastreadores pueden ver una página vacía. Server-Side Rendering (SSR) o Static Site Generation (SSG) aseguran que tu contenido esté en la respuesta HTML inicial.

¿Qué es el problema de "Carcasa HTML Vacía"?

Esto ocurre cuando tu aplicación Next.js devuelve HTML mínimo con contenido cargado completamente a través de JavaScript. Causas comunes:

  • Uso excesivo de directivas "use client"
  • No usar getServerSideProps o getStaticProps
  • Buscar datos solo en hooks useEffect

¿Cómo corrijo problemas de renderizado?

Para asegurar que el contenido esté disponible para los rastreadores:

  • Pages Router: Usa getServerSideProps o getStaticProps
  • App Router: Mantén los componentes como Server Components por defecto, solo agrega "use client" cuando sea necesario
  • Obtención de Datos: Obtén datos críticos del lado del servidor, no en useEffect
  • Metadata: Usa next/head o la API de metadatos