CSS İpucu 38 - Uyumlu web'de gizlenen alanlardaki artalanları uçurmak

Mobilde her kilobaytın hesabı yapıldığı için ve masaüstüne göre nispeten daha yavaş bağlantılar nedeniyle uyumlu web çalışmalarında performan daha fazla önem kazanıyor.

Tasarım icabı mobilde gizlenecek alanlardaki artalan resimleri kaldırmamız bize avantaj sağlayacaktır.

.logo {
   background: url(logo.png) 0 0 no-repeat;
}

@media (max-width: 979px) {
  .logo { display: none; }
}

yerine

.logo {
  background: url(logo.png) 0 0 no-repeat;
}

@media (max-width: 979px) {
  .logo { background-image: none }
}

kullanımı bize performans olarak geri dönecektir.

Kaynaklar

Read more

CSS'de lightdark() fonksiyonuyla kolayca koyu / açık mod yazımı

CSS'de lightdark() fonksiyonuyla kolayca koyu / açık mod yazımı

Bir önceki yazımda bahsettiğim gibi CSS'in yeni özelliklerinin bazıları çığır açan özellikler, bazıları kulllanıcı deneyimini iyileştirme yönünde özellikler bazıları da lightdark() fonksiyonu gibi yazım kolaylığı sağlayan özellikler. lightdark() fonksiyonu mevcut uyumlu web yazımındaki büyük sorun olan aşağıdaki kullanımı daha anlaşılır ve düzenli hale getirmeye yarıyor. :root { color-scheme: light

By Fatih Hayrioğlu