Швидкість сайту в грошах: скільки коштує кожна секунда

Втрата, якої не видно у звіті

Уявіть два браузери, відкриті на вашому сайті в одну й ту саму хвилину. У першому людина дочекалась завантаження і натиснула «Замовити». У другому — не дочекалась, повернулась у видачу й пішла до конкурента. Перша потрапить у ваш звіт. Друга — ні.

Це не метафора, а механіка. Код аналітики вантажиться не першим: спершу браузер тягне HTML, потім стилі й скрипти, і десь у цій черзі спрацьовує лічильник. Хто закрив вкладку раніше — для звіту не існує. Тому фраза «у нас нормальна конверсія» насправді означає «нормальна конверсія серед тих, хто витерпів». Ви оптимізуєте роботу з вижилими й не бачите тих, за кого вже заплатили.

Куди саме витікають гроші

Повільність не забирає бюджет одним великим шматком — вона знімає потроху в чотирьох різних місцях. Саме тому її майже неможливо помітити у звітності: жоден рядок не називається «втрати від очікування».

• Платна реклама. Ціну кліка ви вже заплатили, і вона не залежить від того, побачила людина сторінку чи ні. Якщо з тисячі оплачених кліків до контенту доходить вісімсот, ви купили тисячу, а працюєте з вісьмома сотнями. Вартість заявки росте рівно на цю різницю, і жодне налаштування кампанії її не компенсує — ви ріжете ставки там, де проблема на своєму боці.
• Пошук. Google враховує швидкість як частину сигналів зручності сторінки. Це не головний фактор: швидка сторінка не обжене релевантнішу. Але між двома схожими за змістом вона працює як тайбрейкер. Сильніший ефект непрямий — людина, яка повернулась у видачу за три секунди, клікає наступний результат, і конкурент отримує і візит, і сигнал.
• Глибина перегляду. Затримка множиться на кількість кліків усередині сайту. На лендінгу очікування одне. У каталозі з фільтрами — на кожен вибір розміру, кольору й сторінки списку. Тому інтернет-магазини й великі каталоги страждають найбільше, а односторінковики майже не помічають проблеми.
• Мобільні відвідувачі. Ви дивитесь свій сайт з офісного Wi-Fi, у браузері, де все закешовано з учора, на потужному ноутбуці. Клієнт відкриває його вперше, з телефона середньої ціни, у дорозі. Це фізично різні сайти, і ваше відчуття «та нормально вантажиться» не має до клієнтського досвіду стосунку.

Порахуйте свою ціну секунди

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

1. Порахуйте, у що вам обходиться трафік за місяць. Реклама, робота підрядника, контент, банери — все разом, одна сума.
2. Візьміть кількість сесій за той самий місяць. Ділення дає вартість одного візиту. Часто це перша цифра, яка когось у кімнаті дивує.
3. Оцініть частку тих, хто не дочекався. Не вгадуйте: візьміть розрив між кліками й сесіями з попереднього розділу або звіт про відмови без жодної взаємодії зі сторінкою.
4. Помножте. Вартість візиту × кількість тих, хто пішов до першого екрана = ваш щомісячний рахунок за очікування. Це не прогноз, це гроші, які вже витрачені.
5. Зафіксуйте дату й цифри. Після прискорення повторіть той самий підрахунок на тому ж каналі й у тому ж сезоні. Різниця й буде вашою ціною секунди — своєю, а не запозиченою.

Звідки береться повільність

У девʼяти випадках із десяти причина не одна й не екзотична. Ось із чого зазвичай складається затримка — від найважчого до найтихішого.

• Зображення. Фото, зняте телефоном, важить кілька мегабайтів і має ширину 4000 пікселів. У макеті воно займає 400. Браузер усе одно завантажує оригінал і зменшує його вже у себе — ви платите трафіком клієнта за пікселі, яких ніхто не побачить. Часто це більша половина ваги сторінки.
• Шрифти. Дві родини по чотири накреслення — це вісім файлів, які треба завантажити до того, як зʼявиться текст. Кожне зайве накреслення додає час на порожньому екрані заради відтінку, якого ніхто не помічає.
• Сторонні скрипти. Чат, піксель, карта, віджет відгуків, два аналітичні лічильники, банер акції. Кожен — запит до чужого сервера, швидкість якого ви не контролюєте взагалі. Половину з них поставили «на тиждень, потестувати» два роки тому й забули.
• Хостинг і час до першого байта. Якщо сервер думає над відповіддю 800 мілісекунд, стиснення картинок нічого не змінить: ви покращуєте те, що починається після цієї затримки. Це найчастіша причина ситуації «все стиснули, а швидше не стало».
• Конструктор і плагіни. Кожен модуль тягне власні стилі й скрипти на всі сторінки сайту — навіть туди, де його немає. Двадцять плагінів — це двадцять комплектів багажу, який їде з вами завжди, навіть на порожню сторінку контактів.

