Hız İndeksi: Nedir ve Web Sitenizi Bunun İçin Nasıl Optimize Edebilirsiniz?

Hız İndeksi (SI), sayfa hızı düşünüldüğünde ilginç bir ölçümdür. Bu kesinlikle sayfanızın performansının bir göstergesidir, ancak First Contentful Paint ve En Büyük İçerikli Boyama gibi diğer kullanıcı merkezli metriklerden tamamen farklıdır. SI, sitenizin ekranın üst kısmında ne kadar hızlı yüklendiğini gösterir. Veya başka bir deyişle, kullanıcının görünümündeki tüm içerik tamamen görünür olduğunda. Sayfanızın yüklenme sürelerine baktığınızda, Hız Endeksiniz için büyük olasılıkla cezalandırılmayacaksınız veya ödüllendirilmeyeceksiniz. Bu görmezden gelmek için bir sebep değil. Tek bir metrik olarak, diğer birden çok metriği kapsayan ve sitenizin genel hızı, verimliliği ve performansı hakkında size sağlam bir fikir verebilecek az sayıdaki metrikten biridir.

Youtube Kanalımıza Abone Olun

Hız Endeksi nedir?

Google'ın PageSpeed ​​Insights için omurgası olan Lighthouse, sitenizi derecelendirmek için birden çok performans metriğine bakar. Hız İndeksi (SI) bunlardan biridir ve rapor, diğer bazı metriklerde olduğu gibi zamanı milisaniye yerine saniye olarak gösterecektir. Google, SI'yi "bir sayfanın içeriğinin görünür şekilde ne kadar hızlı doldurulduğu" olarak tanımlar.

Oldukça düz ileri, değil mi?

Hız Dizini, arka uç komut dosyalarını veya diğer boyanmamış yükleri hesaba katmaz. Yine de etkiliyorlar. SI, kullanıcıların içeriğinizi tam olarak görmelerinin ne kadar sürdüğünün bir ölçüsüdür. İşte vurucu. Tam olarak . LCP gibi diğer metrikler, içeriğin en büyük bölümünün görüntülendiği zaman ölçülürken, Hız Endeksi, görüntülenmesi gereken tüm içeriğin gerçekte olduğunu hesaplar.

Bu, genel sayfa hızının bir ölçüsü değildir. Bu, tarayıcının tüm öğeleri oluşturduğunda dikkate alınır. Görünmeyen komut dosyaları ve performansı etkileyen öğeler dahil. Ancak, kullanıcılarınızın sayfanın tam olarak yüklendiğini algıladıklarını iyi bir şekilde ölçmek istiyorsanız, izlenmesi gereken ölçü SI'dır. Kullanıcı odaklı olması nedeniyle SI, genel site sağlığının iyi bir göstergesi ve sitenizin kullanıcı deneyimi (UX) için bir temel olabilir.

Hız Endeksi Nasıl Ölçülür

Çoğu site performans metriğinde olduğu gibi, kullanılacak en iyi araçlardan biri de Google'ın kendi PageSpeed ​​Insights'ıdır. Bu araç, döndürdüğü sonuçlarda da en belirgin olanlardan biridir. En iyi bir araya getirilmiş siteler için bile nispeten kritiktir. PageSpeed ​​Insights genellikle siteniz için son 28 günlük toplamaya dayalı laboratuvar verileri sağlar. Ancak, bilgileri Chrome aracılığıyla Google'a geri ileten yeterli sayıda ziyaretçiniz varsa, rapordan gerçek dünya saha verilerini de alabilirsiniz. Yine de her site bunu alamaz.

Gördüğünüz gibi, bu metriklerin birçoğunun hızı yeşil renktedir. Bu onların “iyi” olduğunu gösterir. Burası açıkça sitenizi istediğiniz yer. Ancak Hız İndeksi 4.0 saniye ve turuncu. Bu, kullanıcının ekranın üst kısmındaki her şeyi görmek için beklemesi için uzun bir süre.

İyi Hız Endeksi Puanı nedir?

