Performans · 2 dk okuma

Görsel kalitesini koruyarak sayfayı hafifletmek

Bir görseli CSS ile küçültmek dosyanın indirme boyutunu küçültmez.

BCL Web Design ·
BCLDESIGN JOURNAL
BCL için üretilmiş temsili editoryal görsel; gerçek ofis veya müşteri projesi değildir.

Kararı doğru çerçeveleyin

Bir görseli CSS ile küçültmek dosyanın indirme boyutunu küçültmez. Kaynak görsel ekranda kullanılacağı boyuta uygun hazırlanmalıdır. Masaüstü ve telefon için farklı genişlikler sunmak gereksiz veri aktarımını azaltır. Boyut bilgisi verilmesi içerik yüklenirken yerleşimin sıçramasını da önler.

Uygulamada nelere dikkat edilmeli?

İlk ekranda görünen önemli görsel ile aşağıdaki galeri aynı öncelikte değildir. Sayfanın ana görselini gereksiz geciktirmeyin; görünmeyen görselleri ise ihtiyaç halinde yükleyin. Format seçimini görüntünün türüne göre yapın; marka logosunda keskin kenarları korumak fotoğraf sıkıştırmasından farklıdır.

Kontrol ve sonraki adım

Sıkıştırma sonrasında yalnız dosya boyutuna bakmayın. Yazılar, yüzler, ince çizgiler ve koyu geçişlerde oluşan bozulmaları kontrol edin. Görsel açıklamaları fotoğraftaki anlamı aktarmalı; dekoratif resimler ekran okuyucuda gereksiz tekrar üretmemelidir.

Kısa kontrol listeniz

  • Ekrana uygun kaynak boyutu üretin.
  • İlk görsele doğru öncelik verin.
  • Sıkıştırmayı görsel olarak kontrol edin.
görselWebPhız