Як налаштувати 404 сторінку, щоб утримати клієнта

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

Почнемо з основ

Отже, що таке помилка 404? Це повідомлення, яке з'являється, коли сайт не може знайти потрібну сторінку. Це означає, що вебсторінка або не існує, або її адреса неправильна.

Така проблема може виникнути з кількох причин:

• виникла помилка в посиланні на сторінку;
• вебсторінку було видалено;
• змінилася адреса сторінки;
• сервер працює некоректно.

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

Для чого потрібні кастомні сторінки 404

Насамперед створення сторінки 404 необхідне для того, щоб утримати відвідувачів на сайті та уникнути втрати трафіку. Стандартна сторінка виглядає так:

Або так:

Як бачите, вона зовсім неінформативна та ніяк не відображає змісту того чи іншого ресурсу. Побачивши таку сторінку, користувач, найімовірніше, просто закриє сайт.

Кастомне оформлення 404 сторінки дозволить розмістити корисні посилання на важливі розділи, такі як «Головна», «Контакти» або «Питання-відповідь». Наприклад, інтернет-магазин може запропонувати посилання на популярні товари, а блог — на статті, що найбільше читаються. Також можна адаптувати дизайн під стиль вашого сайту, щоб це виглядало органічно.

Які елементи повинні бути присутніми на сторінці помилки

Правильна сторінка 404 повинна не тільки повідомляти про помилку, але й допомагати користувачу повернутись до роботи з сайтом. Для цього на ній потрібно розмістити декілька ключових елементів:

• Повідомлення про помилку. Простий текст, такий як «Сторінку не знайдено», який висвітлить суть проблеми. Повідомлення має бути чітким та зрозумілим, без технічних подробиць.

• Посилання на головну сторінку. Це основний спосіб повернути користувача до корисного контенту.

• Пошук по сайту. Зручний інструмент швидкого знаходження потрібної інформації.
• Корисні посилання. Розділи сайту, які можуть зацікавити відвідувача, наприклад каталог товарів.

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

Створюємо сторінку 404

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

Також дуже важливо знати, як налаштувати 404 сторінку, щоб вона працювала коректно. Для цього потрібно знайти файл .htaccess, який також знаходиться в кореневій директорії сайту. У цей файл потрібно додати спеціальний код, який вкаже серверу шлях до нової вебсторінки 404:

ErrorDocument 404 https://domain/404.html

Після внесення змін не забудьте завантажити оновлені файли на хостинг. Таким чином, відображатиметься саме та сторінка 404, яку ви створили, а не стандартна. Можна використовувати як розширення php, так і html — це не має принципового значення.

Після цього обов'язково перевірте роботу вебсторінки. Найпростіший спосіб — навмисно ввести неправильну адресу на вашому сайті, наприклад додавши зайву літеру в URL. За умови, що все налаштовано правильно, ви побачите свою нову вебсторінку 404 замість стандартної. Якщо щось пішло не так, уважно перевірте правильність написання коду та переконайтеся, що всі файли знаходяться у потрібних папках.

Для користувачів WordPress є простіше рішення, як зробити сторінку помилки 404, — плагін 404page. Він дозволяє легко додати 404 на сайт. Достатньо мати версію CMS не нижче 4.0.

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

Яким має бути дизайн

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

Дизайн можна обіграти відповідно до вашої сфери діяльності:

• для магазину одягу — зображення манекена, що «загубився»;
• для піцерії — ілюстрація зниклого шматка піци;
• для турагентства — карта із загубленим островом.

Також можна використовувати різні креативні елементи:

• анімації;
• прості мініігри (наприклад, «знайди вихід з лабіринту»);
• рухомі ілюстрації, які змінюються при наведенні курсору;
• короткі анімовані історії;
• генератор випадкових кумедних повідомлень про помилку.

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

Добірка цікавих вебсторінок 404

Яскравий приклад дизайну, виконаного у стилі інтернет-магазину:

А тут на помилку вказує розбита та розлита парфумерія та косметика:

Ще один цікавий дизайн, в якому розповідається, що кролик знову перегриз кабель, через що вебсторінку не знайдено:

Як бачите, варіантів обіграти помилку — маса. Головне — не залишати все на самоплив, адже ігнорування непрацюючих посилань і сторінок може призвести до зниження позицій вашого сайту.

Чому важливо усувати помилки на сайті

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

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

Підіб'ємо підсумки

При правильному підході вебсторінка з помилкою може стати вашою перевагою. Достатньо зробити помилку 404 на сайті цікавою та максимально корисною для користувача. Креативний дизайн, гумористичний чи доброзичливий текст можуть пом'якшити негативні враження. І це не тільки покращить досвід користувача, але й підвищить ймовірність того, що відвідувач залишиться на сайті, а не піде до конкурентів.