Page Speed Insights Kullanımı: Adım Adım Performans Optimizasyonu

Page Speed Insights Kullanımı Nedir?

Page Speed Insights kullanımı, Google'ın ücretsiz aracı olan Page Speed Insights (PSI) ile bir web sayfasının performansını ölçmek, analiz etmek ve iyileştirme önerilerini uygulamak için izlenen sistematik süreçtir.

Bu analizi yapmamak, sitenizin yavaş olmasına rağmen nedenini ve çözümünü bilememek anlamına gelir; bu da ziyaretçi kaybı ve para kaybı riski demektir.

Çekirdek Web Vital'ları (Core Web Vitals): Google'ın sayfa kullanıcı deneyimini ölçmek için belirlediği üç temel metrik: LCP (En Büyük İçeriğin Boyanması), FID (İlk Giriş Gecikmesi) ve CLS (Kümülatif Düzen Kayması).
Laboratuvar Verileri (Lab Data): Kontrollü bir ortamda (genellikle bir cihaz ve ağ simülasyonunda) yapılan ve tutarlı sonuçlar veren performans ölçümleri.
Saha Verileri (Field Data): Gerçek kullanıcılardan toplanan ve "Gerçek Kullanıcı Deneyimleri" olarak da adlandırılan, gerçek dünya koşullarını yansıtan performans verileri.
Performans Puanı: Sayfanın hızını 0-100 arası bir değerle özetleyen, laboratuvar verilerine dayalı bir gösterge.
İyileştirme Önerileri (Opportunities & Diagnostics): PSI'nın, görüntü boyutlandırması, CSS/JS kod optimizasyonu, önbellekleme gibi alanlarda sunduğu somut iyileştirme adımları.
Mobil ve Masaüstü Ayrımı: Araç, varsayılan ve öncelikli olarak mobil performansı test eder ve ayrıca masaüstü performansını da raporlar.
Teknik Denetim (Lighthouse): PSI'nın altında çalışan, performansın yanı sıra erişilebilirlik, SEO ve en iyi uygulamaları da denetleyen açık kaynaklı otomasyon aracı.
Sürekli İzleme: Performansın tek seferlik bir kontrol değil, düzenli aralıklarla izlenmesi gereken dinamik bir süreç olması.

Ürün ekipleri, pazarlama yöneticileri ve site sahipleri için en büyük faydayı sağlar. Sorunun "sitem yavaş" şikayetinden, "JavaScript yürütme süresi LCP'yi 800ms geciktiriyor" gibi somut, çözülebilir bir soruna dönüşmesini sağlar.

Özetle: Page Speed Insights kullanımı, web sayfası hız sorunlarını bulanık bir şikayetten, ölçülebilir ve düzeltilebilir teknik görevlere dönüştüren bir analiz ve eylem sürecidir.

İşletmeler İçin Neden Önemli?

Sayfa hızını görmezden gelmek, rakiplerinize karşı sessizce müşteri ve gelir kaybetmek anlamına gelir, çünkü yavaş bir site kullanıcı deneyimini doğrudan sabote eder.

Yüksek Hemen Çıkma Oranı: 3 saniyeden uzun süren yükleme süreleri, ziyaretçilerin %40'ının siteyi terk etmesine neden olur. Hız optimizasyonu, kullanıcıyı sitede tutmanın ilk adımıdır.
Düşük Dönüşüm Oranları: Her ek saniye, dönüşüm oranlarında düşüş demektir. Hızlanan bir site, sepete ekleme ve satın alma işlemlerini doğrudan artırır.
Zayıf SEO Sıralaması: Google, 2021'den beri sayfa deneyimi ve Çekirdek Web Vital'ları sıralama faktörü olarak kullanıyor. Yavaş siteler arama sonuçlarında geriye düşer.
Boşa Giden Reklam Bütçesi: Ücretli reklamlarla getirilen trafik, yavaş bir landing page ile karşılaşırsa hemen çıkar. Bu, reklam harcamasının etkisini ve ROI'yi ciddi şekilde düşürür.
Mobil Kullanıcı Kaybı: Mobil trafiğin hakim olduğu bir dünyada, mobil performansı kötü olan bir site, potansiyel müşterilerin büyük çoğunluğuna kötü bir ilk izlenim sunar.
Marka İtibarı Zedelenmesi: Yavaş ve tıkanan bir site, markanızı profesyonellikten uzak ve teknolojik olarak geri kalmış olarak yansıtabilir.
Teknik Borç Birikimi: Performans sorunları genellikle kod ve altyapıdaki kök sorunların belirtisidir. Bunları ertelemek, gelecekte düzeltilmesi çok daha maliyetli bir teknik borç yaratır.
Rakiplere Karşı Rekabet Kaybı: Sektörünüzdeki rakiplerin siteleri sizinkinden daha hızlıysa, savaşı ilk tıklamada kaybediyorsunuz demektir.

