Next.js ile SEO Uyumlu Portfolyo Sitesi Nasıl Yapılır?

Backend tarafında güçlü bir Laravel developer olsan bile, kendini gösterecek iyi bir portfolyo sitesi olmadan fırsatların yarısını kaçırırsın. Bu yazıda Next.js ile hem hızlı hem de SEO uyumlu bir portfolyo sitesi kurarken uyguladığım teknikleri anlatıyorum.

Neden Next.js?

Next.js, sunucu tarafı render (SSR) ve statik üretim (SSG) sayesinde arama motorlarının içeriğini kolayca taramasını sağlar. İçerik ilk yüklemede HTML olarak geldiği için Google botu JavaScript çalıştırmayı beklemez — bu, sıralama için kritik bir avantajdır.

Metadata ve Open Graph

Her sayfaya anlamlı bir başlık ve açıklama ekle. Next.js'in Metadata API'si ile bunu tip güvenli biçimde yönetebilirsin. Hedef anahtar kelimeni (örneğin "Laravel Developer") başlıkta ve açıklamada doğal biçimde geçir.

export const metadata: Metadata = {
  title: 'Abdullah Zübeyir Yıldız — Laravel Developer',
  description: 'Laravel ve full-stack web geliştirme...',
  openGraph: { type: 'website', locale: 'tr_TR' },
};

Structured Data (JSON-LD)

Arama motorlarına kim olduğunu ve ne yaptığını açıkça söyle. Person ve Article şemaları ile Google, içeriğini zengin sonuç (rich result) olarak gösterebilir. Bu, tıklanma oranını doğrudan artırır.

Sitemap ve robots.txt

• sitemap.xml ile tüm sayfalarını arama motoruna bildir
• robots.txt ile taramaya izin ver ve sitemap'i işaret et
• Canonical URL ile yinelenen içerik sorununu önle

Performans = SEO

Google, hızlı siteleri ödüllendirir. Görselleri optimize et (WebP, lazy loading), yazı tiplerini display: swap ile yükle ve gereksiz JavaScript'ten kaçın. Core Web Vitals metriklerin ne kadar iyiyse, sıralaman o kadar yükselir.

Sonuç

SEO uyumlu bir portfolyo; doğru metadata, structured data, sitemap ve yüksek performansın bir araya gelmesidir. Bir Laravel developer olarak backend gücünü, iyi kurgulanmış bir vitrinle birleştirdiğinde fırsatlar seni bulmaya başlar.