Bir müşteri reklamınıza ya da Google'daki sonucunuza dokundu; ekranda ise yalnız beyaz bir sayfa var. Birkaç saniye sonra geri tuşuna basıp başka bir siteye geçer. Yavaşlık sessiz bir kayıptır: kimse "siteniz yavaştı" diye yazmaz, sadece gider. İyi haber şu ki yavaşlığın nedenleri büyük ölçüde bilinir ve ölçülebilir. Bu rehberde Google'ın ücretsiz aracı PageSpeed Insights'ı okumayı ve iyileştirmeye nereden başlayacağınızı anlatıyoruz.
PageSpeed Insights'ı Okumak
pagespeed.web.dev adresine sayfanızın adresini yazdığınızda araç mobil ve masaüstü için ayrı sonuç verir. Müşterileriniz çoğunlukla telefondan geliyorsa önce mobil sonuca bakın. Sonuç sayfasında iki tür veri vardır ve ikisini karıştırmamak gerekir.
Saha Verisi: Gerçek Ziyaretçiler
Sayfanın üst kısmında, gerçek Chrome kullanıcılarından toplanan ve son 28 güne ait veriler yer alır. Bu bölüm sitenizin ziyaretçilerde gerçekten nasıl çalıştığını gösterir ve Core Web Vitals değerlendirmesinin geçip geçmediğini söyler. Trafiği az olan sayfalarda bu veri bulunmayabilir; o zaman araç yeterli veri olmadığını belirtir.
Laboratuvar Verisi: Kontrollü Test
Alt kısımdaki 0–100 arası puan ve ölçümler, sayfanın o an belirli bir cihaz ve bağlantı hızı varsayılarak bir kez test edilmesiyle çıkar; bu testi Lighthouse adlı araç yapar. Laboratuvar verisi sorunları bulmak ve bir değişikliğin etkisini hemen görmek için kullanışlıdır. Ama tek bir test olduğu için puan her çalıştırmada biraz oynayabilir.
İki veri farklı şey söyleyebilir: laboratuvarda puan düşük çıkarken saha verisi iyi olabilir ya da tersi. Gerçek deneyimi yansıtan ve Google'ın sayfa deneyimini değerlendirirken baktığı, saha verisidir; puan ise yol göstericidir. Puanı 100 yapmaya uğraşmak yerine saha verisindeki ölçüleri iyi bölgeye taşımayı hedefleyin.
Core Web Vitals Eşikleri
Core Web Vitals, Google'ın sayfa deneyimi için öne çıkardığı üç ölçüdür. Her biri için "iyi" sayılan eşik şöyledir:
- LCP (Largest Contentful Paint): 2,5 saniye ya da daha kısa. Sayfadaki en büyük görselin ya da metin bloğunun ekranda belirdiği an. Ziyaretçinin "sayfa açıldı" dediği an buna yakındır.
- INP (Interaction to Next Paint): 200 milisaniye ya da daha kısa. Ziyaretçi bir düğmeye bastığında ya da menüyü açtığında sayfanın ne kadar çabuk tepki verdiği. 2024'te eski FID ölçüsünün yerini aldı.
- CLS (Cumulative Layout Shift): 0,1 ya da daha az. Sayfa yüklenirken içeriğin yerinden oynaması. Okurken yazının aşağı kayması ya da kayan bir düğme yüzünden yanlış yere basmanız bu ölçüye girer.
Bir sayfanın bu ölçülerde iyi sayılması için ziyaretlerin en az dörtte üçünde eşiğin içinde kalması gerekir. Yani birkaç hızlı açılış yetmez; yavaş telefonlardaki ve zayıf bağlantıdaki ziyaretçiler de hesaba girer. INP yalnız gerçek ziyaretçilerde ölçülebilir; laboratuvar testinde ona en yakın ölçü Total Blocking Time'dır (toplam engelleme süresi).
Yavaşlığın Yaygın Nedenleri
Büyük Görseller
En sık rastlanan nedendir. Telefonla çekilmiş ve hiç küçültülmeden yüklenmiş bir fotoğraf, sayfanın geri kalanından daha ağır olabilir. Oto bakım ve PPF sitelerindeki önce-sonra fotoğrafları, emlak sitelerindeki ilan galerileri bu yüzden ilk bakılacak yerlerdir. Görseller gösterilecekleri boyuta göre küçültülmeli, WebP ya da AVIF gibi yeni biçimlere çevrilmeli ve sıkıştırılmalıdır. Ekranın altında kalan görseller geç yüklemeyle ancak ziyaretçi oraya yaklaşınca yüklenebilir; ama sayfanın en üstündeki ana görsel geç yüklenmemelidir. Görsellere genişlik ve yükseklik bilgisi verilmemesi de yüklenirken sayfanın kaymasına, yani CLS'nin bozulmasına yol açar.
Gereksiz Betikler
Sohbet pencereleri, takip kodları, kayan vitrinler, sosyal medya akışları ve eklentiler sayfaya kod ekler. Bu kodlar indirilirken ve çalışırken tarayıcı meşgul olur; sayfa geç açılır ve dokunuşlara geç tepki verir, INP kötüleşir. Kullanılmayan eklentileri kaldırın, artık bakmadığınız takip kodlarını silin. Gerekli olanların da sayfanın görünmesini engellemeden, sonradan yüklenmesini sağlayın.
Yazı Tipleri
Her yazı tipi ve her kalınlık ayrı bir dosya olarak indirilir. Çoğu site için bir ya da iki yazı tipi ve yalnız gereken kalınlıklar yeterlidir. Yazı tipi dosyalarının sıkıştırılmış biçimde (WOFF2) sunulması ve yazı tipi gelene kadar metnin yedek yazı tipiyle gösterilmesi (font-display: swap) metnin görünmez kalmasını önler.
Barındırma ve Sunucu
Sayfanın ilk baytı geç geliyorsa sorun sitenin içinde değil, sunucudadır; PageSpeed bunu sunucu yanıt süresiyle ilgili bir uyarı olarak gösterir. Çok kalabalık paylaşımlı barındırma, önbellek kullanılmaması ya da sunucunun ziyaretçilerinize çok uzak olması buna yol açar. Önbelleği açmak, gerekirse daha güçlü bir barındırmaya ya da içerik dağıtım ağına (CDN) geçmek bu kalemi çözer.
Adım Adım İyileştirme Sırası
- Ölçün ve not alın. En önemli birkaç sayfanızı (ana sayfa, en çok ziyaret alan hizmet sayfaları, reklamın gittiği sayfa) mobilde ölçün; saha verisini ve laboratuvar ölçümlerini bir yere yazın.
- LCP öğesini bulun. PageSpeed sonuçları sayfadaki en büyük içerik öğesinin hangisi olduğunu gösterir. Çoğu zaman bu en üstteki büyük görseldir; işe onunla başlayın.
- Görselleri düzeltin. Küçültün, yeni biçime çevirin, boyutlarını yazın, ekran dışındakileri geç yükleyin.
- Betikleri ayıklayın. Kullanılmayan eklenti ve kodları kaldırın, kalanları erteleyin.
- Yazı tiplerini sadeleştirin. Gereksiz yazı tiplerini ve kalınlıkları çıkarın.
- Sunucuya bakın. Önbellek açık mı, sunucu yanıtı hızlı mı?
- Yeniden ölçün. Laboratuvar sonucu hemen değişir; saha verisi son 28 günü kapsadığı için değişikliğin tam yansıması birkaç haftayı bulur.
Her adımdan sonra ölçün. Bir değişiklik bir ölçüyü düzeltirken diğerini bozabilir; örneğin üstteki ana görseli geç yüklemeye almak LCP'yi kötüleştirir.
Kısa Kontrol Listesi
- Önemli sayfalar mobilde PageSpeed Insights ile ölçüldü, sonuçlar not edildi.
- Saha verisinde LCP 2,5 sn, INP 200 ms, CLS 0,1 eşiğinin içinde.
- Ana görsel küçültülmüş, yeni biçimde ve geç yüklenmiyor.
- Bütün görsellerin genişlik ve yükseklik bilgisi var.
- Kullanılmayan eklenti ve takip kodu kalmadı.
- En çok iki yazı tipi, yalnız gereken kalınlıklarla kullanılıyor.
- Sunucuda önbellek açık.
Düzenli Ölçüm Alışkanlığı
Hız bir kez düzeltilip unutulacak bir konu değildir. Yeni bir eklenti, büyük bir kampanya görseli ya da eklenen bir takip kodu sayfayı yeniden yavaşlatabilir.
- Ayda bir, aynı sayfaları aynı şekilde ölçün ve sonuçları yan yana koyun.
- Siteye yeni bir şey eklendiğinde (eklenti, kod, görsel galerisi) o sayfayı hemen ölçün.
- Search Console'daki Core Web Vitals raporuna bakın; tek tek ölçmediğiniz sayfaları da benzer sayfalarla gruplayarak gösterir.
- Reklam verdiğiniz sayfaları ayrıca izleyin; reklamın getirdiği ziyaretçiyi yavaş bir sayfa karşılamasın.
Orbitix'te Nasıl?
Orbitix'in kurduğu sitelerde sayfalar hafif kurulur, görseller küçültülür ve her ekran önce telefon için tasarlanır; site yayına alınmadan önce hızı ölçülür. Kurumsal pakette sayfalarınızın hızı PageSpeed ile ölçülür ve yavaşlayan sayfada otomatik aksiyon alınır: sebep bulunur, büyük görsel küçültülür, gereksiz kod çıkarılır. Search Console'da hata veren sayfalar da aynı listeye girer. Web yazılım Profesyonel ve Kurumsal paketlerde yer alır.