Записи з тегом: CSS3

Як додати анімацію завантаження (preloader) на сайт

Під час завантаження «важкого» контенту — високороздільних зображень, кастомних шрифтів або скриптів аналітики — користувач часто бачить напівпорожній екран зі зламаною версткою (Layout Shift). Це створює відчуття повільної… читати... →

333

26

24/09/2026

Як примусово оновити кеш у користувачів 🧹 | Практичні методи

Ви внесли правки в CSS, виправили критичний баг у JavaScript, завантажили файли на сервер і радісно повідомляєте клієнту: “Готово!“. А у відповідь чуєте: “Нічого не змінилося, все поїхало!”… читати... →

1157

30

24/11/2025

Як створити заливку тексту градієнтом з допомогою CSS

Веб-дизайнери та розробники завжди шукають щось нове та креативне, щоб зробити свій сайт унікальним та виразним. Один із таких способів візуально привернути увагу, – використовувати градієнтний текст. Градієнтний… читати... →

983

30

16/08/2025

Як створити просте перемикання кольорового оформлення сайту (CSS та JavaScript)

Якщо ви хочете додати на свій сайт можливість перемикання між світлим/темним режимом кольорового оформлення, тоді ви потрапили за адресою. Хоча така «фіча» може і не користуватися попитом, але… читати... →

1052

32

30/04/2025

Чи є альтернативи у гамбургер-меню для навігації по сайту?

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

1759

33

20/10/2024

Створюємо 5 простих CSS анімацій використовуючи ключові кадри

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

2687

36

15/02/2024

Перші кроки при використанні сітки (Grid Layout) у CSS

Сьогодні левова частка сучасних та популярних сайтів побудована з використанням адаптивного макету, flexbox чи grid систем. Якщо ви візьмете будь-який популярний двигун (CMS) та/або фреймворк — практично всі… читати... →

2589

31

27/01/2024

Як швидко та просто створити CSS-анімацію, використовуючи спрайти

CSS-анімація давно та міцно завоювала визнання користувачів завдяки не тільки своїй простоті, але й можливостям. Використовуючи CSS-анімацію, веб-майстри додають гарну візуальну складову на свій сайт, а також привертають… читати... →

3371

42

14/01/2022

Як створити таймер зворотного відліку за допомогою JavaScript, CSS та SVG (4 способи)

Часто програмістам ставлять завдання створити таймер зворотного відліку, наприклад, коли у клієнта намічається важливий захід, розпродаж або він хоче запустити рекламну акцію. З погляду маркетингу, з таймерами зворотного… читати... →

2700

46

28/12/2021

Сайт для платформи онлайн-навчання BikWebClass

Опис проекту: Розробка сайту для платформи, яка спеціалізується на онлайн-навчанні – BikWebClass. Метою створення платформи є поширення знань і навичок, які будуть корисні дорослій людині в різних областях… читати... →

2656

80

23/06/2020

Способи створення кола за допомогою CSS стилів

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

3875

95

09/06/2020

Маніпулювання ступенем важливості завантаження ресурсів в браузері

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

2498

82

25/05/2020

Сайт для компанії НВ ТОВ «Житомирбіопродукт»

Опис проєкту: Розробка сайту для компанії-виробника в м.Житомир. Компанія НВ ТОВ «Житомирбіопродукт» займається виробництвом натуральних високоякісних продуктів харчування для здоров’я людини, які призначені для забезпечення профілактики виникнення і… читати... →

2645

86

21/05/2020

Уроки по CSS: що таке одиниці перегляду vw, vh, vmin і vmax

Одиниця перегляду, або, як її ще називають – довжина у відсотках від області перегляду – це адаптивна одиниця в CSS стилях, яка дозволяє визначати розміри в процентах від… читати... →

5130

75

19/04/2020

Приклад односторінкового сайту з повноекранними секціями

Односторінковий сайт ідеально підійде для просування нового продукту, короткострокової рекламної кампанії або сайтів-портфоліо. Досить часто для односторінкових сайтів (їх ще називають посадковими сторінками, цільовими сторінками і лендінгами) використовуються… читати... →

3815

67

17/03/2020