Web fontları hız testinde iyi, gerçek kullanımda neden düzeni bozuyor?

Bir sitede başlık fontu geç yüklenince yalnızca yazı tipi değişmiyor; satır kırılımları ve kart yükseklikleri de oynuyor. Laboratuvar testinde skor iyi görünse bile özellikle mobil bağlantıda bu kayma tasarımı özensiz gösterebiliyor. Ben son dönemde font optimizasyonunu sadece dosya boyutuyla değil, sayfa düzeninin ne kadar sabit kaldığıyla değerlendiriyorum.

Bence şu üç noktayı birlikte ele almak gerekiyor:

• Gerçekten kullanılan ağırlıkları yükleyin. Tasarımda 400 ve 700 kullanılıyorsa, tema veya eklentilerin eklediği gereksiz ağırlıkları da kontrol edin; her varyant ek istek ve dosya yükü yaratabilir.
• Yerel font dosyası kullanıyorsanız yalnızca ilk ekranda gerekli olan fontu ön yüklemeyi deneyin. Her fontu preload etmek öncelikli kaynaklarla rekabete yol açabilir.
• Yedek fontun ölçülerini ana fonta yakın seçin. Böylece font geç geldiğinde satır uzunluğu ve bileşen yüksekliği daha az değişir. Sonucu mobilde, yavaş bağlantı simülasyonuyla kontrol etmek faydalı.

Siz WordPress’te fontları tema üzerinden mi, yerel dosyayla mı yönetiyorsunuz? CLS’yi azaltırken görsel karakteri korumak için işe yarayan bir yöntem buldunuz mu?