Поширені питання про шрифти

Завантажте файли шрифту на свій сервер, опишіть їх у CSS за допомогою @font-face, а потім вкажіть назву сімейства у font-family. На сторінці кожного шрифту WebFonts можна сформувати й скопіювати готовий CSS-код.

Для сучасних сайтів зазвичай обирають WOFF2: він добре підтримується браузерами та має ефективне стиснення. WOFF можна залишити як запасний формат для старіших браузерів. TTF та OTF частіше використовують для встановлення на компʼютер і роботи в графічних редакторах.

Не завжди. Позначка «безкоштовний» не визначає дозволені способи використання. Перевірте ліцензію конкретного шрифту: вона може дозволяти особисте використання, комерційні роботи, вебвбудовування або вимагати зазначення автора. За сумнівів зверніться до автора чи правовласника.

Введіть український текст у поле превʼю та перевірте літери Ґ, Є, І, Ї, а також апостроф і розділові знаки. На WebFonts можна відфільтрувати шрифти за мовною підтримкою й одразу протестувати власний текст у доступних накресленнях.

Використовуйте WOFF2, підключайте лише потрібні накреслення та набори символів, налаштуйте тривале кешування і font-display. Критичний шрифт можна попередньо завантажити через preload, але не варто preload-ити всі файли.

Вебшрифт — це файл шрифту, який браузер завантажує разом зі сторінкою. Завдяки цьому сайт може показувати обрану гарнітуру, навіть якщо її не встановлено на пристрої користувача.

Гарнітура — це спільний дизайн сімейства, наприклад Inter. Шрифт — конкретне накреслення цього сімейства, наприклад Inter Bold Italic. У повсякденній мові слово «шрифт» часто використовують для обох понять.

Variable font зберігає кілька варіацій дизайну в одному файлі. Залежно від доступних осей можна плавно змінювати вагу, ширину, нахил чи інші характеристики без завантаження багатьох окремих файлів.

Це різні рівні насиченості. Зазвичай 400 відповідає Regular, 500 — Medium, 600 — Semibold, 700 — Bold, а 900 — Black. Реальний вигляд залежить від конкретної гарнітури.

Для більшості сайтів достатньо однієї гарнітури з кількома накресленнями або пари сумісних гарнітур. Менша кількість файлів спрощує візуальну систему та зазвичай покращує швидкість завантаження.

Fallback показується, поки основний файл завантажується, або якщо він недоступний. Добирайте запасний системний шрифт зі схожими пропорціями, щоб зменшити стрибки макета.

Перевіряйте шрифт на реальному тексті й потрібній мові, у малих розмірах та на різних екранах. Важливі чіткі форми літер, достатня висота малих знаків, комфортні інтервали, контраст і помірна довжина рядка.