Özetle: Sayfa hızı sadece bir teknik detay değil, doğrudan gelir, müşteri memnuniyeti ve çevrimiçi görünürlüğü etkileyen kritik bir iş metriğidir.

Adım Adım Kılavuz

Birçok kişi PSI raporunu açıp gördüğü teknik terimler ve çok sayıda öneri karşısında nereden başlayacağını bilemez.

Adım 1: Analiz Edilecek Sayfayı ve Hedefi Belirleyin

Karşınızda tüm siteyi test etme dürtüsüne direnin. En yüksek trafiğe sahip sayfalarınızdan (ana sayfa, en popüler ürün/blog sayfası, landing page) başlayın. Amacınız, en büyük etkiyi yaratacak sayfaları önceliklendirmek olmalı.

Adım 2: Page Speed Insights'ta Testi Çalıştırın

Tarayıcınızda https://pagespeed.web.dev/ adresine gidin. Analiz etmek istediğiniz sayfanın URL'sini girin ve "Analiz Et" butonuna tıklayın. Mobil test varsayılandır; masaüstü için de ayrıca test yapın.

Adım 3: Performans Puanını ve Çekirdek Web Vital'larını Okuyun

İlk bakışta Performans puanına (0-100) ve Çekirdek Web Vital'larının durumuna ("İyi", "Geliştirilmeli", "Zayıf") odaklanın. Bu iki alan, durumunuzun genel bir özetini verir.

Hızlı Kontrol: Tüm Çekirdek Web Vital'ları "İyi" mi? Değilse, hangileri sorunlu?

Adım 4: "İyileştirme Fırsatları"na Derinlemesine Dalın

Bu bölüm, en büyük kazanımları sağlayacak somut eylemleri listeler. Her maddenin tahmini süre kazancına dikkat edin.

Görselleri Etkin Hale Getir: Görselleri modern formatlara (WebP/AVIF) dönüştürün, boyutlandırın ve tembel yükleyin.
Kullanılmayan JavaScript'i Kaldır: Sayfada ihtiyaç duyulmayan JS kodlarını temizleyin veya ertelenmiş/deferred olarak yükleyin.
İlk Görüntülenen İçeriği İyileştir: Kritik CSS'yi satır içi (inline) yapın, render engelleyici kaynakları erteleyin.

Adım 5: "Teşhisler" Bölümünü Anlayın

Bu bölüm, performansı etkileyen ek bilgiler sağlar. "DOM boyutu" çok büyük mü? "JavaScript yürütme süresi" çok mu uzun? Buradaki maddeler, sorunun kök nedenini anlamanıza yardımcı olur.

Adım 6: Mobil ve Masaüstü Sonuçlarını Karşılaştırın

Genellikle mobil performans daha sorunludur. İki rapor arasındaki farkları not edin. Mobilde sorun olup masaüstünde olmayan öğeler, mobil öncelikli optimizasyon gerektirir.

Adım 7: Önerileri Teknik Ekibinizle Görevlere Dönüştürün

PSI bir teşhis aracıdır, tedavi değil. "Görselleri optimize et" önerisini, "Ana sayfadaki 5 hero görselini WebP'ye çevir ve max-width: 100% ile boyutlandır" şeklinde somut bir teknik göreve dönüştürün.

Adım 8: Değişiklikleri Yaptıktan Sonra Tekrar Test Edin

