Lighthouse testi, bir web sitesinin hız, erişilebilirlik, SEO, performans ve en iyi uygulamalar açısından teknik kalitesini ölçmek için kullanılan en güvenilir denetim araçlarından biridir. Google Chrome’a entegre olarak çalışan Lighthouse, sayfa yüklenme davranışlarını gerçek kullanıcı senaryolarına göre analiz eder ve geliştirilmesi gereken alanları ayrıntılı bir rapor halinde sunar. Web geliştiricileri, SEO uzmanları ve dijital pazarlamacılar için kritik önem taşıyan bu test, bir sitenin hem kullanıcı deneyimini hem de arama motoru görünürlüğünü iyileştirmek adına güçlü bir rehber niteliğindedir. Bu yazıda Lighthouse testinin nasıl yapılacağını ve sonuçların nasıl yorumlanacağını ele alacağız.
Google Lighthouse, 2017’den beri geliştirilen ve bugün milyonlarca geliştirici ile SEO uzmanının vazgeçilmezi haline gelen açık kaynaklı bir denetim aracıdır. Magmaroot Web Tasarım Ajansı olarak 10+ yıldır yüzlerce kurumsal projede Lighthouse skorlarını 90+ bandına taşımış bir ekip olarak, bu rehberi sizin için 2026 gerçeklerine göre güncelledik.
Lighthouse Nedir ve Neden Hayat Kurtarır?
Lighthouse, bir web sayfasını 5 ana başlıkta denetler:
- Performance (Performans)
- Accessibility (Erişilebilirlik)
- Best Practices (En İyi Uygulamalar)
- SEO
- Progressive Web App (PWA)
2026’da Google, LCP’nin 2,5 saniye altında olmasını “iyi” kabul ederken, INP (Interaction to Next Paint) değerinin 200 ms altında olmasını zorunlu hale getirdi. Lighthouse, bu metrikleri laboratuvar ve saha verileriyle birlikte sunan tek resmi araçtır.
Lighthouse’i Çalıştırmanın 5 Farklı Yolu (2026 Güncel)
1. Chrome DevTools Üzerinden (En Hızlı Yöntem)
- Chrome’da Ctrl+Shift+I (Mac: Cmd+Option+I)
- “Lighthouse” sekmesine tıklayın
- Denetlemek istediğiniz kategorileri seçin (hepsini seçmenizi öneririz)
- “Device” kısmında Mobile / Desktop seçin
- “Generate report” butonuna basın
2. PageSpeed Insights (psi.dev)
2023’ten beri tamamen Lighthouse 11+ motorunu kullanır. Artısı: Hem lab hem de gerçek kullanıcı (CrUX) verilerini aynı anda gösterir.
3. Web.dev/measure
En güncel Lighthouse sürümünü (şu an 12.2) kullanır ve raporları kalıcı link olarak paylaşmanıza olanak tanır.
4. Lighthouse CLI (Terminal Üzerinden)
# Kurulum
npm install -g lighthouse
# Tek sayfa testi
lighthouse https://ornek-site.com --view --output=html --output=json --chrome-flags="--headless"
# Sadece mobil
lighthouse https://ornek-site.com --emulated-form-factor=mobile --throttling-method=devtools5. CI/CD Entegrasyonu (GitHub Actions Örneği)
name: Lighthouse CI
on: [push, pull_request]
jobs:
lighthouse:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- name: Lighthouse Testi
uses: treosh/lighthouse-ci-action@v12
with:
urls: |
https://ornek-site.com/
https://ornek-site.com/hizmetler
budgetPath: .lighthouserc-budget.json
uploadArtifacts: trueLighthouse Skorları Nasıl Yorumlanır? (2026 Kriterleri)
| Skor Aralığı | Renk | Açıklama (2026) |
|---|---|---|
| 90–100 | Yeşil | Mükemmel – sıralama avantajı kesin |
| 50–89 | Turuncu | İyileştirme gerekli – orta risk |
| 0–49 | Kırmızı | Ciddi sorun – sıralama kaybı kaçınılmaz |
Performance Kategorisi Detayları
| Metrik | İyi Değer (2026) | Ağırlık % |
|---|---|---|
| LCP | ≤ 2.5s | 30% |
| INP | ≤ 200ms | 25% |
| CLS | ≤ 0.1 | 15% |
| FCP | ≤ 1.8s | 10% |
| TTFB | ≤ 600ms | 10% |
| TBT | ≤ 300ms | 10% |
En Sık Karşılaşılan 15 Lighthouse Hatası ve Çözümleri
- Render-blocking resources → CSS/JS kritik yol optimizasyonu → JavaScript Optimizasyon Teknikleri
- Unused JavaScript → Tree-shaking + code splitting
- Large layout shifts → Font-display: swap + width/height tanımlama
- Missing meta viewport → Her projede zorunlu
- Image elements do not have explicit width and height → Responsive images tekniklerini uygulayın → Görsel Optimizasyonu
- Serve images in next-gen formats → WebP + AVIF zorunlu → Görsellerde WebP ve Yeni Nesil Formatların Önemi
- Tap targets are not sized appropriately → Minimum 48x48px dokunma alanı
Tablo: En çok puan düşüren 10 hata ve ortalama kayıp puanları (2026 verileri)
| Hata | Ortalama Puan Kaybı |
|---|---|
| Render-blocking JS/CSS | 18–35 puan |
| Unused JavaScript | 12–28 puan |
| No width/height on images | 8–22 puan |
| Large CLS kaynaklı layout kaymaları | 10–20 puan |
Lighthouse 100/100 Skoru Gerçekçi mi?
Evet, ama yalnızca statik sitelerde veya aşırı optimize edilmiş projelerde. Magmaroot olarak 2025-2026’da 40+ projede 98–100 arası skor aldık. 100/100 alan son projemiz bir Next.js + Image Optimization + Edge CDN kombinasyonuyla mümkün oldu.
Lighthouse Raporunu Müşteriye Sunma Şablonu
- Genel Skor Tablosu
- Kritik Hatalar (Kırmızı alanlar)
- Öncelik Sırasına Göre İyileştirme Listesi
- Tahmini Organik Trafik Artış Yüzdesi
- 30–60–90 Günlük Road Map
Özet: 5 Adımda Lighthouse Ustası Olun
- Her sprint sonunda Lighthouse çalıştırın
- Skoru 90 altına düştüğünde alarm kurun
- CI/CD’de başarısız olduğunda merge’i engelleyin
- Accessibility skorunu asla 95’in altına düşürmeyin (Google 2026’da bunu da sıralama faktörü yapıyor)
- Raporları müşteriye düzenli gönderin → güven ve otorite kazanımı
Bu konular da ilginizi çekebilir:
- Core Web Vitals Nasıl İyileştirilir?
- WordPress Hız Optimizasyonu Rehberi
- Elementor İçin Performans İyileştirme
- CDN Kullanımı Neden Önemli?
- Teknik SEO Nedir? Başlangıç Rehberi
- 2025 Web Tasarım Trendleri
- JavaScript Optimizasyon Teknikleri
- Görsel Optimizasyonu: En İyi Uygulamalar
- Görsellerde WebP ve Yeni Nesil Formatların Önemi
- Dönüşüm Odaklı Tasarım (CRO) Nedir?
- A/B Testi Nedir? Nasıl Yapılır?
Sık Sorulan Sorular
Tek sayfa için ortalama 30–90 saniye. CLI ile batch testi saatler alabilir.
2026 itibarıyla yok. PageSpeed Insights artık doğrudan Lighthouse 12+ kullanır.
Hayır, ama ölçtüğü Core Web Vitals metrikleri doğrudan etkiler.
Çünkü CPU ve ağ throttling değerleri farklıdır. Mobil her zaman daha zorlayıcıdır.
Hayır. 90+ zaten yeşil bölgedir ve sıralama avantajı sağlar.
npm install -g lighthouse@latest komutu yeterlidir.
Genelde contrast oranı, alt etiket eksikliği ve ARIA hatalarından kaynaklanır.
Chrome DevTools’tan çalıştırdıysanız sağ üstteki “Download report” butonuyla.