Привіт
0:00
Привіт друзі в цьому відео Я розповім
0:02
вам як створити красиву та ефективну
0:04
сторінку помилки
0:07
[музика]
0:12
поїхали сторінка помилки або сторінка
Поради та ідеї
0:15
404 інформує користувачів про те що вони
0:18
перейшли за неіснуючим посиланням або
0:20
ввели неіснуючу адресу Вона може мати
0:23
різноманітний дизайн мінімалістичний
0:26
веселий або строгий все залежить від
0:28
вашого продукту і на настрою який ви
0:30
прагнете створити перш ніж ми почнемо
0:33
створювати нашу власну сторінку Я хотіла
0:35
б поділитися з вами кількома корисними
0:37
порадами які ґрунтуються на прикладах
0:39
реальних сторінок 404 і пояснити як вони
0:43
привертають увагу користувачів і
0:45
заохочують їх залишитися на сайті і
0:47
перша порада дотримуйтеся єдиного стилю
0:50
сторінка 404 є частиною вашого сайту
0:53
тому намагайтеся дотримуватись того ж
0:55
стилю шрифтів кольорів і настрою що й на
0:58
всіх інших сторінках надайте можливість
1:01
вибору але не перевантажуйте сторінку
1:03
коли відображається сторінка 404
1:06
користувачі перенаправляються на
1:07
попередню сторінку але хто любить
1:09
повертатися назад краще дати
1:12
користувачам можливість піти далі
1:13
наприклад на головну сторінку або
1:15
будь-який інший розділ але обмежтеся
1:18
кількома посиланнями і не перевантажуйте
1:21
користувача коротко Поясніть що пішло не
1:23
так І що саме спричинило помилку
1:25
одного-двох речень буде достатньо
1:28
Додайте трохи гумору користувачі можуть
1:30
засмучуватись коли не можуть знайти
1:32
потрібну інформацію чому б не підняти їм
1:35
настрій кументні картинки або відео
1:37
чудово впораються з цією задачею
1:40
викличіть емоції деякі дизайнери
1:42
навмисно відмовляються від номеру 404 і
1:45
замість нього використовують слова Ой Хм
1:47
або О ох а також додають анімацію або
1:50
ілюстрації щоб викликати емоції у
1:53
користувачів такий підхід заохочує їх
1:55
шукати потрібну інформацію далі створіть
1:58
інтерактивну сторінку помилки
2:00
інтерактивні сторінки помилки або
2:02
сторінки з елементами гейміфікації також
2:05
чудовий спосіб заохотити користувачів
2:07
залишитись на сайті ось наприклад у
2:09
фігмана сторінці номер 404
2:12
відображається у векторах які ви можете
2:14
змінювати на свій розсуд використовуйте
2:17
продукт для компаній які продають різні
2:19
товари гарною ідеєю є використання
2:22
зображень цих товарів надихнувшись
2:24
цікавими ідеями давайте перейдемо до
Створює сторінку 404
2:27
створення власної сторінки 404
2:30
вставляємо робочу область і налаштовуємо
2:35
[музика]
2:40
сітку і тепер розміщуємо на ній всі
2:43
обов'язкові елементи а саме логотип адже
2:46
саме логотип і стиль бренду дозволить
2:48
користувачу одразу зрозуміти на якому
2:51
сайті Він знаходиться далі вставляємо
2:53
заголовок який чітко інформує
2:55
користувача про те що він знаходиться на
2:57
сторінці 404 на приклад сторінку не
3:00
знайдено робимо його трохи товщим та
3:03
збільшуємо до 52
3:06
пунктів висота лінії буде
3:09
120%. нижче у нас буде опис причини
3:12
виникнення помилки Оскільки ми хочемо
3:14
пояснити чому саме користувач потрапив
3:17
на цю сторінку як я згадувала раніше це
3:19
може бути неіснуюче посилання помилка в
3:22
адресі або тимчасова проблема з сервером
3:25
розміри тексту Залишаємо такими як ви
3:27
бачите на екрані і змінюємо тільки колір
3:30
на трохи світліший відтінок далі нам
3:33
потрібно запропонувати варіанти для
3:35
подальших дій щоб користувач все-таки
3:37
залишився на нашому сайті наприклад
3:39
можна додати рядок пошуку щоб користувач
3:41
міг знайти те що він шукає за ключовими
3:43
словами в налаштуваннях тексту Залишаємо
3:46
все те саме окрім кольору його Я також
3:48
зроблю більш
3:50
світлим вставляємо на робочу область
3:52
іконку пошуку виділяємо разом з текстом
3:55
і створюємо автолейаут інтервал між
3:57
елементами буде вісім пікселів відступи
4:00
Зверху Та знизу по 12 пікселів а з боків
4:03
14 пікселів заокруглюємо Кути Та додаємо
4:07
колір
4:10
контуру також можна додати кнопку яка
4:12
дозволяє користувачеві зв'язатися з вами
4:15
та кнопку переходу на головну сторінку
4:17
змінюємо у них налаштування так як я
4:20
показую на екрані
4:32
[музика]
4:58
далі вирівнюємо всі наші елементи
5:36
і справа вставляємо ось таке зображення
5:38
воно було згенероване за допомогою
5:40
штучного інтелекту в майбутньому Коли ви
5:43
будете працювати над сторінкою 404 для
5:45
реальної компанії за бажання можете
5:47
додати цікаві фірмові ілюстрації або
5:50
візуальні ефекти адже ця сторінка - це
5:52
чудова можливість продемонструвати
5:54
індивідуальність вашого бренду наша
5:56
сторінка 404 готова на цьому все
5:59
сподіваюсь що вам сподобалось Якщо ви
6:01
хочете ще більше уроків напишіть про це
6:03
в коментарях а також Ставте лайки цьому
6:06
відео та підписуйтесь на канал З вами
6:08
була адолька до зустрічі