Garantir que uma aplicação Next.js seja indexada instantaneamente pelo Google e citada por buscadores de inteligência artificial requer uma arquitetura que una velocidade (Core Web Vitals), pré-renderização estática (SSG/ISR) e metadados dinâmicos rigorosos.
Neste guia, apresento os padrões técnicos utilizados na LookADev para alcançar pontuações acima de 95 no Lighthouse e ranqueamento prioritário em crawlers modernos.
1. Static Site Generation (SSG) vs. Server-Side Rendering (SSR)
Para páginas de conteúdo como portfólios, blogs, FAQs e landing pages, o Static Site Generation (SSG) com generateStaticParams é insuperável. O HTML pré-renderizado no momento do build garante que crawlers legados e crawlers de IA recebam a página completa em milissegundos.
2. A API de Metadata do Next.js App Router
Evite a antiga tag Head do Pages Router. Utilize a função generateMetadata tipada para gerar metadados dinâmicos, OpenGraph e Twitter Cards específicos para cada rota no App Router.
3. Sitemap e Robots Dinâmicos (sitemap.ts e robots.ts)
Next.js permite gerar o sitemap XML e as regras de robots nativamente através de arquivos TypeScript no diretório app/. É fundamental declarar expressamente a permissão para crawlers de IA como GPTBot, ClaudeBot, PerplexityBot e Google-Extended no seu robots.ts.
4. Otimização de Core Web Vitals (INP, LCP, CLS)
Para passar nas métricas de experiência de página do Google: use Image com priority para imagens de capa, mantenha scripts de terceiros isolados para otimizar o INP, e defina dimensões explícitas para evitar trocas bruscas de layout (CLS).