First Contentful Paint (FCP, перше змістовне відображення) — це метрика швидкості, що фіксує час від початку завантаження сторінки до моменту, коли на екрані з’являється перший видимий елемент контенту: текст, зображення чи графіка. Простіше кажучи, це мить, коли користувач бачить, що сторінка «ожила», а не порожній білий екран.
Простими словами: FCP — це перша ознака життя. Ти відкрив посилання, і замість білого нічого проступив бодай заголовок чи логотип — ось цей момент і заміряють.
Що таке FCP і навіщо він потрібен
FCP — один із ключових показників сприйнятої швидкості завантаження. Він відповідає на просте питання користувача: «сайт узагалі працює?». Google рекомендує тримати FCP до 1,8 секунди — це «зелена» зона. Від 1,8 до 3 секунд — потребує покращення, понад 3 секунди — погано. FCP входить у звіти PageSpeed Insights і Lighthouse і, хоч сам не є Core Web Vitals, тісно пов’язаний із загальним враженням від швидкості.
Яке значення FCP вважається хорошим
| FCP | Оцінка |
|---|---|
| до 1,8 с | Добре (зелена зона) |
| 1,8–3,0 с | Потребує покращення |
| понад 3,0 с | Погано |
Як покращити FCP
- Прискорити відповідь сервера (зменшити TTFB): кешування, швидкий хостинг, CDN.
- Прибрати блокуючі рендеринг ресурси — важкий CSS і JavaScript у <head>.
- Оптимізувати шрифти (font-display, попереднє завантаження ключових шрифтів).
- Стиснути й правильно віддавати зображення, що потрапляють у перший екран.
Приклад
Два інтернет-магазини на однаковому дизайні. У першого сервер віддає HTML за 200 мс і заголовок з’являється майже одразу — FCP близько 1,2 с. У другого важкі скрипти блокують рендеринг, і перший контент проступає лише на 3,4 с. Другий користувач частіше закриває вкладку, не дочекавшись, — і це прямо б’є по поведінкових факторах.
Часто плутають з…
- LCP — час до появи найбільшого елемента контенту; FCP — до першого. LCP входить у Core Web Vitals, FCP — ні.
- TTFB — час до першого байта від сервера; він передує FCP.
- First Paint — момент будь-якого відмальовування (навіть фону); FCP рахує саме змістовний контент.
Питання та відповіді
Чим FCP відрізняється від LCP?
FCP фіксує появу першого видимого контенту, а LCP — найбільшого (зазвичай головного зображення чи заголовка блоку). LCP входить у Core Web Vitals, FCP — це допоміжна метрика швидкості.
Яке значення FCP вважається хорошим?
До 1,8 секунди — добре, 1,8–3 секунди — потребує покращення, понад 3 секунди — погано. Це офіційні пороги Google.
Чи впливає FCP на SEO?
Напряму FCP не є фактором ранжування, але як частина сприйнятої швидкості впливає на поведінкові сигнали й опосередковано — на позиції. Повільний перший контент збільшує відмови.
Сторінка довго показує «біле ніщо» перед завантаженням? Прискоримо перший рендер — SEO-аудит швидкості та виправлення помилок на сайті.
Схожі терміни: Швидкість завантаження, LCP, Core Web Vitals, PageSpeed.