Hızlı bir web sitesi için 8 kontrol noktası
Görsellerden üçüncü taraf araçlara kadar, hız iyileştirmesini ölçülebilir ve geri alınabilir adımlarla ele almak için bir rehber.
Bir hız puanını yükseltmek ile ziyaretçinin işini kolaylaştırmak aynı hedefe hizmet edebilir; ancak aynı şey değildir. Önceliğin, gerçek kullanıcı akışında gereksiz beklemeleri azaltmak olmalı. Değişiklikleri tek tek uygulamak ve kritik işlevleri yeniden kontrol etmek, neyin fayda sağladığını anlamayı kolaylaştırır.
1. Önce önemli sayfaları seç
Ana sayfa kadar hizmet, ürün ve iletişim sayfalarını da incele. Tek bir sayfanın ölçümü tüm deneyimi temsil etmeyebilir. Her sayfada ziyaretçinin yapmak istediği görevi not et. Form doldurmak veya ürün seçmek sırasında oluşan beklemeler, ilk açılış ölçümünden farklı sorunlar gösterebilir.
2. Görselleri kullanım yerine göre değerlendir
Bir kart görseli ile tam ekran görselin aynı dosyaya ihtiyacı olmayabilir. Görüntünün gerekli boyutunu, dosya ağırlığını ve görünür kalitesini birlikte kontrol et. Her dosyayı aynı oranda sıkıştırmak yerine önemli görselleri gerçek ekranlarda gözden geçir.
3. İlk ekrandaki görselleri bekletme
Gecikmeli yüklemeyi her görsele aynı şekilde uygulama. İlk ekranda görünen önemli görselin isteğini gereksiz yere ertelemek, kullanıcının ana içeriği görmesini geciktirebilir. Ekranın aşağısındaki görsellerin yükleme davranışını ise sayfanın akışına göre ayrı değerlendir.
4. Video için bir başlangıç görüntüsü kullan
Hero videosunun dosya boyutu, mobil kırpılması ve başlamadan önce görünen kareyi kontrol et. Video oynatılmadığında da sayfanın mesajı anlaşılmalı. Hareket azaltma tercihi ve duraklatma kontrolü gibi kullanım ihtiyaçlarını da görsel tasarımın parçası olarak ele al.
5. Eklenen araçların listesini çıkar
Sohbet, takip, reklam ve gömülü içerik araçlarını hangi ihtiyacı karşıladıklarıyla birlikte listele. Sahibi veya kullanım amacı bilinmeyen bir betiği fark etmek bile iyi bir başlangıçtır. Kaldırmadan veya ertelemeden önce ilgili iş akışını ve izin davranışını kontrol et.
6. Yazı tipi ve yerleşim davranışına bak
Sayfa açılırken metnin görünmesini ve görsellerin yerleşmesini izle. İçerik sonradan yer değiştiriyorsa hangi öğenin buna neden olduğunu bulmaya çalış. Farklı cihazlarda başlık uzunluğu, menü ve buton düzenini kontrol ederek görsel kararlılığı kullanıcı göreviyle birlikte değerlendir.
7. Önbelleği içerik davranışıyla birlikte planla
Her sayfa aynı şekilde saklanmaya uygun olmayabilir. Kişiye özel içerik, formlar veya oturum kullanan akışlar için kuralları dikkatle belirle. Önbellek değişikliğinden sonra içerik güncellemesinin doğru yansıyıp yansımadığını da kontrol et.
8. İyileştirmeyi işlev kontrolüyle bitir
Önceki ve sonraki durumu benzer koşullarda karşılaştır. Ardından menüyü, formu ve önemli etkileşimleri dene. Puanın yükselmesi, kritik bir akış bozulduysa yeterli bir sonuç değildir. Yapılan değişikliği ve gerektiğinde geri alma yolunu kaydet.
Başlamadan önce kontrol listesi
- Birden fazla önemli sayfa kontrol edildi.
- İlk ekran görselleri ve video ayrı değerlendirildi.
- Eklenen araçların amaçları biliniyor.
- Değişiklik sonrası formlar ve menü test edildi.
- Önceki durum ve geri dönüş adımları kayıtlı.
İlgili kaynak: web.dev: görsel performansında temel sorunlar
Bu adımları markana uyarlamak için ilgili hizmetimizin kapsamını inceleyebilirsin.
