Next.js SEO Checker

Audit your Next.js site for SSR, rendering, metadata, and crawlability issues. 20+ checks across 7 categories.

Le problème de référencement n°1 de Next.js

Excessive use of "use client" directives causes content to render only in browsers. Search engines and AI crawlers (ChatGPT, Claude, Perplexity) may see an empty HTML shell instead of your content.

  • Detect SSR vs CSR issues
  • Check metadata availability
  • Analyze Core Web Vitals

Fonctionne mieux avec les sites Next.js, mais peut analyser n'importe quel site WebFonctionne mieux avec les sites Next.js, mais peut analyser n'importe quel site Web

Questions Fréquemment Posées

What does this tool check?

Cet outil effectue plus de 20 contrôles SEO dans 7 catégories :

  • Rendering & SSR: Détecte les shells HTML vides, le rendu client uniquement, les problèmes d'hydratationDétecte les shells HTML vides, le rendu client uniquement, les problèmes d'hydratation
  • Metadata & Head: Titre, description, Open Graph, canonique, fenêtre d'affichage
  • Performance: Core Web Vitals (FCP, LCP, TTFB), ressources bloquant le rendu
  • Images: Texte alternatif, utilisation suivante/image, chargement paresseux
  • Structured Data: JSON-LD schema markup validation
  • Capacité d'exploration: Méta robots, liens internes, hreflang
  • Semantic HTML: Rubriques, repères, attributs ARIA

Pourquoi SSR/SSG est-il important pour le référencement ?

Search engines and AI crawlers initially see only the raw HTML from your server. If your content renders only via JavaScript (client-side), crawlers may see an empty page. Server-Side Rendering (SSR) or Static Site Generation (SSG) ensures your content is in the initial HTML response.

Qu'est-ce que le problème « Coque HTML vide » ?

This occurs when your Next.js app returns minimal HTML with content loaded entirely via JavaScript. Common causes:

  • Utilisation excessive des directives \"use client\"
  • Ne pas utiliser getServerSideProps ou getStaticProps
  • Récupération de données uniquement dans les hooks useEffect

Comment résoudre les problèmes de rendu ?

To ensure content is available to crawlers:

  • Routeur de pages: Utilisez getServerSideProps ou getStaticProps
  • Routeur d'application: Keep components as Server Components by default, only add "use client" when needed
  • Data Fetching: Récupérer les données critiques côté serveur, pas en cours d'utilisation
  • Metadata: Utilisez next/head ou l'API de métadonnées