SEO-ul tehnic este esential pentru a te asigura ca site-ul tau Next.js este usor de indexat, rapid si competitiv in rezultatele cautarilor. Acest ghid acopera strategii, instrumente si fragmente de cod practice, cu un accent special pe site-urile multilingve.
1. Meta tag-uri dinamice si Open Graph
Next.js 13+ permite gestionarea centralizata a meta tag-urilor folosind functia generateMetadata:
export async function generateMetadata({ params }) { const { locale } = await params; const t = await getTranslations({ locale, namespace: 'common' }); return { title: t('title'), description: t('description'), openGraph: { title: t('title'), description: t('description'), images: ['/public/placeholder.svg'], }, icons: { icon: '/favicon.ico', }, }; }
Sfat: Nu uita sa actualizezi meta tag-urile pentru fiecare limba si pagina.
2. Sitemap automat si robots.txt
npm install next-sitemap
module.exports = { siteUrl: 'https://spinny.dev', generateRobotsTxt: true, i18n: { locales: [ 'it', 'en', 'fr', 'de', 'es', 'ar', 'hi', 'ja', 'zh', 'pt', 'bn', 'ru', 'id', 'ur', 'ko', 'tr', 'vi', 'th', 'pl', ], defaultLocale: 'it', }, };
3. Internationalizare (i18n) si SEO multilingv
- Foloseste tag-ul
hreflangpentru fiecare limba. - Genereaza sitemap-uri multilingve.
- Traduce meta tag-urile.
<link rel="alternate" href="https://spinny.dev/it" hreflang="it" /> <link rel="alternate" href="https://spinny.dev/en" hreflang="en" />
Buna practica: Ofera intotdeauna un selector de limba vizibil si mentine consistenta URL-urilor.
4. Performanta si Core Web Vitals
- Foloseste Next.js
<Image />pentru imagini optimizate. - Activeaza lazy loading.
- Analizeaza cu Lighthouse si Vercel Analytics.
- Minimizeaza JavaScript si CSS neutilizat.
5. Date structurate (JSON-LD)
<script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify({ '@context': 'https://schema.org', '@type': 'BlogPosting', headline: 'Technical SEO for Next.js Developers', datePublished: '2025-07-28', author: { '@type': 'Person', name: 'Filippo Spinella' }, inLanguage: 'en', }), }} />
6. Gestionarea erorilor si pagini 404 personalizate
Creeaza o pagina not-found.tsx localizata pentru fiecare limba.
7. Instrumente utile
- next-sitemap: sitemap-uri si robots.txt
- next-seo: gestionare avansata a meta tag-urilor
- Google Search Console: monitorizare SEO
- Ahrefs Webmaster Tools: analiza tehnica
- Screaming Frog: crawling avansat
8. Monitorizare si analiza
Integreaza Google Analytics, Vercel Analytics si monitorizezi Core Web Vitals.
Concluzie
SEO-ul tehnic in Next.js necesita atentie la detalii precum meta tag-uri, performanta, internationalizare si date structurate. Automatizeaza acolo unde este posibil si monitorizeaza constant rezultatele!
Lista finala de verificare:
- Meta tag-uri dinamice
- Sitemap multilingv
- Date structurate
- Performanta optimizata
- Monitorizare activa