Duyarlı Tipografi

CSS içinde duyarlı tipografi kavramını, kullanım sınırlarını ve güvenilir uygulama biçimini öğrenin.

Duyarlı Tipografi, CSS ile duyarlı tasarım çalışırken bileşenler arasındaki sorumlulukları belirginleştirmek için kullanılan yaklaşımı açıklar. Duyarlı tasarım cihaz adına değil mevcut alana ve kullanıcı tercihlerine göre uyarlanır.

Keskin kırılma noktalarını çoğaltmak yerine akışkan ölçüler, içerik tabanlı eşikler ve hareket azaltma tercihleri kullanılmalıdır. Girdinin biçimini ve geçerliliğini sınırda denetlemek, iç katmanların daha sade kalmasını sağlar. Aşağıdaki örnek, konuyu küçük ve izlenebilir bir akış içinde gösterir.

Yaygın hata ve doğru yaklaşım

Örneği üretim koduna bağlamından kopararak taşımak güvenlik ve bakım sorunlarına yol açabilir. Kaynak ömrünü, veri büyüklüğünü ve eşzamanlı erişimi ayrıca değerlendirin.

Sonuç

Duyarlı Tipografi, doğru sınırlar ve açık bir sözleşmeyle kullanıldığında CSS kodunun güvenilirliğini artırır. Önce doğruluğu kurun; ölçüm göstermeden karmaşık optimizasyona yönelmeyin.

Duyarlı Tipografi örneği

.page {
  width: min(100% - 2rem, 70rem);
  margin-inline: auto;
}

@container (min-width: 36rem) {
  .lesson { display: grid; grid-template-columns: 2fr 1fr; }
}