Урок 7: CSS Анімації – Оживи Свої Веб-Сторінки!

Огляд

Вітаю знову, креативний генію! 🎨 Якщо CSS переходи – це такі собі ввічливі танцювальні па, то CSS анімації – це повноцінний танцювальний батл із ліхтарями, музикою і диско-кулею. У цьому уроці ми перейдемо на новий рівень і навчимося створювати анімації, які перетворять твої статичні елементи на динамічні, живі витвори мистецтва.

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

Урок 6: CSS-переходи — Зроби, Щоб Твої Елементи Рухались Гладко!

Огляд

Привіт, майстре плавних рухів! 🪄 Готовий перетворити свої елементи HTML на справжніх танцюристів? Якщо базові стилі CSS — це як розташувати меблі в кімнаті, то CSS-переходи — це як змусити ті меблі пливти плавно з кута в кут, мов на балеті. У цьому уроці ти дізнаєшся, як додати до своїх кнопок і тексту трошки магії, щоб вони більше не стрибали, а елегантно ковзали.

Урок 5: Media Queries — Як Зробити, Щоб Сайт Виглядав Добре на Будь-якому Екрані!

Огляд

Привіт, майстре дизайну! 🧐 Якщо CSS Grid — це як організувати весілля з безліччю гостей, то media queries — це як підібрати всім гостям правильний розмір сорочки, щоб ні в кого не розійшлися шви. Подумай про media queries, як про кравця для свого CSS — вони допоможуть усе підлаштувати так, щоб на великому екрані сайт виглядав елегантно, а на маленькому — компактно і зручно.

Урок 4: CSS Grid – Наводимо Порядок, Як у Бабусі на Городі!

Огляд

Привіт, майстре веб-дизайну! 🧐 Якщо Flexbox був як обід на подвір’ї, де всі сидять, де заманеться, то CSS Grid — це справжній прийом у бабусі. Уяви, що ти готуєш застілля: тут у нас столи, стільці, миска з варениками, огірочки на закуску—і все це розставлене з ювелірною точністю, щоб кожен гість відчував себе, як удома.

Після цієї лекції ти зможеш створювати складні макети, наче розставляєш вареники в макітрі — кожен елемент буде на своєму місці. Готовий стати майстром CSS Grid? Хапай кухоль чаю і поїхали!

HTML для початківців (Так, навіть ти зможеш!)

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

Чому ти навчишся?

У цьому курсі ми покроково проведемо тебе через основи HTML:

• Базова структура HTML: Дізнайся, що є основою кожної вебсторінки, і зрозумій, що це простіше, ніж збирати меблі з IKEA.
• Заголовки, параграфи та списки: Нарешті, спосіб організувати свої думки, не виглядаючи так, наче ти кричиш на людей в інтернеті (без Caps Lock, обіцяємо).
• Зображення та посилання: Додай трохи стилю своїм сторінкам, зображенням і посиланням, які дійсно ведуть кудись, а не на сторінку “404”.
• Форми: Створи такі форми, що люди навіть захочуть їх заповнювати. (Гарантій не даємо, але постараємось.)

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

Урок 4: Створюємо форми — Бо питати електронну пошту вживу якось ніяково

Вітаю на Уроці 4! Тепер, коли на твоїй вебсторінці вже є картинки та посилання, настав час зробити її ще цікавішою — взаємодією з відвідувачами! І як це зробити? За допомогою форм! Чи то для збору електронних адрес, відгуків, чи навіть для вирішення вічного питання про те, чи варто класти ананас на піцу — HTML-форми допоможуть (і це набагато менш ніяково, ніж питати це вживу!).

Урок 3: Додавання зображень і посилань — Бо хто ж хоче нудну веб-сторінку?

Вітаємо на Уроці 3! На цей момент ваша веб-сторінка може нагадувати шкільну доповідь, але ми ось-ось це виправимо. Сьогодні ми додамо трохи перцю у вигляді зображень і посилань — адже ніщо не каже «професійно», як сторінка, повна фотографій котиків і клікабельних мемів. Давайте виведемо вашу сторінку з «та таке» на «оце так!» за допомогою кількох простих тегів!

Урок 1: Основи HTML – Ваш перший крок до панування в Інтернеті (Тепер із Caddy сервером!)

Ласкаво просимо, майбутній володар Інтернету! Сьогодні ми зануримось у захоплюючий світ HTML – тої самої таємної зброї, на якій будується кожен сайт. Ви створите свою першу веб-сторінку (так, це насправді!) і, якщо захочете бути ще крутішими, ми навіть покажемо, як розмістити її локально за допомогою Caddy. Але не хвилюйтесь, Caddy – це не обов’язковий інструмент для вивчення HTML, він тут лише для того, щоб ви виглядали ще крутіше. Готові? Тож почнімо!