Her önemli değişiklik veya düzenli aralıklarla (örneğin ayda bir) aynı sayfayı tekrar test edin. Performans puanı ve Çekirdek Web Vital'lardaki değişimi izleyerek iyileştirmelerin etkisini ölçün.

Özetle: Page Speed Insights kullanımı, analiz et, önceliklendir, somut görevlere dönüştür, uygula ve sonucu tekrar ölç şeklinde tekrarlanan bir döngüdür.

Sık Yapılan Hatalar ve Kırmızı Bayraklar

Bu hatalar genellikle performans optimizasyonunun tek seferlik bir "kontrol" değil, sürekli bir süreç olduğunun anlaşılmamasından kaynaklanır.

Sadece Performans Puanına Takılmak: Puan tek başına yanıltıcı olabilir. Çekirdek Web Vital'lar "İyi" olsa bile, kullanıcı deneyimini bozan diğer sorunları (örneğin, büyük DOM) gözden kaçırabilirsiniz. Çözüm: Puanı bir genel gösterge olarak alın, ancak asıl odağınız Çekirdek Web Vital'lar ve iyileştirme fırsatları olsun.
Yalnızca Laboratuvar Verilerine Güvenmek: PSI'nın laboratuvar testi simüle edilmiş bir ortamda çalışır. Gerçek kullanıcılarınızın farklı cihaz ve ağlarda yaşadığı deneyimi tam yansıtmayabilir. Çözüm: Gerçek kullanıcı verileri için Google Search Console'daki "Çekirdek Web Vital'lar" raporunu veya analiz araçlarınızın RUM (Real User Monitoring) özelliğini kullanın.
Tüm Önerileri Körü Körüne Uygulamaya Çalışmak: Her "iyileştirme fırsatı" sizin önceliğiniz olmayabilir. 0.1 saniye kazandıracak küçük bir öneri için kompleks bir yapı değişikliği yapmak verimli değildir. Çözüm: En yüksek tahmini süre kazancı sağlayan önerileri ve en kritik Çekirdek Web Vital sorunlarını önceliklendirin.
Mobil Performansı İhmal Etmek: Testi yalnızca masaüstü için çalıştırıp mobilde de aynı sonucu alacağınızı varsaymak büyük hatadır. Çözüm: PSI, mobil testi varsayılan yapar ve bu doğru bir yaklaşımdır. Her analizi öncelikle mobil için yapın ve sonuçları karşılaştırın.
Üçüncü Taraf Kodlarını Görmezden Gelmek: Reklam script'leri, analiz araçları, sosyal medya widget'ları gibi üçüncü taraf kodlar performansı ciddi şekilde yavaşlatabilir. PSI bunları doğrudan gösteremeyebilir. Çözüm: Tarayıcı geliştirici araçlarının "Network" sekmesinde üçüncü taraf kaynakları kontrol edin ve gereksiz olanları kaldırın veya yüklemelerini geciktirin.
Optimizasyon Sonrası Doğrulama Yapmamak: Bir değişiklik yapıp "artık daha hızlıdır" diyerek bir daha test etmemek. Bazen bir optimizasyon, beklenmeyen başka bir yerde sorun yaratabilir. Çözüm: Her önemli değişiklikten sonra sayfayı PSI'da tekrar test edin ve sonuçları önceki raporla karşılaştırın.
"İyi" Puan Aldıktan Sonra Süreci Durdurmak: Web siteleri dinamiktir; yeni özellikler, içerikler ve kodlar ekledikçe performans yeniden bozulabilir. Çözüm: Performans izlemeyi, özellikle büyük güncellemelerden sonra düzenli bir süreç haline getirin.

Özetle: En büyük hata, PSI raporunu yüzeysel okumak ve gerçek kullanıcı deneyimi ile süreklilik bağını kurmamaktır.

Araçlar ve Kaynaklar

Doğru araçları seçmek, performans optimizasyonu karmaşasını yapılandırılmış bir iş akışına dönüştürür.