Перевірка за пʼять хвилин

Щоб говорити з підрядником предметно, технічний фах не потрібен. Потрібні кілька дій і записані цифри.

1. Вставте адресу в PageSpeed Insights. Дивіться не на кольоровий бал, а на верхній блок із даними реальних користувачів, якщо він є: це те, що бачать живі люди, а не лабораторний прогін на змодельованому пристрої.
2. Звірте три метрики з офіційними порогами. LCP — до 2,5 секунди, INP — до 200 мілісекунд, CLS — до 0,1. Ці числа не мої, вони задокументовані в Core Web Vitals. Простими словами: LCP — коли зʼявляється головний блок, INP — наскільки швидко сторінка відповідає на дотик, CLS — чи стрибає верстка під пальцем.
3. Перевіряйте мобільну вкладку окремо. Десктопний результат майже нічого не каже про телефон, а телефон — це більшість вашого трафіку.
4. Візьміть секундомір. Мобільний інтернет, не офісний Wi-Fi. Приватне вікно, щоб не було кешу. Порахуйте час до появи головного зображення й окремо — до моменту, коли кнопка вже натискається.
5. Перевірте три різні типи сторінок. Головна, каталог або категорія, картка товару чи послуги. Вони важать по-різному, і повільною зазвичай виявляється не та, яку показують керівництву.
6. Зробіть те саме для двох конкурентів із видачі. Ось це і є ваша реальна планка — не абстрактні 90 балів у кружечку.

Найбільший приріст за найменші гроші

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

1. Зображення. Стиснути, віддавати в сучасному форматі, прописати ширину й висоту в коді, увімкнути відкладене завантаження для всього нижче першого екрана. Кілька годин роботи — і часто мінус половина ваги сторінки.
2. Ревізія сторонніх скриптів. Випишіть усі й для кожного знайдіть людину, яка реально користується даними. Не знайшлась — вимикайте. Коштує нуль, ефект видно того ж дня.
3. Кешування. Кеш готових сторінок плюс кешування на рівні сервера. Дешево й одразу впливає на час до першого байта.
4. Шрифти. Залишити два накреслення, віддавати зі свого домену, дозволити показувати текст, поки шрифт ще вантажиться.
5. Хостинг. Перехід із найдешевшого тарифу на нормальний іноді дає більше, ніж місяць правок у коді, — особливо коли час до першого байта стабільно за півсекунди.
6. І тільки потім код. Критичний CSS, розбір бандлів, переробка теми. Це найдорожча частина, і вона дає останні відсотки, а не перші.

Коли швидкість уже не вузьке місце

Продавати оптимізацію можна нескінченно, тому корисно знати, коли зупинитись.

• Ви вже близько до порогів. Якщо головний блок зʼявляється за дві секунди, боротьба за наступні триста мілісекунд коштуватиме дорого і майже не позначиться на грошах.
• Мало трафіку. Відсотки множаться на обсяг. За двохсот візитів на місяць прискорення дасть частку заявки — спершу має бути кого прискорювати.
• Сайт швидкий, а заявок немає. Тоді причина в іншому: у пропозиції, доказах або самій формі. Про це є окремий розбір — вісім перевірок, коли сайт є, а заявок немає.
• Довгий цикл угоди. Якщо клієнт шукає постачальника обладнання пів року й порівнює специфікації, він витерпить і пʼять секунд. Тут швидкість — гігієна, а не важіль продажів.

Швидкість — це множник, а не джерело. Вона підсилює те, що вже працює, і чесно множить нуль на нуль, якщо працювати немає чому. Тому починати варто не з рахунку за оптимізацію, а з питання «чи є що прискорювати» — і з власної, порахованої на своїх даних ціни секунди. Інші розбори з цієї теми — у розділі SEO.

Часті питання