Bir sitenin hızlı görünmesi, yalnızca sunucusunun güçlü olmasıyla açıklanmaz. Kullanıcının cihazı, bağlantısı ve sayfanın indirdiği dosyalar birlikte sonucu belirler. İyi bir başlangıç, gerçekten gerekli olanı önce yüklemektir.
Görseli ekrana göre hazırlayın
Bir kartta küçük görünen fotoğrafın çok büyük özgün dosyasını indirmek gereksiz bekleme yaratabilir. Görselleri gösterilecekleri boyuta uygun hazırlayın ve içeriğe göre WebP, AVIF, JPEG veya PNG gibi biçimleri değerlendirin. Şeffaflık ihtiyacı ve görsel ayrıntısı biçim seçimini etkiler.
Küçük ekranlara daha küçük dosya sunmak için srcset kullanılabilir. width ve height değerleri ise sayfa yüklenirken görsele yer ayrılmasına yardımcı olur. Sonradan aşağı kayan bir düğme, ziyaretçinin yanlış yere dokunmasına neden olabilir.
İlk ekrandaki içeriğe öncelik verin
Ana başlık ve ilk görsel hızlı gelmeli; sayfanın aşağısındaki görseller ihtiyaç yaklaştığında yüklenebilir. İlk büyük görsele gelişigüzel lazy-loading uygulamak, görünür içeriğin gecikmesine yol açabilir. Kaynakların önceliğini sayfanın gerçek düzenine göre belirleyin.
Bir animasyon veya video, anlatıma katkı sağlıyorsa değerlidir. Sadece hareket olsun diye büyük dosyalar eklemek, sınırlı bağlantı kullanan ziyaretçiye ek yük getirir. Hareket azaltma tercihini de dikkate alın.
Her betiğin bir bedeli vardır
Bir harici araç yalnızca indirilen dosyadan ibaret değildir; çalışırken cihazın işlemcisini de kullanır. Analitik, sohbet, reklam ve efekt araçlarının her biri için “Bu işlev burada gerçekten gerekli mi?” diye sorun. Kullanılmayan bir aracı kaldırmak, karmaşık optimizasyonlardan daha anlaşılır bir kazanım olabilir.
Üçüncü taraf betikler veri işleme ve güvenlik değerlendirmesi de gerektirir. Bir kodu eklemeden önce hangi hizmete bağlandığını, hangi bilgileri topladığını ve onayın ne zaman alınacağını belirleyin.
Okunabilirliği performansın parçası sayın
Metin ekranda hızlı belirse de küçük puntolar, düşük kontrast veya düzensiz başlıklar okumayı zorlaştırabilir. Paragrafları anlaşılır tutun, satır uzunluğunu sınırlayın ve bağlantıların neye gittiğini açık yazın. Dokunma hedefleri birbirine fazla yakın olmamalı.
Bir tasarımı yalnızca kendi geniş monitörünüzde değerlendirmeyin. Dar ekranda menüye ulaşmak, formu doldurmak ve bir oyunu yeniden başlatmak da kullanımın parçasıdır. Klavyeyle gezinmeyi deneyin; odak göstergesi görünür olmalı.
Ölçün, sonra aynı koşullarda tekrar bakın
Tarayıcı geliştirici araçları veya Lighthouse gibi araçlar darboğazı bulmaya yardımcı olabilir. Tek bir puanı sitenin bütün kalitesi olarak değerlendirmeyin. Gerçek içerik, farklı sayfa türleri ve daha yavaş cihazlar önemli sonuçlar verebilir.
Bir değişiklik yaptıktan sonra aynı koşullarda tekrar deneyin. Görseli küçültmek işe yaramışken beş yeni araç eklemek kazanımı geri alabilir. Hız, erişilebilirlik ve içerik kalitesi birlikte ele alındığında daha tutarlı bir deneyim ortaya çıkar.
Kaynaklar & daha fazlası
Genel bilgilendirme amaçlı editoryal içerik. Yazılım ve hizmetler değişebilir; uygulamadan önce kendi ortamınızın resmî belgelerini kontrol edin. Yayın yaklaşımımız
Bir hata mı fark ettin, bir fikrin mi var?
Sayfanın bağlantısıyla bize yazabilirsin.
