Як підготувати сайт медзакладу до великого оновлення google в березні 2024 року

25 жовтня, 2023 00:40

882

25 жовтня, 2023 00:40

882

Ще декілька років тому медичну спільноту навряд чи заінтригував матеріал з таким заголовком. Але сьогодні медики активно стежать за позиціями свої веб-сайтів та створюють безліч публікацій на сторінках Інтернету. Тому стежимо за важливими змінами бо втрата позицій у пошуковій видачі Google дорівнює втраті частки доходу.

Основні веб-показники та критерії в алгоритмах пошуку Google – змінюються! Цей набір показників, вперше представлений ще у 2022 році для вимірювання взаємодії з користувачем, отримує, мабуть, найбільше оновлення з моменту його запуску. Навіщо щось змінювати? Google підштовхує власників сайтів до покращень заради користувачей.

Для іт-фахівців новини повідомляють коротко: у березні 2024 року Google замінить показник FID на INP. Але ж наскільки це важливо та що за цим стоїть?! Тому розберемось.

FID (англ. First input delay) - це Затримка Першого Введення - одна з метрик продуктивності веб-сторінок, яка описує час, що минув з того моменту, коли користувач вперше почав взаємодіяти з веб-сторінкою, тобто натиснув на посилання, кнопку або на інший елемент керування до момента відповіді веб-браузера на дану взаємодію. Таким чином, це проміжок часу в мілісекундах між першою взаємодією користувача з веб-сторінкою та відповіддю браузера на цю взаємодію.

INP (англ. Interaction to Next Paint) — це Взаємодія з Наступною Фарбою чи образом. На практиці це означає, що сайт медичного закладу або лікаря має реагувати до 0.2 секунд на дії користувача. Простими словами можна сказати, що зміни полягають у тому, що робиться більший акцент на роботу програмного забезпечення самого вашого сайту та вимірюється швидкість оновлення веб-сторінок не тільки після першої дії користувача, а швидкість реакції сайту на всі взаємодії користувача під час його перебування на вашому сайті.

Як можна покращити показник INP? У цій публікації ми все роз’яснимо. Далі багато технічних понять.

Якщо ж ви, шановний читач, є власником веб-сайту, а розробкою та удосконаленнями займаються інші фахівці, то просто переадресуйте цю статтю та попросить звернути увагу.
Та пам’ятайте, що завжди поруч з вами фахівці Медичної платформи ІТМЕД. Просто напишіть або зателефонуйте та отримайте фахову консультацію. Контакти тут: https://itmed.org/contacts/

Що таке взаємодія з наступною фарбою (INP)?

Google надає таке визначення:

«INP оцінює швидкість реагування, використовуючи дані з Event Timing API. Якщо взаємодія призводить до того, що сторінка перестає відповідати, це означає погану взаємодію з користувачем. INP спостерігає затримку всіх взаємодій користувача зі сторінкою та відокремлює одне значення, нижче якого були всі (або майже всі) взаємодії. Низький INP означає, що сторінка завжди не могла швидко реагувати на всі або переважну більшість взаємодій користувача».

Google розуміє, що деякі взаємодії завантажуються довше, ніж інші, особливо складні. Але це не обов’язково спричиняє погану взаємодію з користувачем. Таким чином, INP вимірює не час відповіді на всю взаємодію, а час відповіді, доки ваш сайт не надасть певної форми візуального зворотного зв’язку (наприклад, появи спадного меню або значка завантаження). Не обов’язково завершувати взаємодію повністю, потрібно лише довести, що процес іде.

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

Визначення взаємодій

Щоб зрозуміти, як працює INP, і правильно його виміряти, нам потрібно зрозуміти, що означає «взаємодія».

Google визначає взаємодію як групу подій, які відбуваються під час «одного й того самого логічного жесту користувача».

Іншими словами, це не просто одна подія. Наприклад, натискання кнопки на пристрої з сенсорним екраном може містити кілька подій, у тому числі події pointerup (коли миша неактивна) і pointerdown (коли миша натискає кнопку), усі об’єднані в одну. Google зараховує подію з найдовшою тривалістю як затримку взаємодії.

INP від Google спостерігає лише такі взаємодії:

Загалом, Google вимірює три компоненти:

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

Час обробки – це час, який потрібен для запуску програмного коду у відповідь на взаємодію користувача. Це може тривати мілісекунди, якщо внесені лише невеликі зміни.

Затримка презентації – це час, який ваш браузер витрачає на визначення місця появи нового вмісту. Ця тривалість може значно відрізнятися залежно від складності вашого веб-сайту.

Порівняння FID з INP

FID є показником швидкості реагування вашого сайту, але він вимірює лише першу взаємодію користувача та лише затримку до обробки події, а не до моменту, коли користувач побачить результати.

Це відрізняється від Interaction to Next Paint, який вимірює затримку кожної окремої взаємодії користувача зі сторінкою.

