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.
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.
Buyukweb'in hızlı hosting altyapısı, SEO performansınızı doğrudan iyileştirir. Hosting planlarımızı keşfedin.
Ilgili Buyukweb Hizmetleri:
- Hizli hosting ile SEO performansinizi arttirin
- WordPress hosting paketlerimiz
- Tum hosting ve sunucu paketlerimiz
Teknik SEO Kontrol Listesi
Sayfa Hizi
Core Web Vitals: LCP < 2.5s, INP < 200ms, CLS < 0.1. TTFB 200ms alti. LiteSpeed hosting avantaj saglar. 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 artis. Rich Results Test ile dogrulayin.
Icerik Stratejisi
Long-tail anahtar kelimelere odaklanin. Derinlemesine icerik olusturun. Duzenli guncelleyin. E-A-T ilkelerine uyun.
Backlink
Misafir yazilar ve teknik iceriklerle dogal profil. Spam linklerden kacinin. Rakip analizi yapin.
Lokal SEO
Google Business Profile olusturun. Yerel anahtar kelimeleri hedefleyin. Musteri yorumlari toplayin. NAP tutarliligi saglayin.
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 altyapi ve icerik kalitesinin birlesimdir. Hosting ile SEO stratejisini entegre ederek ust siralara yukselin.
SEO Arac Kutusu
Ucretsiz SEO Araclari
- Google Search Console: Indeksleme, arama performansi, teknik sorunlar
- Google Analytics 4: Trafik, kullanici davranisi, donusum
- PageSpeed Insights: Core Web Vitals ve performans
- Rich Results Test: Yapisal veri dogrulama
- Screaming Frog (500 URL): Teknik SEO analizi
Ucretli SEO Araclari
- Ahrefs: Backlink ve anahtar kelime analizi
- SEMrush: Kapsamli SEO ve PPC
- Surfer SEO: Icerik optimizasyonu
Icerik Pazarlama Stratejisi
Blog Yazisi Yapisi
- Dikkat cekici baslik (H1) - anahtar kelime icermeli
- Giris paragrafi - sorunu tanimla
- Alt basliklar ile mantiksal bolumler
- Gorseller ve infografikler
- Dahili linkler
- CTA (Call to Action)
- SSS bolumu (FAQ schema)
Icerik Takvimi
Haftada 2-3 yazi yayinlayin. Mevsimsel trendleri takip edin. Evergreen ve trending icerik dengesi kurun.
Hosting ve Sunucu Terimleri Sozlugu
| Terim | Aciklama |
|---|---|
| VDS | Virtual Dedicated Server - Sanal ozel sunucu |
| NVMe SSD | Non-Volatile Memory Express - En hizli disk teknolojisi |
| LiteSpeed | Yuksek performansli web sunucu yazilimi |
| CloudLinux | Paylasimli hosting icin kaynak izolasyon isletim sistemi |
| cPanel | Populer web hosting kontrol paneli |
| Plesk | Web hosting ve sunucu yonetim paneli |
| KVM | Kernel-based Virtual Machine - Tam sanallastirma teknolojisi |
| DDoS | Distributed Denial of Service - Dagitik hizmet engelleme saldirisi |
| SSL/TLS | Veri iletisimini sifreleyen guvenlik protokolu |
| TTFB | Time to First Byte - Sunucu yanit suresi |
| CDN | Content Delivery Network - Icerik dagitim agi |
| WAF | Web Application Firewall - Web uygulama guvenligi duvari |
| IOPS | Input/Output Operations Per Second - Disk performans olcusu |
| Uptime | Sunucunun kesintisiz calisma suresi yuzdesi |
| Bandwidth | Veri transfer kapasitesi |
Bu terimleri anlamak, hosting ve sunucu hizmetlerini daha bilinçli secmenize yardimci olur. Detayli bilgi icin Buyukweb blog yazilarini takip edin veya teknik destek ekibimize danisIn.
Etiketler:
