Buyukweb
Teknik SEO Rehberi: Core Web Vitals ve Sayfa Performansı Optimizasyonu

Teknik SEO Rehberi: Core Web Vitals ve Sayfa Performansı Optimizasyonu

Core Web Vitals (LCP, INP, CLS) metriklerini anlayın, ölçün ve iyileştirerek Google sıralamalarını artırın.

Büyükweb Editör EkibiHosting, Sunucu ve Sistem Yönetimi Editörü10 dakika okuma

Teknik SEO Rehberi: Core Web Vitals ve Sayfa Performansı

Google'ın 2021'den itibaren sıralama faktörü olarak dahil ettiği Core Web Vitals, web sitenizin kullanıcı deneyimini sayısal olarak ölçer. Bu metrikleri optimize etmek hem sıralamanızı hem de dönüşüm oranlarınızı doğrudan etkiler.

Core Web Vitals Nedir?

1. LCP – Largest Contentful Paint (En Büyük İçerik Boyama)

Sayfanın görünen alanındaki en büyük içerik öğesinin ne kadar sürede yüklendiğini ölçer.

✅ İyi:    ≤ 2.5 saniye
⚠️ İyileştirme gerekli: 2.5 – 4.0 saniye
❌ Kötü:   > 4.0 saniye

LCP öğeleri genellikle:
- Hero görseller (<img>)
- Büyük metin blokları
- Video thumbnail'ları

2. INP – Interaction to Next Paint (Etkileşimden Sonraki Boyama)

Kullanıcının tıklama/dokunma/klavye etkileşimlerine sayfanın ne kadar hızlı yanıt verdiğini ölçer.

✅ İyi:    ≤ 200 ms
⚠️ İyileştirme gerekli: 200 – 500 ms
❌ Kötü:   > 500 ms

Not: INP, 2026'te FID'in (First Input Delay) yerini aldı

3. CLS – Cumulative Layout Shift (Kümülatif Düzen Kayması)

Sayfa yüklenirken öğelerin beklenmedik şekilde yer değiştirmesini ölçer.

✅ İyi:    ≤ 0.1
⚠️ İyileştirme gerekli: 0.1 – 0.25
❌ Kötü:   > 0.25

Örnek: Reklam yüklenince butonun kayması

Metrikleri Ölçme Araçları

Google PageSpeed Insights

https://pagespeed.web.dev/
- Lab data (simülasyon)
- Field data (gerçek kullanıcı verileri - CrUX)

Chrome DevTools

// Browser konsolunda CWV ölçümü
import {getLCP, getINP, getCLS} from 'web-vitals';

getLCP(console.log);
getINP(console.log);
getCLS(console.log);

Lighthouse CLI

npm install -g lighthouse
lighthouse https://siteniz.com --output html --output-path ./rapor.html

# CI/CD için
lighthouse https://siteniz.com --output json | jq '.categories.performance.score'

LCP Optimizasyonu

1. Görsel Optimizasyonu

<!-- Hero görsel için preload -->
<link rel="preload" as="image" href="/hero.webp"
      fetchpriority="high">

<!-- Responsive WebP görseller -->
<picture>
  <source srcset="/hero-800.webp 800w, /hero-1200.webp 1200w"
          type="image/webp">
  <img src="/hero-1200.jpg" alt="Hero görseli"
       width="1200" height="600"
       fetchpriority="high"
       loading="eager">
</picture>
# WebP dönüşümü (cwebp)
sudo apt install webp
cwebp -q 80 hero.jpg -o hero.webp

# Toplu dönüşüm
for img in *.jpg; do
    cwebp -q 80 "$img" -o "${img%.jpg}.webp"
done

2. Sunucu Yanıt Süresi (TTFB)

# Nginx gzip sıkıştırma
gzip on;
gzip_vary on;
gzip_min_length 1024;
gzip_types text/plain text/css text/javascript application/json application/javascript image/svg+xml;

# Browser cache
location ~* \.(js|css|png|jpg|jpeg|webp|ico|woff2)$ {
    expires 1y;
    add_header Cache-Control "public, immutable";
}

# FastCGI cache (PHP)
fastcgi_cache_path /var/cache/nginx levels=1:2 keys_zone=FASTCGI:100m inactive=60m;
fastcgi_cache_key "$scheme$request_method$host$request_uri";

3. Kritik CSS

