✦ Kısa tanım
CSS Sprite: Çok sayıda küçük görselin tek bir görsel dosyasında birleştirilip CSS ile yalnızca ilgili bölümünün gösterildiği teknik.
CSS Sprite ne anlama gelir?
İkonlar ve küçük arayüz görselleri tek dosyada toplanır; background-position ile her öğe için doğru parça gösterilir. Bu sayede onlarca ayrı HTTP isteği yerine tek istek yapılır.
HTTP/2 ve HTTP/3 ile paralel istekler ucuzladığı için sprite'ların önemi azalmıştır. Bugün ikonlar için çoğunlukla SVG sprite veya satır içi SVG tercih edilir.
Örnek
Sosyal medya ikonlarının beşi tek bir PNG'de birleştirilip CSS ile ayrı ayrı gösterilir.
İlgili terimler
- Teknik SEOCSSHTML ile yapılandırılan içeriğin renk, yazı tipi, yerleşim ve animasyon gibi görsel sunumunu be…
- Site Hızı & Core Web VitalsSite Hızı OptimizasyonuWeb sayfalarının daha hızlı yüklenmesi, daha çabuk tepki vermesi ve görsel olarak kararlı olmas…
- Site Hızı & Core Web VitalsGörsellerin SıkıştırılmasıGörsellerin kalitesini gözle görülür şekilde düşürmeden dosya boyutlarının azaltılması işlemidi…
Bu konuyu sitenizde birlikte ele alalım
CSS Sprite ve benzeri konuları markanızın hedefleriyle birlikte değerlendiriyor, uygulanabilir bir yol haritasına çeviriyoruz.
Web Sitesi Geliştirme →