Şükrü GençoğluŞükrü Gençoğlu
SEO Kit ve İçerik Stratejisi: Next.js için Modüler Plan

SEO Kit ve İçerik Stratejisi: Next.js için Modüler Plan

seo·1 Mayıs 2026·5 dk okuma
teknik seojson-ldsitemapog imageanahtar kelimeiçerik stratejisiai içeriknext.js
PaylaşLinkedInXWhatsApp

SEO Geliştirme Planı — sukrugencoglu.com & Reusable SEO Kit

Context

Neden: Site teknik SEO açısından sağlam temele sahip (i18n hreflang, sitemap, robots, dinamik metadata) ancak kritik eksikler var: blog yazıları sitemap'te yok, JSON-LD schema hiç yok, OG image yok, blog görselleri next/image kullanmıyor, anahtar kelime/içerik stratejisi belgelenmemiş. Aynı zamanda kullanıcı bu yapıyı başka projelerde tekrar kullanabileceği modüler bir kit olarak kurmak istiyor.

Hedef sonuç:

  1. Bu site için Google'da hedef kelimelerde sıralama artışı (Türkiye TR pazarı önce, EN sonra)

  2. Başka Next.js projelerine kopyala-yapıştır ile taşınabilir bir seo-kit modülü

  3. AI taslak + manuel redaksiyon ile sürdürülebilir içerik üretim akışı

Yaklaşım: Modüler kod (kit) + içerik metodolojisi (kelime haritası + AI promptları + şablonlar). 5 fazda ilerlenecek; her faz bağımsız değer üretir, sıralı zorunluluk yok ama önerilen sıra: A → B → C → D → E.

Faz A — Teknik SEO Temeli (kritik eksikleri kapat)

Amaç: Mevcut sayfaların Google ve sosyal platformlardaki görünümünü güçlendir.

A1. Blog yazılarını sitemap'e ekle

  • Dosya: [src/app/sitemap.ts](src/app/sitemap.ts)

  • Mevcut hard-coded liste yerine /api/blog-yazilari ve /api/sss'den published=true olanları çek, TR+EN URL'lerini ekle

  • lastModified postun publishedAt veya updatedAt alanından gelsin

  • Vaka çalışmaları (/api/vaka-calismalari) varsa onlar da

A2. JSON-LD yapısal veri ekle

  • Yeni dosya: src/components/seo/JsonLd.tsx (reusable, server component)

  • Şemalar:

    • Organization → root layout'ta (logo, sameAs sosyal linkler, contact)

    • Person → /hakkimda ve /about sayfalarında

    • Article → her blog yazısında (src/app/[lang]/blog/[slug]/page.tsx)

    • FAQPage → SSS sayfasında ve /calismalar'daki SssCards kısmında

    • BreadcrumbList → blog detay ve servis sayfalarında

    • WebSite + SearchAction → root'ta

A3. OG image altyapısı

  • Yeni dosya: src/app/[lang]/blog/[slug]/opengraph-image.tsx (Next.js dinamik OG image API ile)

  • Statik OG fallback: public/og-default.png (1200x630)

  • Blog metadatasına openGraph.images + twitter.card="summary_large_image" eklensin