PageSpeed ​​Insights, sitenizin Hız Endeksini sıralamak ve buna göre renk kodlaması yapmak için aşağıdaki puanları kullanır:

• Yeşil (İyi) – 0 ila 3.4 saniye
• Turuncu (Orta) – 3.4 ila 5.8 saniye
• Kırmızı (Yavaş) – 5,8 saniyenin üzerinde

Daha önce de söylediğimiz gibi, PageSpeed ​​Insights ölçümlerinde çok kritiktir. Turuncu veya kırmızı renkteyseniz, gerçek zamanlı verilerinin ne gösterdiğini görmek için GTmetrix veya Pingdom's Speed ​​Test gibi bir araç kullanmak isteyebilirsiniz. Genel performansın en iyi resmini elde etmek için sitenizi farklı zamanlarda birden fazla araç kullanarak test etmenin en iyisi olduğunu düşünüyoruz.

Hız Endeksi Puanınızı Nasıl Optimize Edebilirsiniz?

Hız Endeksi puanınızı optimize etmek için birkaç adım atabilirsiniz. Sitenizi herhangi bir tür sayfa hızı artışı (veya teknik olarak düşüş) için optimize etmeye çalıştıysanız, muhtemelen bir şekilde SI puanınızı da etkilemişsinizdir. Ziyaretçilerinize mümkün olan en iyi deneyimi sunmak için sayfanızın olabildiğince hızlı yüklenmesi için SI zamanınızı özel olarak hedeflemenin birkaç yolunu göstereceğiz.

Oluşturma Engelleme Kaynaklarını Azaltın

Daha spesifik olarak, JavaScript yürütme sürenizi azaltmak, Hız Endeksi puanınızı artırmanın en iyi yollarından biridir. Oluşturma engelleme kaynakları, öncelik alarak web sitenizin diğer bölümlerinin yüklenmesini engelleyen komut dosyaları ve kodlardır. Sitenin aynı anda farklı öğeleri yüklemesi yerine, bazı öğeler diğerlerini bitene kadar duraklatır.

Bu da sitenizin Hız Endeksini düşürür. Bunu aşmak için, görünen öğeler DOM'a boyanıncaya kadar yüklenen istediğiniz sayıda komut dosyasını ve kod parçasını erteleyebilirsiniz. Yüklenirken sitenize bir göz atmak için Chrome Geliştirme Araçlarını kullanabileceğiniz ve araç, öğelerin oluşturulmasını neyin durdurduğunu göstereceğinden, suçluları belirlemek aslında nispeten kolaydır.

Ek olarak, WordPress kullanıcıları bunu halletmek için W3 Total Cache veya WP Rocket gibi bir önbellek eklentisi (veya site optimizasyon eklentisi) kullanabilir. Genellikle bu eklentiler, oluşturmayı engelleyen kaynakları ertelemek için basit bir geçişe sahiptir.

Tema seçenekleri, jQuery komut dosyalarının yanı sıra oluşturmayı engelleyen CSS ertelemesini değiştirmenize izin verdiğinden, Divi kullanıcıları da bu tür kaynakları engelleme konusunda büyük bir avantaja sahiptir. Bunun da ötesinde, temanın Kritik CSS özellikleri, sitenizin içeriğini geciktirebilecek ve bunların normalde olduğundan çok daha hızlı yüklenmesine neden olabilecek büyük kod parçalarını parçalar. Bunlardan bazıları geçiş yaparken, Divi diğerlerini otomatik olarak etkinleştirir. Divi'yi yüklemek, çoğu durumda anında SI puanınıza yardımcı olacaktır.

Sitenizin Ana Konu İşini Azaltma

Oluşturmayı engelleyen kaynaklar gibi, sunucunuzdan çok fazla işlem gücü alan farklı öğeler yükleyerek sitenizin performansına darboğaz yapabilirsiniz. Bunları azaltmak, siteyi tarayıcıya daha hızlı göndermeye yardımcı olabilir.

Bunun için en basit çözüm, çok fazla JavaScript kullanmayı bırakmaktır . GTmetrix bunu en iyi şekilde ifade ediyor:

