Google Fonts โ 1500+ bepul shrift to'plami. Inter, Roboto, Manrope kabi zamonaviy shriftlar dizaynni go'zallashtiradi. Lekin noto'g'ri ulansa, sayt tezligini sezilarli pasaytiradi va GDPR muammosi tug'diradi. To'g'ri ishlatish muhim.
Muammo: render blocking
Standart Google Fonts ulanishi tashqi serverga so'rov yuboradi. Shrift yuklanguncha matn ko'rinmaydi (FOIT โ Flash of Invisible Text) yoki sakraydi (FOUT). Bu LCP va CLS (Core Web Vitals)ni buzadi.
Eng yaxshi yechim: self-hosting
Shriftni o'z serveringizga yuklang. google-webfonts-helper sayti orqali kerakli shriftni .woff2 formatda yuklab oling. Afzalliklari: 1) Tezroq (bir server). 2) GDPR muammo yo'q (Google'ga so'rov ketmaydi). 3) Keshlash nazorati sizda.
font-display: swap
CSS'da: font-display: swap;. Shrift yuklanguncha tizim shrifti ko'rsatiladi, keyin almashtiriladi. Matn hech qachon ko'rinmay qolmaydi. CLS uchun muhim.
Preload โ eng muhim shrift
<link rel="preload" href="/fonts/inter.woff2" as="font" type="font/woff2" crossorigin>
Asosiy shriftni darhol yuklashga buyuradi โ birinchi ekran tezroq chiqadi.
Faqat kerakli vaznlar
Inter shriftining 9 ta vazni (100-900) bor. Hammasini yuklamang โ har biri qo'shimcha fayl. Odatda 2-3 vazn yetadi: 400 (oddiy), 600 (yarim qalin), 700 (qalin).
Faqat kerakli belgilar (subset)
Lotin, kirill, arab โ har biri alohida subset. O'zbek sayti uchun latin + cyrillic kerak bo'lishi mumkin. Keraksiz subset (masalan, xitoy) yuklamang.
WOFF2 format
Eng zamonaviy, eng kichik format. Barcha modern brauzer qo'llab-quvvatlaydi. WOFF, TTF eskirgan โ faqat juda eski brauzer kerak bo'lsa.
variable fonts
Bitta faylda barcha vazn (100-900). Inter Variable kabi. Agar ko'p vazn kerak bo'lsa, variable font bir nechta alohida fayldan kichikroq bo'ladi.
GDPR ogohlantiruvi
2022'da Germaniyada sud Google Fonts'ni to'g'ridan-to'g'ri ulashni GDPR buzilishi deb topdi (IP manzil Google'ga ketadi). Self-hosting bu muammoni butunlay hal qiladi.
Tekshirish
PageSpeed Insights โ "Ensure text remains visible during webfont load" va "Preload key requests" ogohlantirishlari shrift bilan bog'liq. Bartaraf eting.
Sayt.uz amaliyot
Sayt.uz shriftlarni self-host qiladi, faqat 2-3 vazn, WOFF2, font-display: swap va asosiy shrift preload. Natijada Core Web Vitals yashil va GDPR muammosi yo'q.