Next.js, App Router ile birlikte SEO için ihtiyaç duyacağınız çoğu aracı kutudan çıkar çıkmaz sunuyor. Bu yazıda gerçek projelerde her zaman uyguladığım 7 pratiği paylaşıyorum.
1. Metadata API'sini Doğru Kullanın
Her route segmentinde metadata veya generateMetadata ile sayfaya özel başlık ve açıklama tanımlayın. metadataBase set ettiğinizden emin olun, böylece OG görselleri tam URL ile sunulur.
export const metadata = {
metadataBase: new URL("https://ardaktas.com.tr"),
title: { default: "Site", template: "%s — Site" },
};2. JSON-LD ile Yapılandırılmış Veri Ekleyin
Article, BreadcrumbList, Person gibi schema.org tipleri, Google'ın sayfanızı daha iyi anlamasını sağlar.
3. Sitemap ve robots.txt'yi Otomatize Edin
app/sitemap.ts ve app/robots.ts dosyalarıyla bu iki kritik dosyayı dinamik üretebilirsiniz. Her yeni yazı otomatik dahil olur.
4. RSS Beslemesi Sunun
Klasik bir SEO/dağıtım kanalı. feed paketiyle dakikalar içinde ekleyebilirsiniz.
5. Görseller İçin next/image
Otomatik AVIF/WebP, lazy loading ve doğru width/height ile Cumulative Layout Shift problemlerini önler.
6. Doğru lang ve Bölgesel İşaretleme
Türkçe site için <html lang="tr"> ve og:locale="tr_TR" set edin.
7. Core Web Vitals'ı İzleyin
next/font ile font CLS'sini sıfırlayın. Üçüncü taraf script'leri next/script ile afterInteractive veya lazyOnload stratejisinde yükleyin.
Bu küçük dokunuşlar bile arama görünürlüğünüzde hissedilir bir fark yaratır. Soru veya öneriniz varsa bana yazın.