Genel olarak, sayfanızda ne kadar çok JavaScript varsa, ayrıştırma/derleme süreci o kadar uzun olur; kullanıcıların içeriği görüntülemesi ve sayfanızla etkileşim kurması için daha uzun bir bekleme süresine neden olur.

Bunun kolay olmayabileceğinin farkındayız. Siteyi belirli bir şekilde çalışacak şekilde tasarladınız. Ancak, tüketebileceğiniz kullanılmamış kod olabilir ve sitenize yüklediğiniz herhangi bir üçüncü taraf JavaScript'i optimize edebilirsiniz. Ayrıca JavaScript'inizi küçültün.

JS denetiminin yanı sıra CSS ve HTML'nizi küçülttüğünüzden emin olun. Bu, ana iplik gerginliğini daha da azaltacaktır. Önbelleğe alma ve optimizasyon eklentileri de genellikle bu seçeneklere sahiptir.

Tema, CSS ve JavaScript'i otomatik olarak küçültüp daha hızlı verim için küçük parçalara böldüğü ve ana iş parçacığınızdan tonlarca odaklanma ihtiyacını ortadan kaldırdığı için Divi kullanıcılarının bir kez daha ayağı var.

Hız İndeksi Sıkça Sorulan Sorular

Hız Endeksi, karmaşık sonuçları olan basit bir kavramdır. Web sitenizi olabildiğince iyi optimize etmenize yardımcı olmak için SI hakkında sık sorulan bazı soruları yanıtlamak istiyoruz.

Hız Endeksi Web Sitemin Genel Performansına Nasıl Uyuyor?

Tek bir metrik olarak Hız Endeksi, web sitenizin bir dizi farklı alanda performansının çok iyi bir göstergesidir. Tamamen görünür, ekranın üst kısmındaki içeriği hesaba kattığı için, bunu yalnızca kullanıcı tarafından algılanan yükleme için değil, aynı zamanda sitenizin bir dizi farklı alanda ne yaptığına dair kaba bir tahmin için bir ölçü olarak kullanabilirsiniz.

Aslında, web sitenizin ne yaptığı konusunda size tek başına çok fazla bilgi vermez. GTmetrix'in dediği gibi, "web sitenizin performansını bütünüyle değerlendirmek için yararlı bir genel kıyaslama" yapan her şeyi kapsayan bir metrik olarak görülebilir.

Özellikle Hız Endeksi Puanıma Odaklanmalı mıyım?

Muhtemelen hayır, hayır.

İlk İçerikli Boyama (FCP), En Büyük İçerikli Boyama (LCP), İlk Bayt Süresi (TTFB) ve İlk Giriş Gecikmesi (FID) gibi diğer daha ayrıntılı konulara odaklanarak sitenizi kıyaslamak çok yararlı olsa da daha önemli. Bunları ayrı ayrı geliştirmek için istediğiniz sayıda adım atabilirsiniz, bu da Hız Endeksinizi iyileştirecektir. Ve genel bir kıyaslama olarak alındığında, optimizasyonlarınızın SI aracılığıyla ne kadar iyi çalıştığını görebilirsiniz.

Çözüm

Sayfa hızı optimizasyonu, web sitesi sahiplerinin savaştığı hiç bitmeyen bir savaştır. Kullanılabilirlik, deneyim ve performans arasındaki dengeyi kurmalısınız ve bu dengeyi bulmak zor olabilir. Testler bu kadar çok farklı unsur üzerinde çok farklı puanlar verdiğinde, enerjinizi ve kaynaklarınızı nereye koyacağınızı bilmek zor olabilir. Hız Endeksi, sitenizin performansının diğer, daha spesifik kısımlarını ayarlarken sitenizin ne kadar iyi performans gösterdiğini gösteren tek bir metrik olarak bu konuda yardımcı olabilir.

Yıllar içinde web sitenizin Hız Endeksini optimize etmek için ne yaptınız?

HappyDrawing / Shutterstock.com'dan makale özellikli görsel