Ücretsiz Çevrimiçi Test Araçları: Hızlı, tek seferlik kontroller için idealdir. Page Speed Insights temel başlangıç noktasıdır. GTmetrix veya WebPageTest gibi araçlar farklı sunucu lokasyonlarından ve tarayıcılardan test yaparak ek perspektif sunar.
Gerçek Kullanıcı İzleme (RUM) Çözümleri: Sitenizin gerçek ziyaretçilerinin tüm coğrafya, cihaz ve ağ koşullarındaki performansını sürekli ölçmek için gereklidir. Bu, PSI'nın laboratuvar verilerini tamamlayan hayati bir veri kaynağıdır.
Entegre Geliştirici Araçları: Tarayıcınızın yerleşik "Network", "Performance" ve "Lighthouse" sekmesi, sorunları yerinde teşhis etmek ve hata ayıklamak için vazgeçilmezdir. Özellikle "Performance" sekmesi, sayfa yüklenmesinin milisaniye milisaniye profilini çıkarır.
CI/CD Entegrasyon Araçları: Lighthouse CI veya Sitespeed.io gibi araçlar, performans testlerini yazılım geliştirme sürecinize (CI/CD pipeline) entegre eder. Her yeni kod birleştirmesinde performans gerilemesi olup olmadığını otomatik olarak kontrol eder.
Görsel ve Kod Optimizasyon Paketleri: Geliştirme sürecinizin bir parçası olarak görselleri otomatik optimize eden (sharp, imagemin) veya JavaScript/CSS'yi minify eden (Webpack, Vite) build araçları, temel iyileştirmeleri otomatikleştirir.
İçerik Dağıtım Ağı (CDN) ve Optimizasyon Hizmetleri: Static asset'lerinizi küresel olarak dağıtmanın yanı sıra, birçok modern CDN resim optimizasyonu, JS/CSS minification ve hatta frontend optimizasyonu (ör. Cloudflare Mirage, Auto Minify) gibi ek katmanlar sunar.
Performans İzleme ve Raporlama Platformları: Daha büyük ekipler için, farklı sayfa ve kullanıcı segmentleri için performans metriklerini merkezi olarak izleyen, uyarılar gönderen ve trend analizi yapan özel platformlar mevcuttur.
Resmi Dokümantasyon ve Kılavuzlar: web.dev, Google'ın geliştiriciler için hazırladığı, performans optimizasyonu da dahil tüm modern web geliştirme konularında en güncel ve güvenilir kaynaktır.

Özetle: İhtiyacınız olan araç, hızlı bir kontrol mü, sürekli izleme mi yoksa otomasyon mu istediğinize bağlı olarak değişir; doğru kombinasyonu kurmak anahtardır.

Bilarna Nasıl Yardımcı Olabilir?

Page Speed Insights raporunu aldıktan sonra, çıkan teknik iyileştirmeleri (CDN kurulumu, gelişmiş önbellekleme, frontend kod optimizasyonu) kimin yapacağını ve hangi çözümün işinize uygun olduğunu bulmak karmaşık olabilir.

Bilarna, bu teknik ihtiyaçlarınızı karşılayabilecek doğrulanmış yazılım ve hizmet sağlayıcılarına verimli bir şekilde bağlanmanızı sağlayan, yapay zeka destekli bir B2B pazar yeridir. Performans optimizasyonu, modern web ajanslarının, bağımsız geliştirici ekiplerinin ve özel CDN/cloud sağlayıcılarının sunduğu temel hizmetlerden biridir.

Platform, ihtiyaçlarınızı girerek size özel olarak eşleşen teklifler almanıza olanak tanır. Doğrulanmış Sağlayıcı Programı, listelenen şirketlerin geçmiş işlerini ve uzmanlık alanlarını şeffaf bir şekilde görmenizi sağlayarak, güvenilir bir ortak seçimi süreci sunar.

Sık Sorulan Sorular

S: PSI puanım 90'ın üzerinde ama site hala bana yavaş geliyor. Neden?