<!-- Kritik CSS inline yükle -->
<style>
  /* Sadece above-the-fold CSS */
  body { margin: 0; font-family: sans-serif; }
  .hero { background: #1a1a2e; color: white; padding: 2rem; }
</style>

<!-- Diğer CSS'i async yükle -->
<link rel="preload" href="/style.css" as="style"
      onload="this.onload=null;this.rel='stylesheet'">

INP Optimizasyonu

JavaScript Uzun Görevleri Parçalama

// Kötü: Uzun senkron görev (UI'ı bloklar)
function agirIslem() {
  const sonuc = [];
  for (let i = 0; i < 1000000; i++) {
    sonuc.push(hesapla(i));
  }
  return sonuc;
}

// İyi: Görevi parçala
async function agirIslemOptimize() {
  const sonuc = [];
  for (let i = 0; i < 1000000; i++) {
    sonuc.push(hesapla(i));

    // Her 1000 işlemde bir event loop'a geri dön
    if (i % 1000 === 0) {
      await new Promise(resolve => setTimeout(resolve, 0));
    }
  }
  return sonuc;
}

// Veya scheduler API (yeni)
async function agirIslemScheduler() {
  const sonuc = [];
  for (let i = 0; i < 1000000; i++) {
    sonuc.push(hesapla(i));

    if (i % 1000 === 0 && navigator.scheduling?.isInputPending()) {
      await scheduler.yield();
    }
  }
  return sonuc;
}

Event Handler Optimizasyonu

// Kötü: Her scroll'da ağır işlem
document.addEventListener('scroll', agirHesaplama);

// İyi: Debounce/Throttle
import { throttle } from 'lodash';
document.addEventListener('scroll', throttle(agirHesaplama, 100));

// Daha iyi: Passive event listener
document.addEventListener('scroll', handler, { passive: true });

CLS Optimizasyonu

Görsellere Boyut Belirt

<!-- Kötü: Boyut yok, yüklendikçe layout kayar -->
<img src="urun.jpg" alt="Ürün">

<!-- İyi: width/height her zaman belirt -->
<img src="urun.jpg" alt="Ürün" width="400" height="300">
/* aspect-ratio ile responsive görseller */
.urun-gorseli {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

Font Yükleme

<!-- Font boyut değişimini önle -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preload" as="font" href="/fonts/inter.woff2"
      type="font/woff2" crossorigin>
/* font-display: swap yerine optional */
@font-face {
  font-family: 'Inter';
  src: url('/fonts/inter.woff2') format('woff2');
  font-display: optional; /* CLS'yi azaltır */
}

Dinamik İçerik

/* Reklam/banner için yer tutucu */
.reklam-alani {
  min-height: 90px; /* Beklenen reklam yüksekliği */
  background: #f0f0f0;
}

/* Skeleton loading */
.skeleton {
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 400% 100%;
  animation: skeleton-loading 1.5s infinite;
}

Diğer Teknik SEO Faktörleri

robots.txt

User-agent: *
Allow: /
Disallow: /admin/
Disallow: /api/
Sitemap: https://siteniz.com/sitemap.xml

Canonical URL'ler

<!-- Yinelenen içeriği önle -->
<link rel="canonical" href="https://siteniz.com/urun/laptop-dell-xps">

<!-- hreflang (çok dilli siteler) -->
<link rel="alternate" hreflang="tr" href="https://siteniz.com/tr/urun">
<link rel="alternate" hreflang="en" href="https://siteniz.com/en/product">

Yapısal Veri (Schema.org)

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "Makale Başlığı",
  "datePublished": "2026-01-15",
  "author": { "@type": "Person", "name": "Yazar Adı" }
}
</script>

Core Web Vitals ve teknik SEO, uzun vadeli organik büyüme için temel yatırımdır. Aylık düzenli ölçümler yaparak ilerlemenizi takip edin.


Büyükweb'in hızlı hosting altyapısı, SEO performansınızı doğrudan iyileştirir. Hosting planlarımızı keşfedin.


Ilgili Büyükweb Hizmetleri:

  • [Hızlı hosting ile SEO performansinizi arttirin](MASK27)
  • [WordPress hosting paketlerimiz](MASK28)
  • [Tüm hosting ve sunucu paketlerimiz](MASK29)

Teknik SEO Kontrol Listesi

Sayfa Hizi

Core Web Vitals: LCP < 2.5s, INP < 200ms, CLS < 0.1. TTFB 200ms alti. LiteSpeed hosting avantaj sağlar. WebP/AVIF resimler, lazy loading, CSS/JS minify.

Mobil Uyumluluk

Google mobile-first indexing kullaniyor. Responsive tasarim, dokunma hedefleri ve mobil hiz kritik.

Yapisal Veri

JSON-LD ile Product, FAQ, HowTo, Article schemalari. CTR %20-30 artış. Rich Results Test ile dogrulayin.

Içerik Stratejisi

Long-tail anahtar kelimelere odaklanin. Derinlemesine içerik oluşturun. Duzenli güncelleyin. E-A-T ilkelerine uyun.

Misafir yazılar ve teknik içeriklerle dogal profil. Spam linklerden kacinin. Rakip analizi yapin.

Lokal SEO

Google Business Profile oluşturun. Yerel anahtar kelimeleri hedefleyin. Müşteri yorumlari toplayin. NAP tutarliligi sağlayin.

Sik Sorulan Sorular

Hosting SEO etkiler mi?

Evet. Hiz, uptime, SSL ve lokasyon dogrudan etkiler. LiteSpeed + NVMe ideal.

Core Web Vitals nasil iyilestirilir?

LCP: resim optimize, lazy load. INP: JS azalt. CLS: boyut belirt, font-display swap.

Sonuc

SEO teknik altyapı ve içerik kalıtesinin birlesimdir. Hosting ile SEO stratejisini entegre ederek ust sıralara yukselin.

SEO Arac Kutusu

Ücretsiz SEO Araclari

  • Google Search Console: Indeksleme, arama performansi, teknik sorunlar
  • Google Analytics 4: Trafik, kullanıci davranisi, dönüşum
  • PageSpeed Insights: Core Web Vitals ve performans
  • Rich Results Test: Yapisal veri dogrulama
  • Screaming Frog (500 URL): Teknik SEO analizi

Ücretli SEO Araclari

  • Ahrefs: Backlink ve anahtar kelime analizi
  • SEMrush: Kapsamli SEO ve PPC
  • Surfer SEO: Içerik optimizasyonu

Içerik Pazarlama Stratejisi

Blog Yazisi Yapisi

  1. Dikkat cekici baslik (H1) - anahtar kelime icermeli
  2. Giris paragrafi - sorunu tanımla
  3. Alt basliklar ile mantıksal bolumler
  4. Görseller ve infografikler
  5. Dahili linkler
  6. CTA (Call to Action)
  7. SSS bolumu (FAQ schema)

Içerik Takvimi

Haftada 2-3 yazi yayinlayin. Mevsimsel trendleri takip edin. Evergreen ve trending içerik dengesi kurun.

Hosting ve Sunucu Terimleri Sozlugu

Terim Açıklama
VDS Virtual Dedicated Server - Sanal ozel sunucu
NVMe SSD Non-Volatile Memory Express - En hızlı disk teknolojisi
LiteSpeed Yüksek performansli web sunucu yazılimi
CloudLinux Paylasimli hosting icin kaynak izolasyon işletim sistemi
cPanel Populer web hosting kontrol paneli
Plesk Web hosting ve sunucu yönetim paneli
KVM Kernel-based Virtual Machine - Tam sanallastirma teknolojisi
DDoS Distributed Denial of Service - Dagitik hizmet engelleme saldirisi
SSL/TLS Veri iletişimini sifreleyen güvenlik protokolu
TTFB Time to First Byte - Sunucu yanit süresi
CDN Content Delivery Network - Içerik dagitim ağı
WAF Web Application Firewall - Web uygulama güvenligi duvari
IOPS Input/Output Operations Per Second - Disk performans ölçüsu
Uptime Sunucunun kesintisiz çalışma süresi yüzdesi
Bandwidth Veri transfer kapasitesi

Bu terimleri anlamak, hosting ve sunucu hizmetlerini daha bilinçli seçmenize yardımci olur. Detaylı bilgi icin Büyükweb blog yazılarini takip edin veya teknik destek ekibimize danisIn.

Büyükweb Hosting'in CWV Üzerindeki Etkisi

Core Web Vitals (LCP, INP, CLS) sıralama faktörlerinin önemli bir kısmı sunucu hızına bağlıdır. Büyükweb hosting altyapısının CWV'ye katkısı:

LCP (Largest Contentful Paint) — Hedef < 2.5 sn

LCP'yi belirleyen 4 ana etmen:

  1. Server response time (TTFB) → LiteSpeed + NVMe ile 100-200 ms seviyesinde
  2. Render-blocking resources → HTTP/2 multiplexing ile paralel yüklenir
  3. Resource load time → Brotli compression + CDN ile %30-50 azalır
  4. Client-side rendering → Server-side rendering tercih edilmeli

Büyükweb cPanel hosting paketlerinde tüm bu noktalar standart olarak gelir.

INP (Interaction to Next Paint) — Hedef < 200 ms

INP, kullanıcı bir butonu tıkladıktan sonra ekranın güncellenmesine kadar geçen sürenin 75. percentile'ı. Yüksek INP genelde:

  • Heavy JavaScript event handler'ları
  • Long task'lar (> 50 ms)
  • Main thread blocking

Çözüm:

  • Code splitting (React.lazy / Next.js dynamic import)
  • Debouncing / throttling
  • Web Worker'a heavy hesaplamayı taşı

CLS (Cumulative Layout Shift) — Hedef < 0.1

CLS sayfa yüklenirken görsel kaymaların toplamı:

  • Image dimensions tanımlı olmalıwidth ve height attribute
  • Web Fonts: font-display: optional veya swap + preload
  • Reklam alanları için sabit yer ayır

PageSpeed Insights ile Test

# Lighthouse CLI ile periyodik test
npx lighthouse https://siteniz.com --output=json --output-path=./lighthouse-report.json

# CrUX (Chrome User Experience) gerçek kullanıcı verisi
curl "https://chromeuxreport.googleapis.com/v1/records:queryRecord?key=API_KEY" \
  -H "Content-Type: application/json" \
  -d '{ "url": "https://siteniz.com", "metrics": ["largest_contentful_paint"] }'

Hedef: tüm metrikler mobil yeşilde. Mobil daha katı; desktop'ta yeşil olan mobilde sarı çıkabilir.

Hosting Tabanlı Optimizasyonlar

Büyükweb hosting paneli üzerinden yapabileceğiniz değişiklikler:

.htaccess ile Cache Control

<IfModule mod_expires.c>
  ExpiresActive On
  ExpiresByType image/webp "access plus 1 year"
  ExpiresByType text/css "access plus 1 month"
  ExpiresByType application/javascript "access plus 1 month"
</IfModule>

<IfModule mod_deflate.c>
  AddOutputFilterByType DEFLATE text/html text/css application/javascript
</IfModule>

LiteSpeed Cache (LSCache) Ayarları

cPanel paketlerinde LSCache otomatik aktif. Ek tuning:

# Statik dosyalar için 1 yıl
<IfModule LiteSpeed>
  CacheLookup on
  ExpiresByType image/webp "access plus 1 year"
</IfModule>

WordPress kullanıyorsanız LiteSpeed Cache plugin kuralları ile object cache + page cache + CDN entegrasyonu tek panelden.

Sıkça Sorulan Sorular

Hosting paketim CWV'yi geçirmeme yardımcı olur mu?

Doğrudan: NVMe SSD + LiteSpeed = düşük TTFB. Dolaylı: HTTP/2/3, Brotli compression, AutoSSL hepsi standart. Büyükweb cPanel hosting ile temel CWV hedefleri kolaylıkla yakalanır.

Paylaşımlı hosting'te CWV iyi olur mu?

Evet — komşu hesabın yükü CloudLinux ile izole edilir. Yine de yüksek trafik (10K+ DAU) için VDS daha kararlı performans sağlar.

CDN şart mı?

Tek lokasyonlu Türkiye trafiği için şart değil, Büyükweb Bursa lokasyonu zaten düşük gecikmeli. Global trafik veya yüksek paralel kullanıcı varsa Cloudflare ücretsiz CDN faydalı.

Mobil PageSpeed neden masaüstünden daha düşük?

Lighthouse mobil simülasyonu 3G/4G yavaş ağ ve düşük CPU ile test eder. Aynı sayfa masaüstünde 95, mobilde 65 olabilir; bu normal. Mobilde 75+ hedeflenebilir.

İlgili Büyükweb Hizmetleri

Hız ve uptime, sıralama için kritik. Türkiye lokasyonlu hızlı hosting paketlerimiz:

Sorularınız için 0850 302 60 70 numaralı destek hattımıza veya iletişim sayfamıza yazabilirsiniz.

SEO & Dijital Pazarlama İlgili Hizmetlerimiz

Bu yazıda anlatılan teknik konuyu profesyonel altyapıyla deneyimleyin

Etiketler:

#performans optimizasyonu#optimizasyon#seo#dijital pazarlama#arama motoru optimizasyonu

Bu yazıyı paylaş