A4. Robots & canonical iyileştirmeleri

  • src/app/[lang]/layout.tsx'a robots: { index, follow, googleBot: { ... } } ekle

  • /studyo ve /api/* route'ları noindex (metadata ile)

  • Search Console verification meta tag eklenecek yeri hazırla (env'den)

Faz B — Reusable SEO Kit (modüler paket)

Amaç: Bu projede çalışan bileşenleri başka Next.js projelerine kopyalanabilir hale getir.

Yer: src/lib/seo/ klasörü altında topla — başka projeye cp -r ile taşınır.

B1. src/lib/seo/[MetaBuilder.ts](http://metabuilder.ts/)

Generic helper — sayfaların generateMetadata'sında kullanılır:


buildMetadata({ baseUrl, lang, path, title, description, image?, type? })

→ Metadata (canonical, hreflang, og, twitter dahil)

Mevcut src/app/[lang]/layout.tsx ve sayfa metadataları bu helper'a refactor edilsin → tekrar eden kod gider.

B2. src/lib/seo/JsonLd.tsx

Schema factory'leri: OrganizationLd, PersonLd, ArticleLd, FaqLd, BreadcrumbLd, WebSiteLd. Hepsi React Server Component, JSON.stringify ile script tag yazar.

B3. src/lib/seo/[sitemap-helpers.ts](http://sitemap-helpers.ts/)

buildSitemap({ baseUrl, staticPaths, dynamicSources: [{ fetch, mapEntry }] }) — başka projede sadece kaynaklar değişir.

B4. src/lib/seo/og-image.tsx

Generic OG image template — title, category, accent color parametre olarak alır. Blog ve diğer sayfalar paylaşır.

B5. Kit konfigürasyonu

src/lib/seo/[config.ts](http://config.ts/) — site-spesifik tüm değerler (baseUrl, defaultLang, supportedLangs, ogImage, organization data) burada tek noktada. Başka projeye taşırken sadece bu dosya değişir.

B6. Dokümantasyon

src/lib/seo/[README.md](http://readme.md/) — kit nasıl kullanılır, nasıl yeni projeye taşınır, hangi env değişkenleri gerekir.

Faz C — Anahtar Kelime & İçerik Stratejisi

Amaç: Hedef kelimelerin sayfa haritası — hangi kelime hangi sayfaya/yazıya gider.

C1. Pillar/Cluster yapısı

Yeni dosya: docs/seo/[keyword-map.md](http://keyword-map.md/) (versiyonlanır, takip edilir)

3-4 ana pillar (mevcut sayfalara denk gelir):

Her pillar altında 5-10 cluster yazı (blog) — long-tail kelimeler:

  • "google ads dönüşüm takibi nasıl kurulur"

  • "meta ads pixel kurulumu"

  • "gtm ile e-ticaret takibi"

C2. Mevcut sayfa-kelime ataması

Tablo formatında (markdown):

| URL | Birincil kelime | İkincil | Arama hacmi (tahmini) | Mevcut sıralama |

C3. Internal linking şeması

Pillar → cluster ve cluster → pillar bağlantıları. Blog yazılarının body'sine eklenir, manuel takip edilir.

C4. Reusable kısım — docs/seo/[keyword-map-template.md](http://keyword-map-template.md/)

Boş şablon, başka projelerde dolduralur. Persona, pillar tanımları, cluster keşif promptları içerir.

Faz D — Hibrit AI İçerik Üretim Akışı

Amaç: Anahtar kelimeden taslak yazıya, sen redaksiyon yapıp yayınla.

D1. /api/blog-ai'yi genişlet

Dosya: [src/app/api/blog-ai/route.js](src/app/api/blog-ai/route.js)

  • Yeni action: generate_draft_from_keyword

    • Input: { keyword, pillar, targetLength, lang }

    • Output: { titleTR, summaryTR, contentTR (markdown, ## H2 yapılı), suggestedTags, suggestedCategory }

  • Prompt template: persona + pillar context + SEO kuralları (H2/H3 yapısı, internal link önerileri, kelime yoğunluğu)

  • Mevcut suggest_titles, suggest_summary, suggest_category_tags aksiyonlarıyla aynı dosyada

D2. BlogWizard'a "Anahtar kelimeden başla" girişi

Dosya: src/components/studyo/BlogWizard.jsx

  • Step 1'e alternatif giriş: textarea yerine "Anahtar kelime + pillar" seçimi → AI taslak üretir → editöre düşer

  • Sonraki adımlar (başlık, kategori, etiket) zaten mevcut akışla devam

D3. EN çevirisi

  • Yeni action: translate_to_en — postu yayına geçirmeden önce TR → EN otomatik çevir, manuel onay

  • Step 5'te "EN içerik üret" butonu

D4. Reusable kısım — docs/seo/[ai-prompts.md](http://ai-prompts.md/)

Tüm promptlar markdown'da, başka projeye kopyalanır. Persona ve pillar değişkenleri placeholder olarak.

Faz E — Performans & Core Web Vitals

Amaç: LCP/CLS/INP iyileştir, Google ranking faktörlerini güçlendir.

E1. Blog görselleri → next/image

E2. [next.config.ts](http://next.config.ts/) — image domain whitelist

  • Supabase storage URL'i remotePatterns'a ekle (mevcut sadece picsum.photos)

E3. Font ve script optimizasyonu

  • GTM scriptini next/script strategy="afterInteractive" ile yükle (src/app/layout.tsx lines 34-56)

  • Font display:swap zaten var, preload kontrol et

E4. Lighthouse audit baseline

  • Build sonrası lighthouse [https://www.sukrugencoglu.com](https://www.sukrugencoglu.com/) --output=json ile baseline al

  • Hedef: LCP < 2.5s, CLS < 0.1, INP < 200ms

Kritik Dosyalar (özet)

Düzenlenecek:

Yeni oluşturulacak:

  • src/lib/seo/[MetaBuilder.ts](http://metabuilder.ts/)

  • src/lib/seo/JsonLd.tsx

  • src/lib/seo/[sitemap-helpers.ts](http://sitemap-helpers.ts/)

  • src/lib/seo/og-image.tsx

  • src/lib/seo/[config.ts](http://config.ts/)

  • src/lib/seo/[README.md](http://readme.md/)

  • src/app/[lang]/blog/[slug]/opengraph-image.tsx

  • docs/seo/[keyword-map.md](http://keyword-map.md/) (bu sitenin)

  • docs/seo/[keyword-map-template.md](http://keyword-map-template.md/) (reusable boş)

  • docs/seo/[ai-prompts.md](http://ai-prompts.md/) (reusable)

  • public/og-default.png (manuel veya generated)

Verification

Faz A bitince

  1. next build hatasız geçmeli

  2. curl [https://www.sukrugencoglu.com/sitemap.xml](https://www.sukrugencoglu.com/sitemap.xml) → blog yazıları görünmeli

  3. https://search.google.com/test/rich-results → blog URL'i ile FAQPage/Article schema doğrulanır

  4. https://www.opengraph.xyz → blog URL'i ile OG kart preview kontrolü

Faz B bitince

  • Kit'i izole test: src/lib/seo/ klasörünü dummy bir Next.js projeye kopyala, [config.ts](http://config.ts/) doldur, sitemap+metadata çalışıyor mu?

Faz C bitince

  • docs/seo/[keyword-map.md](http://keyword-map.md/) yorumlanır, GSC (Search Console) verisiyle çapraz kontrol — gerçek arama sorguları kelime listesinde var mı?

Faz D bitince

  • BlogWizard'da bir keyword gir → taslak üret → düzenle → yayınla → blog sayfasında görünmeli, JSON-LD valid olmalı

Faz E bitince

  • npx lighthouse [https://www.sukrugencoglu.com](https://www.sukrugencoglu.com/) --view → LCP/CLS/INP hedefleri tut

  • PageSpeed Insights → "Good" yeşil

Tüm iş bitince — Google Search Console

  • Sitemap submit → indexing %95+

  • 30 gün sonra: hedef kelimelerde sıralama hareketi (GSC Performance > Queries)

Önerilen Uygulama Sırası

Hızlı kazanım (1-2 gün): A1 + A2 + A4 → indexlenebilirlik ve schema temel

Modülerleşme (2-3 gün): B1-B6 → kit haline getir, mevcut kodu refactor

Strateji (1 gün, kod yok): C1-C4 → kelime haritası ve cluster planı

İçerik motoru (2 gün): D1-D4 → AI akışını kur

Cilala (1 gün): A3 (OG image) + E1-E4 → görsel ve performans

← Blog Yazıları
WhatsApp'tan Bize Sorun