Що таке хороша оцінка INP?

Google пропонує неабиякі вказівки щодо того, що є хорошим показником INP.

По-перше, Google усвідомлює, що важко визначити швидкість реагування як хорошу чи погану, коли існує така мінливість у можливостях пристрою користувача. Ось чому вони рекомендують орієнтуватися на 75 процентів завантажень сторінок на мобільних і настільних пристроях.

Що стосується часу затримки:

Чому Google переходить на INP?

У березні 2024 року INP замінить FID як один із трьох основних показників веб-показників Google.

Google каже, що дані про використання Chrome показують, що переважну більшість, 90% часу користувач проводить на сторінці після її завантаження. Це означає, що не варто просто вимірювати затримку до першої події на сторінці FID, нам потрібно виміряти затримку для кожної взаємодії, яка виконується INP.

Коротше кажучи, FID не був настільки добрим у визначенні поганого досвіду користувачів, оскільки він перестав вимірювати затримки.

Що ж робити? Як оптимізувати INP

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

Ось практичні рекомендації.

1. Виміряйте свій INP

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

Звіт Chrome UX – це один із найшвидших і найпростіших способів отримати польові дані, якщо ваш сайт відповідає вимогам. Якщо ні, ви можете скористатися постачальником реального моніторингу користувачів (RUM), наприклад Pingdom або Raygun, щоб створити дані поля.

Якщо у вас немає часу або бюджету для збору польових даних, рекомендується скористатися інструментом PageSpeed Insights. Цікава перевага PageSpeed Insights полягає в тому, що він використовує польові дані, зібрані Google, і дані Lab для вимірювання вашого INP.

Просто введіть свою URL-адресу, натисніть enter, і вам буде запропоновано оцінку INP.

2. Оптимізуйте взаємодію між контентом та юзером

Як вже згадувалось, кожну взаємодію можна розбити на три різні етапи:

2.1 Затримка введення

2.2 Час обробки

2.3 Затримка презентації контенту

Оскільки кожен етап взаємодії сприяє затримці, ви можете оптимізувати свій INP, зменшивши обробку ЦП, необхідну на кожному етапі.

3. Оптимізація затримки введення

Є кілька стратегій, які можна використати, щоб скоротити час, потрібний для «введення».

Оптимізація JavaScript — це перше. Повільне виконання JavaScript може спричинити затримки введення, але ви можете виправити це, мінімізувавши файли JavaScript, увімкнувши стиснення GZip, використовуючи фреймворк JavaScript, наприклад jQuery, і використовуючи мережу доставки вмісту (CDN) для доставки файлів JavaScript із сервера, який знаходиться ближче до вашої аудиторії. .

По-друге, мінімізація активності потоку. Коли на вашій сторінці багато активності (зображення, відео тощо), це може сповільнити відповідь на введення. Але ви можете використовувати веб-воркер, щоб самостійно втекти від основної нитки вашого сайту.

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

Вирішіть проблему, усунувши вхідні дані, щоб зменшити зворотні виклики, і використовуючи AbortController для скасування вихідних запитів на вибірку.

4. Оптимізація часу обробки

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

Якщо необхідні зворотні виклики, розділіть роботу на окремі завдання та переконайтеся, що спочатку виконуються лише основні процеси, необхідні для візуальних оновлень. Найкращий спосіб зробити це — використовувати setTimeout для запуску зворотних викликів в окремому завданні. Якщо ви не впевнені, як це зробити на практиці, Google має докладний посібник з оптимізації довгих завдань.

5. Оптимізація затримки презентації контенту

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

Ви можете зменшити розмір DOM кількома способами:

Де знайти показники INP?

Оскільки Interaction to Next Paint (INP) незабаром стане частиною Core Web Vitals, ви можете знайти відповідні показники за допомогою інструмента Google PageSpeed Insights. Просто введіть свою URL-адресу, і ви отримаєте час у мілісекундах, який є вашим INP.

Що таке «гарний» бал INP?

Гарна оцінка INP за даними Google дорівнює або менше 200 мілісекунд. Все, що становить від 200 до 500 мілісекунд, потребує покращення, а все, що перевищує 500 мілісекунд, вважається поганим.

Висновок

INP — це показник Core Web Vitals, який замінить затримку першої взаємодії FID у 2024 році. Це показник часу, який потрібен вашому сайту, щоб відповісти на взаємодії користувача. Чим менша затримка, тим краща продуктивність.

Оскільки Core Web Vitals є частиною алгоритму ранжування Google, ми наполегливо рекомендую вам оптимізувати свій INP, зменшивши обробку ЦП на вашому сайті за допомогою стратегій оптимізації коду.

ІТМЕД – СТВОРЕННЯ САЙТІВ та ПОСТАЧАННЯ МЕДТЕХНІКИ
вул. Чумака Василя, 5, оф. 2, Київ, 03065. Офіційний сайт: itmed.org