Bunun birkaç olası nedeni var. PSI laboratuvar verilerine dayanır ve sabit koşulları simüle eder. Gerçek kullanıcılarınız daha yavaş cihazlar veya dengesiz mobil ağlar kullanıyor olabilir. Ayrıca, sayfa etkileşim sonrası yavaşlıyor olabilir (örneğin, kaydırırken veya bir butona tıkladıktan sonra). Sonraki Adım: Gerçek kullanıcı izleme (RUM) aracı kurun ve tarayıcı geliştirici araçlarının "Performance" sekmesini kullanarak sayfanın tam etkileşim sürecini profileyin.

S: "İlk Giriş Gecikmesi (FID)" yerine neden "Etkileşime Geçme Süresi (INP)" görüyorum?

Google, Mart 2024'ten itibaren Çekirdek Web Vital'lar içindeki FID metriğini, daha kapsamlı bir ölçüm olan INP (Interaction to Next Paint) ile değiştirmiştir. INP, sayfadaki tüm etkileşimlerin (tıklama, dokunma, klavye) duyarlılığını ölçer. PSI artık INP'yi raporluyor. Sonraki Adım: Artık optimizasyon önceliğiniz INP metriğini "İyi" seviyeye getirmek olmalı. Bu genellikle uzun JavaScript görevlerini bölmekle ilgilidir.

S: PSI önerilerini uygulamak için mutlaka bir geliştirici mi kiralamam gerekiyor?

Evet, önerilerin büyük çoğunluğu (JavaScript'i küçültmek, kritik CSS'yi çıkarmak, sunucu yanıt süresini iyileştirmek) teknik bilgi ve kod erişimi gerektirir. İçerik yönetim sisteminiz (CMS) için optimizasyon eklentileri kısmi çözümler sunabilir, ancak köklü iyileştirmeler genellikle bir frontend veya full-stack geliştiricinin müdahalesini gerektirir. Sonraki Adım: PSI raporunuzu, proje gereksinimlerinizle birlikte potansiyel bir geliştirici veya ajansa anlaşılır bir iş tanımı olarak sunun.

S: Kaç saniye ideal bir yükleme süresidir? Hedefim ne olmalı?

Saniye bazında sabit bir hedeften ziyade, metrik bazlı hedefler daha sağlıklıdır. Google'ın önerdiği Çekirdek Web Vital eşikleri en iyi kılavuzunuzdur:

LCP: 2.5 saniye veya daha kısa.
INP: 200 milisaniye veya daha kısa.
CLS: 0.1 veya daha düşük.

Sonraki Adım: Tüm sayfalarınızda bu üç metriği "İyi" aralığa getirmeyi birincil performans hedefiniz yapın.

S: Web sitem bir e-ticaret platformu (örn. Shopify, WooCommerce). PSI sonuçlarını iyileştirmek için ne yapabilirim?

Platformunuz size köklü backend değişiklikleri yapma şansı vermeyebilir, ancak yine de yapabileceğiniz çok şey var: Tema seçimi (hafif, optimize edilmiş temaları tercih edin), görsel optimizasyonu(ürün fotoğraflarını kesinlikle optimize edin), ve gereksiz üçüncü taraf uygulamaları/script'leri kaldırmak başlıca kontrollerinizdir. Ayrıca, platforma özel CDN ve önbellekleme eklentilerini araştırın. Sonraki Adım: PSI'da ana sayfa ve en önemli ürün sayfanızı test edin ve "İyileştirme Fırsatları"nda platformunuzda değiştirebileceğiniz öğelere (genellikle görseller ve bazı CSS/JS) odaklanın.

S: Performansı etkilemeden görsel kalitesini nasıl korurum?

Modern görsel formatları (WebP, AVIF) eski formatlara (JPEG, PNG) göre çok daha küçük dosya boyutlarında neredeyse aynı kaliteyi sunar. Doğru sıkıştırma ayarı (quality: 75-85 genellikle yeterlidir) ve duyarlı (responsive) görseller kullanmak (küçük ekranlara büyük dosya göndermemek) anahtardır. Sonraki Adım: Görsellerinizi Squoosh.app gibi bir araçla WebP'ye dönüştürüp kaliteyi karşılaştırın. Tüm görsellerinizde `srcset` attribute'unu kullanarak duyarlı hale getirin.