1~
2Teknik SEO, Next.js sitenizin kolayca indekslenebilir, hızlı ve arama sonuçlarında rekabetçi olmasını sağlamak için gereklidir. Bu rehber, SEO'nuzu bir üst seviyeye taşımak için stratejiler, araçlar ve pratik kod parçacıkları sunmaktadır, özellikle çok dilli sitelere odaklanarak.
3~
4## 1. Dinamik Meta Tags ve Open Graph
5~
6Next.js 13+, `generateMetadata` fonksiyonunu kullanarak merkezi meta tag yönetimi sağlar:
7~
8```tsx
9export async function generateMetadata({ params }) {
10  const { locale } = await params;
11  const t = await getTranslations({ locale, namespace: 'common' });
12  return {
13    title: t('title'),
14    description: t('description'),
15    openGraph: {
16      title: t('title'),
17      description: t('description'),
18      images: ['/public/placeholder.svg'],
19    },
20    icons: {
21      icon: '/favicon.ico',
22    },
23  };
24}
25```
26~
27> **İpucu:** Dinamik çeviriler kullanarak her dil ve sayfa için meta tags'ı güncellemeyi unutmayın.
28~
29## 2. Otomatik Sitemap ve robots.txt
30~
31Sitemaps ve robots.txt oluşturmak için [next-sitemap](https://www.npmjs.com/package/next-sitemap) kullanın:
32~
33```bash
34npm install next-sitemap
35```
36~
37Dilleri desteklemek için `next-sitemap.config.js`'yi yapılandırın:
38~
39```js
40module.exports = {
41  siteUrl: 'https://spinny.dev',
42  generateRobotsTxt: true,
43  i18n: {
44    locales: [
45      'it',
46      'en',
47      'fr',
48      'de',
49      'es',
50      'ar',
51      'hi',
52      'ja',
53      'zh',
54      'pt',
55      'bn',
56      'ru',
57      'id',
58      'ur',
59      'ko',
60      'tr',
61      'vi',
62      'th',
63      'pl',
64    ],
65    defaultLocale: 'it',
66  },
67};
68```
69~
70> **Ekstra Araç:** Gelişmiş meta tag ve yapılandırılmış veri yönetimi için [next-seo](https://github.com/garmeeh/next-seo) deneyin.
71~
72## 3. Uluslararasılaştırma (i18n) ve Çok Dilli SEO
73~
74Next.js yerelleştirilmiş rotaları destekler. Şunları unutmayın:
75~
76- Her dil için `hreflang` etiketini kullanın.
77- Çok dilli sitemap'ler oluşturun.
78- Meta tags'ı çevirin.
79~
80`hreflang` etiketi örneği:
81~
82```tsx
83<link rel="alternate" href="https://spinny.dev/it" hreflang="it" />
84<link rel="alternate" href="https://spinny.dev/en" hreflang="en" />
85```
86~
87> **En İyi Uygulama:** Her zaman görünür bir dil seçici sunun ve URL tutarlılığını koruyun.
88~
89## 4. Performans ve Core Web Vitals
90~
91- Optimize edilmiş görseller için Next.js `<Image />` kullanın.
92- Lazy loading'i etkinleştirin.
93- [Lighthouse](https://developers.google.com/web/tools/lighthouse) ve [Vercel Analytics](https://vercel.com/analytics) ile analiz edin.
94- Kullanılmayan JavaScript ve CSS'yi minimize edin.
95- Vercel'in önbelleğini ve CDN'ini kullanın.
96~
97## 5. Yapılandırılmış Veri (JSON-LD)
98~
99Rich snippet'lerdeki görünürlüğü artırmak için yapılandırılmış veri ekleyin:
100~
101```tsx
102<script
103  type="application/ld+json"
104  dangerouslySetInnerHTML={{
105    __html: JSON.stringify({
106      '@context': 'https://schema.org',
107      '@type': 'BlogPosting',
108      headline: 'Technical SEO for Next.js Developers',
109      datePublished: '2025-07-28',
110      author: { '@type': 'Person', name: 'Filippo Spinella' },
111      inLanguage: 'en',
112    }),
113  }}
114/>
115```
116~
117> **İpucu:** Uygulanabilir olduğunda breadcrumb'lar, makaleler ve ürünler için de yapılandırılmış veri ekleyin.
118~
119## 6. Hata Yönetimi ve Özel 404 Sayfaları
120~
121Her dil için yerelleştirilmiş bir `not-found.tsx` sayfası oluşturun. Bu, kullanıcı deneyimini ve SEO'yu iyileştirir.
122~
123> **İpucu:** 500 ve sunucu hata sayfalarını da özelleştirin.
124~
125## 7. Faydalı Araçlar
126~
127- **next-sitemap**: sitemaps ve robots.txt
128- **next-seo**: gelişmiş meta tag yönetimi
129- **Google Search Console**: SEO izleme
130- **Ahrefs Webmaster Tools**: teknik analiz
131- **Screaming Frog**: gelişmiş crawling
132- **Mermaid**: SEO akışlarını ve mimarilerini görselleştirmek için
133~
134## 8. İzleme ve Analiz
135~
136Google Analytics, Vercel Analytics'i entegre edin ve Core Web Vitals'ı izleyin.
137~
138- Merkezi etiket yönetimi için [Google Tag Manager](https://tagmanager.google.com/) kullanın.
139- Sentry gibi araçlarla erişim günlüklerini ve hataları izleyin.
140~
141~
142## Sonuç
143~
144Next.js'te teknik SEO, meta tags, performans, uluslararasılaştırma ve yapılandırılmış veri gibi ayrıntılara dikkat gerektirir. Mümkün olduğunda otomatikleştirin ve sonuçları sürekli izleyin!
145~
146> **Son Kontrol Listesi:**
147>
148> - [x] Dinamik meta tags
149> - [x] Çok dilli sitemap
150> - [x] Yapılandırılmış veri
151> - [x] Optimize edilmiş performans
152> - [x] Aktif izleme
153~