Site denetimi için performans metriklerini toplamadan önce, kolay düzeltmeleri ve odaklanılacak alanları belirlemek için yapabileceğiniz birkaç kontrol vardır.
Geçerlilik kontrolü: mimari ve kod
Performansı ölçmeden önce basit hataları mümkün olduğunca düzeltin ve gereksiz öğeler ile kodları kaldırın. Ancak, sorunların ve düzeltmelerin öncesini ve sonrasını sakladığınızdan emin olun. Bu iyileştirmeler yine de denetim çalışmanızın bir parçası olabilir.
Site mimarisi ve öğeleri
Kullanılmayan eski sayfalar, içerik veya diğer öğeler gibi her şey kod deposundan ve siteden kolayca kaldırılabilir mi? Artık sayfa, gereksiz şablon, kullanılmayan resim ve kullanılmayan kod ve kitaplık olup olmadığını kontrol edin.
Çalışma zamanı hataları
Tarayıcı konsolunda bildirilen hataları kontrol edin. Hiç :) olmamalıdır.
Lining
HTML, CSS veya JavaScript kodunuzda hatalar var mı? İş akışınıza hata analizi oluşturmak, kod kalitesini korumanıza ve regresyonları önlemenize yardımcı olabilir. Kod düzenleyici eklentisi olarak kullanılabilen veya iş akışı işlemleri ve Travis gibi sürekli entegrasyon araçlarındaki komut satırından çalıştırılabilen HTMLHint, StyleLint ve ESLint'i öneririz.
Bozuk bağlantılar ve resimler
Derleme zamanında ve çalışma zamanında bozuk bağlantıları test etmek için kullanılabilecek birçok araç vardır. Bunların arasında Chrome Uzantıları (bu iyidir) ve Bozuk Bağlantı Kontrolü gibi düğüm araçları yer alır.
Eklentiler
Flash ve Silverlight gibi eklentiler güvenlik riski oluşturabilir. Bu eklentilerin desteklenmesi kullanımdan kaldırılmıştır ve mobil cihazlarda çalışmazlar. Eklentileri kontrol etmek için
Lighthouse'u kullanın.
Çeşitli cihazlar ve bağlamlarla test etme
Sitenizi gerçek cihazlar, birden fazla tarayıcı ve farklı bağlantı bağlamlarıyla test etmek için gerçek kullanıcıların yerini hiçbir şey tutamaz.
Bu kontrollerden bazıları göreceli olarak öznel olmakla birlikte algılanan performansı etkileyen sorunları tespit edebilir. Örneğin, bozuk bağlantılar zaman kaybına neden oluyor ve "yanıt vermiyor" hissi veriyor. Okunaksız metinler çok yavaştır.
Cihazlar arası test:
Farklı görüntü alanı ve pencere boyutlarını deneyin. En az bir mobil cihaz ve
bir masaüstü cihaz kullanın. Mümkünse sitenizi küçük ekranlı, düşük özellikli bir mobil cihazda deneyin. Metin okunabilir mi? Bozuk resim var mı? Yakınlaştırma yapabiliyor musunuz? Dokunma hedefleri yeterince büyük mü? Yavaş mı?
Yanıt vermeyen özellikler var mı? Sonuçların ekran görüntüsünü veya videosunu almak.
Platformlar arası test
Hangi platformları hedefliyorsunuz? Kullanıcılarınızın şu anda ve gelecekte kullandığı tarayıcılarda ve işletim sistemlerinde test etmeniz gerekir.
Bağlantı
Birden çok hedef ağ türünde test edin: bağlı, kablosuz ve hücresel. Çeşitli ağ koşullarını emüle etmek için tarayıcı araçlarını kullanabilirsiniz.
Cihazlar
Sitenizi kullanıcılarınızla aynı cihazlarda denediğinizden emin olun. Aşağıdaki fotoğrafta iki farklı telefonda aynı sayfa gösterilmektedir.
Büyük ekranda metin küçük ancak okunabiliyor. Küçük ekranda tarayıcı düzeni doğru bir şekilde oluştursa da metin yakınlaştırıldığında bile okunamaz. Ekran bulanık ve ekranda "renk atması" var (beyaz beyaz değilmiş gibi görünüyor), bu nedenle içerik daha okunaklı değil.
Bunun gibi basit bulgular, karanlık performans verilerinden çok daha önemli olabilir.
Kullanıcı arayüzünü ve kullanıcı deneyimini deneyin
Erişilebilirlik, kullanılabilirlik ve okunabilirlik
Sitenizin içeriğinin ve işlevlerinin herkes için erişilebilir olmasını sağlamak için kullanıcılarınızın çeşitliliğini anlamanız gerekir.
Lighthouse ve diğer araçlar belirli erişilebilirlik sorunlarını test eder, ancak hiçbir şey gerçek dünya testinin yerini tutamaz. Çeşitli senaryolarda (ör. güneş ışığı altında dışarıda veya trende) veri okumayı, gezinmeyi ve veri girmeyi deneyin. Arkadaşlarınızdan, ailenizden
ve iş arkadaşlarınızdan sitenizi denemelerini isteyin. İçeriği, Mac'te VoiceOver veya Windows'da NVDA gibi bir ekran okuyucuyla almayı deneyin.
Erişilebilirlikle ilgili Udacity kursunda ve Erişilebilirlik İncelemesi Nasıl Yapılır? Web'le İlgili Temel Bilgiler makalesinde erişilebilirliği uygulama ve gözden geçirme hakkında daha fazla bilgi edinebilirsiniz.
Erişilebilirlik denetiminizin kaydını tutun. Muhtemelen tüm kullanıcılarınız için faydalı basit iyileştirmeler yapabilirsiniz.
Temel kullanıcı arayüzü ve kullanıcı deneyimi sorunları
Olması gerektiği gibi çalışmayan etkileşimler, daha küçük pencerelerde ve görüntü alanlarında taşan öğeler, çok küçük dokunma hedefleri, okunamayan içerikler, kötü kaydırma... Sitede birden fazla sayfa açın, gezinmeyi ve tüm temel işlevleri deneyin. Kayıt tutun.
Resim, ses ve video
Taşan içerik, hatalı en boy oranı, kötü kırpma ve kalite sorunlarını test edin.
Öznel kullanıcı arayüzü testleri
Bunların tümü ilgili olmayabilir ancak basit değişiklikler yeniden düzenleme sürecini kolaylaştırabilir:
- Siteyi açtığınızda 'Burada ne yapabilirim?' hemen anlaşılıyor mu?
- İçerik tüketmeyi ve bağlantıları izlemeyi mi tercih ediyorsunuz?
- Görsel hiyerarşiler veya yollar var mı ya da her şey aynı görsel ağırlığa mı sahip?
- Düzen karmaşık mı?
- Çok fazla yazı tipi mi var?
- Kaldırılabilecek resimler veya başka içerik var mı?
- İçerik tasarımı, arayüz tasarımı kadar önemlidir. Sitenizdeki metin ve resim içeriği mobil ve masaüstü bağlamlar için uygun mu? Bir şey ortadan kaldırılabilir mi? Mobil cihazlara yönelik yazın.