INP (Interaction to Next Paint), kullanıcı sayfaya dokunduğunda ya da tıkladığında ekranın ne kadar sürede güncellendiğini ölçer; iyi değer 200 milisaniye ya da daha azdır. Yüksek çıkmasının tipik nedenleri ana iş parçacığını meşgul eden uzun görevler, ağır JavaScript, büyük ve karmaşık sayfa yapısı ve üçüncü taraf betiklerdir. Çözüm, önce gerçek kullanıcı verisinde sorunlu etkileşimi bulmak, sonra o etkileşimi laboratuvarda teşhis etmektir.
Bu yazı, işletme sitesi sahibi ve geliştirici için INP’yi anlaşılır adımlara böler. Teknik iyileştirme için teknik SEO hizmetimize bakabilirsiniz.
INP neyi ölçer?
web.dev’e göre INP, sayfa yaşamı boyunca tüm uygun etkileşimlerin gecikmesini gözlemler; nihai değer, gözlenen en uzun etkileşimdir (aykırı değerler bazen yok sayılır). İyi değer, sayfa yüklemelerinin 75. yüzdelik diliminde 200 ms veya daha azdır; 200–500 ms arası iyileştirilmeli, 500 ms üzeri düşüktür (INP’yi optimize edin).
Bir etkileşimin gecikmesi üç parçadan oluşur: giriş gecikmesi (dokunuş ile işleme başlama arası), işleme süresi (olay işleyicilerin çalışması) ve sunum gecikmesi (sonraki kareyi çizme). Üçünü ayırmak, çözümü seçmenizi kolaylaştırır. Metrik ailesi için Core Web Vitals nedir? yazısına bakın.
Önce alan verisiyle başlayın
web.dev, alan verisiyle başlamayı, sonra laboratuvarda teşhis etmeyi önerir. Adımlar:
- Alan verisi: Search Console’un Core Web Vitals raporu ve PageSpeed Insights’taki gerçek kullanıcı verisi hangi sayfa grubunun INP’de sorunlu olduğunu gösterir.
- Etkileşimi bulun: Sorunlu sayfada hangi etkileşimin (menü açma, filtre, sepete ekleme) yavaş olduğunu belirleyin.
- Laboratuvarda yeniden üretin: Tarayıcı geliştirici araçlarının performans panelinde aynı etkileşimi kaydedin; yavaş etkileşimi manuel olarak teşhis edin.
- Neden-sonuç: Uzun görev mi, giriş gecikmesi mi, sunum mu?
Laboratuvar tek başına yanıltabilir; gerçek kullanıcılar eski telefonlarla, yavaş ağlarla gelir (site hızı ölçümü).
Hizmet almak için iletişime geçin. Sitenizin dizine eklenme, hız ve mobil durumunu birlikte tarayalım. Teknik SEO hizmetimizi inceleyin ya da bize yazın.
Yüksek INP’nin başlıca nedenleri
web.dev’in rehberinde çözüm alanları şunlardır:
- Uzun görevler: Ana iş parçacığını uzun süre bloke eden JavaScript.
- Giriş gecikmesi: Kullanıcı dokunduğunda ana iş parçacığı başka işle meşgul.
- Komut dosyası değerlendirmesi: Sayfa yüklenirken büyük paketlerin çalıştırılması.
- Büyük ve karmaşık düzenler: Çok fazla öğe, derin iç içe yapı.
- Stil hesaplamaları: Karmaşık seçiciler ve sık stil değişimi.
- Büyük DOM: Çok sayıda düğüm.
- İstemci taraflı oluşturma: İçeriğin tarayıcıda JavaScript ile üretilmesi.
İşletme sitelerinde sık rastlanan ek kaynaklar: sohbet pencereleri, takip betikleri, slayt ve harita eklentileri ve ağır WordPress eklentileri.
Uzun görevleri bölmek
Tarayıcı, uzun bir görev sürerken kullanıcının dokunuşuna yanıt veremez. Çözüm, işi parçalara bölüp araya “nefes” vermektir:
- Kullanıcıya hemen görünmesi gereken işi (arayüz güncellemesi) önce yapın.
- Kritik olmayan işi (analitik gönderimi, hesaplama) sonraya erteleyin.
- Uzun döngüleri küçük parçalara bölüp araya tarayıcıya kontrol verin.
- Gereksiz tekrar hesaplamaları önleyin.
Bu, geliştirici işidir; işletme sahibi olarak yapabileceğiniz, hangi betiğin gerçekten gerekli olduğunu sorgulamaktır.
Üçüncü taraf betikleri
Sohbet, reklam, pazarlama etiketi, yorum eklentisi gibi betikler ana iş parçacığını meşgul eder. Kontrol listesi:
- Kullanılmayan etiketleri kaldırın.
- Yalnızca gereken sayfalarda yükleyin (örneğin sohbet yalnızca iletişim sayfasında).
- Yüklemeyi kullanıcı etkileşimine ya da sayfa yüklendikten sonraya erteleyin.
- Her yeni betiğin hız maliyetini ölçmeden eklemeyin.
Bu sizin için en hızlı kazanç alanıdır: bir etiket yöneticisi konteynerindeki gereksiz etiketler çoğu zaman sitenin INP’sini kötüleştirir.
Sayfa yapısını sadeleştirmek
Büyük DOM ve karmaşık düzenler, her etkileşimden sonra tarayıcının yeniden hesaplamasını uzatır. Önlemler:
- Gereksiz iç içe yapıları kaldırın.
- Çok uzun listeleri sayfalayın ya da gerektiğinde yükleyin.
- Karmaşık menüleri ve filtreleri sadeleştirin.
- Sayfa oluşturucu eklentilerinin gereksiz kapsayıcılarını azaltın (WordPress site yavaşsa).
İstemci taraflı oluşturma
İçeriğin tamamı tarayıcıda JavaScript ile üretiliyorsa hem INP hem tarama maliyeti artabilir. Mümkünse içeriği sunucuda üretin; etkileşim gerektiren bölümleri minimum JavaScript ile çalıştırın (JavaScript siteleri ve SEO).
Hangi etkileşimler yavaşlar?
İşletme sitelerinde INP’yi bozan etkileşimler genellikle belli bir kümede toplanır:
- Menü açma ve kapatma: Mobil menü animasyonu ağır betikle çalışıyorsa.
- Filtre ve sıralama: Ürün listelerinde her seçimde tüm listenin yeniden çizilmesi.
- Form alanları: Karmaşık doğrulama betikleri ya da yazarken çalışan canlı hesaplamalar.
- Sepete ekle ve çok adımlı formlar: Arka planda birden çok istek ve güncelleme.
- Çerez onay penceresi: Ağır bir onay aracının ilk dokunuşta çalışması.
- Sohbet ve yardım pencereleri: Yüklenirken ana iş parçacığını meşgul eder.
Rapordaki yavaş sayfa grubunu bu listeyle eşleştirmek, aramayı hızlandırır: önce en sık kullanılan etkileşimi, sonra en ağır olanı inceleyin.
Mobil cihazlar neden daha kötü çıkar?
Aynı kod, düşük güçlü bir telefonda masaüstüne göre çok daha uzun sürer. Bu yüzden alan verisinde mobil INP genellikle masaüstünden zayıftır. Önlemler:
- Laboratuvarda yavaş cihaz ve ağ koşullarını taklit edin.
- Mobilde gereksiz betikleri hiç yüklemeyin.
- Dokunmatik etkileşim için çalışan kodu en sade biçimde yazın.
- Test cihazı olarak orta segment bir telefon kullanın; yalnızca güçlü cihazla ölçmek sizi yanıltır.
Mobil deneyimin genel boyutları için telefonda hızlı açılan site yazısına bakabilirsiniz.
İyileştirmeyi nasıl doğrularsınız?
Değişiklik yaptıktan sonra:
- Laboratuvarda aynı etkileşimi yeniden ölçün.
- Gerçek kullanıcı verisinin güncellenmesini bekleyin; alan verisi birkaç hafta gecikmeli oturur.
- Search Console’da ilgili sayfa grubunun durumunu izleyin.
- İyileşme sağlamıyorsa sıradaki nedene geçin.
Bir değişiklik tek başına yeterli olmayabilir; çoğu zaman üç beş küçük iyileştirme birleşir.
Denizli’den bir örnek
Örnek (hayalî bir işletme için): Denizli’de bir ayakkabı mağazasının ürün listesinde filtre düğmesine dokunulunca ekran bir saniye donuyor.
- Teşhis: Alan verisinde ürün listesi sayfaları INP’de “iyileştirilmeli”; laboratuvarda filtre etkileşimi uzun görev gösteriyor.
- Neden: Filtre her seçimde tüm listeyi yeniden çiziyor; iki takip betiği ana iş parçacığını meşgul ediyor.
- Çözüm: Liste çizimi parçalanıyor, takip betikleri sayfa yüklendikten sonraya erteleniyor, kullanılmayan etiketler kaldırılıyor.
- Doğrulama: Laboratuvarda etkileşim yeniden ölçülüyor, alan verisi haftalar içinde izleniyor.
Bu örnek bir sonuç vaadi değildir.
Sık yapılan altı hata
- Yalnızca laboratuvar skoruna bakmak.
- Hangi etkileşimin yavaş olduğunu belirlememek.
- Tüm sayfalara her betiği yüklemek.
- Kullanılmayan etiketleri temizlememek.
- Değişiklik sonrası ölçümü yapmamak.
- Ağır eklentileri hız maliyetine bakmadan eklemek.
Denizli SEO bu konuda nasıl yardımcı olur?
- alan verisinden sorunlu sayfa ve etkileşimleri belirler,
- üçüncü taraf betiklerini ve eklentileri envanterleyip gerekli olmayanları kaldırırız,
- geliştiriciniz için somut teknik düzeltme listesi yazarız,
- iyileşmeyi gerçek kullanıcı verisiyle izleriz.
Hız denetimi için bize yazın.
Sizin için de yapalım mı? Sitenizin Google’da neden görünmediğine birlikte bakalım. Hizmet almak için iletişime geçin; yöntemimiz teknik SEO sayfamızda yazılı.
Sık sorulan sorular
İyi INP değeri nedir?
200 milisaniye veya daha az; sayfa yüklemelerinin 75. yüzdelik diliminde.
INP’yi nereden görürüm?
Search Console’un Core Web Vitals raporu ve PageSpeed Insights’taki gerçek kullanıcı verisinde.
INP, sıralamayı etkiler mi?
Sıralamaya katkısı küçük bir sayfa deneyimi unsuru olarak düşünülmeli; içerik alaka düzeyi belirleyicidir. Asıl kazanç, yavaş yanıt veren sayfada kullanıcıyı kaybetmemektir.
En kolay iyileştirme nedir?
Kullanılmayan üçüncü taraf betiklerini kaldırmak ve yalnızca gereken sayfalarda yüklemek.
Neden laboratuvarda iyi, gerçekte kötü çıkar?
Gerçek kullanıcıların cihazları ve ağları farklıdır; alan verisi bu çeşitliliği yansıtır.