[Новый курс] Потрясающие декоративные эффекты на основе радиальных градиентов. Интерактивно, наглядно, без воды.

https://htmlacademy.ru/demos/223

В этой мастерской мы научимся использовать радиальные градиенты для создания потрясающих декоративных эффектов и разберёмся, как создать эффект пульсирующей градиентной заливки текста.

#туториалотhtmlacademy #frontend #html #css

Новые горизонты в CSS

Если делаете выборку с исключениями вручную или с помощью сложных селекторов, то просим минутку внимания. В статье показываем, как исключить ненужные элементы и писать стили точнее и лаконичнее.

Фильтр в мире CSS — псевдокласс :not(). В статье вы узнаете, как использовать эту возможность для создания более читаемых и поддерживаемых интерфейсов и как использовать список селекторов в :not() и не усложнять CSS.

👉🏻Читать статью

Сегодня в 12:00 на эфире мы поговорим о программе обучения, на которой мы готовим будущих разработчиков под реальные задачи. Менеджер компании ClickON расскажет о компании, перспективах для выпускников и ответит на ваши вопросы.

https://htmlacademy.ru/events/live-clickon

Мыслите как дизайнер? HSL в помощь!

В статье мы просто и понятно объясняем, почему HSL — отличная альтернатива RGB. В этой модели цвет задаётся через оттенок (Hue), насыщенность (Saturation) и светлоту (Lightness). Это делает работу с цветами более гибкой и наглядной. Например, чтобы сделать цвет темнее, просто уменьшите Lightness — никаких сложных расчётов!

HSL — это наглядный инструмент, его можно использовать прямо в редакторах кода и графики. Поддерживается всеми современными браузерами. Если вы ещё не пробовали — самое время внедрить HSL в свои проекты!

👉🏻Читать статью

В чём отличие margin и padding?

Когда вы только начинаете, легко перепутать margin и padding. В статье объясняем так, чтобы запомнилось надолго! Margin отвечает за расстояние снаружи элемента, а padding – за пространство внутри.

👉🏻 Подробнее разбираем в статье

Год назад, в июле 2024 года, мы запустили новую главу в русском онлайн-образовании — обучение напрямую под работодателя.

Этого формата как огня боятся все массовые школы и школы без специализации. Ведь он сразу показывает, кто может готовить кадры, а кто просто продаёт видеокурсы.

Прошёл год. Можно подвести первые итоги:

— Мы начинали с 3 партнёрами-работодателями, а сейчас их 35. Популярность совместных программ среди компаний растёт. На старте приходилось пробиваться через стену недоверия работодателей, но стена пробита. Потому что…
— Формат работает. Несколько программ прошли полный жизненный цикл: создание программы, набор группы, обучение, собеседование выпускников, стажировка, переход в штат. Работодатели увидели уровень выпускников и оценили процесс выращивания кадров, который оказался на порядок эффективнее фильтрации с рынка.
— Компании возвращаются для запуска повторных потоков. Этим всё сказано. Вы увидите повторные старты уже в августе.

P.S.: Огромный кайф получаешь, когда передаёшь выпускников напрямую на собеседования в компании, не заставляя их окунаться в зловонное болото, в которое превратились платформы с вакансиями.

HTML Academy и NEWMARK — теперь партнёры. Выпускники флагманских программ HTML Academy, соответствующих стандартам IT-гигантов, смогут попасть в команду NEWMARK

Подробнее: https://tml.io/bigtech-newmark

NEWMARK — digital‑агентство полного цикла с 20-летней историей, специализирующееся на разработке и продвижении корпоративных сайтов и интернет-магазинов, в основном на платформе 1С-Битрикс.

#работодателиhtmlacademy

Сегодня в 12:00 на эфире мы поговорим о программе обучения, на которой мы готовим будущих бэкендеров под реальные задачи. Основатель компании ADM расскажет о компании, перспективах для выпускников и ответит на ваши вопросы.

https://htmlacademy.ru/events/live-adm

Патронус в мире магии — то же, что и атрибуты dataset и data-* в мире HTML и JavaScript

В статье объясняем, как использовать атрибуты data-* для хранения дополнительной информации в элементах. Доступ к данным через dataset в JavaScript — чисто и удобно, а поддержка браузерами — полная.

Если вам нужно привязать к элементу статус или любые другие данные — data-* станет мощным инструментом. Просто, без лишнего кода и с понятным синтаксисом.

💡 Где применять dataset и подробнее о подводных камнях рассказали тут.

Новый курс

Создайте карточку с потрясающим декоративным эффектом в мастерской, состоящей из 14 заданий-головоломок, и отточите свои навыки использования градиентов.

https://htmlacademy.ru/courses/425

Курс доступен по подписке. Бесплатно познакомиться с принципом создания этого декоративного эффекта можно в интерактивной демонстрации.

https://htmlacademy.ru/demos/223

#туториалотhtmlacademy #frontend #html #css

[Новый курс] Удивите коллег и работодателей мастерством создания потрясающих эффектов на чистом CSS, пройдя бесплатный курс:

https://htmlacademy.ru/demos/225

В этой мастерской мы продолжим использовать радиальные градиенты для создания потрясающих декоративных эффектов и разберёмся, как создать эффект сияющей иллюстрации взрыва.

#туториалотhtmlacademy #frontend #html #css

Что пора менять в вёрстке в 2025 ?

Многие приёмы, которые ещё недавно казались стандартом, сегодня считаются устаревшими. В статье собрали практики, от которых стоит отказаться: среди них — миллионные медиазапросы, чтобы элемент красиво сжимался на мобильных устройствах и рос на больших экранах. Вместо этого — одна строка через clamp(), который сам определяет ширину в зависимости от ширины вьюпорта, не выходя за минимальные и максимальные пределы.

Если вы работаете с HTML и CSS на ежедневной основе — стоит сверить свои привычки с актуальными подходами. Статья полезна не только новичкам: даже опытные верстальщики найдут, что можно улучшить.

👉 Читать статью