TGViewer
Channel Public Channel
HTML Academy

HTML Academy

@htmlacademy

Курсы по веб-разработке: вёрстка, программирование, работа и комьюнити.
Наш секретный бот @HTMLAcademyKeksobot.

Вопросы по обучению @htmlacademy_sales

Ролики на YT https://www.youtube.com/@HTMLAcademyTV
Ролики на VK https://vkvideo.ru/@htmlacademy
Open in Telegram
Subscribers
9.55K
Photos
5.6K
Videos
190
Links
3.5K

Showing posts older than #8549 · Back to latest

Older Posts 13 shown
Post #8548 1.17K
Анимация по кривой раньше требовала JavaScript: getPointAtLength(), requestAnimationFrame, ручной пересчёт координат. Десятки строк кода.

offset-path решает задачу средствами CSS. Задаёте путь через path(), запускаете offset-distance от 0% до 100% — элемент движется по кривой, окружности или произвольной траектории. Как управлять поворотом? Для этого есть offset-rotate.

В статье показываем разные варианты путей и объясняем, где offset-path пригодится в интерфейсах. #css

✨ Читать статью
  • ❤‍🔥 4
  • 🔥 4
Post #8547 1.19K
CSS-свойство backdrop-filter применяет фильтры к фону за элементом — размытие, контраст, яркость. С сентября 2024 в Baseline WidelyNewly Available. Работает везде.

Одно условие: у элемента должен быть полупрозрачный фон. Без rgba или hsla эффект применится, но визуально вы ничего не увидите.

Где это применять? Модальные окна, карточки с эффектом матового стекла, сайдбары с глубиной. В статье разбираем, как собрать эффект и какие фильтры комбинировать. #css #baseline

⚡ Читать статью
  • ❤‍🔥 5
  • ❤ 4
  • 🔥 3
Post #8546 1.25K
Встроенные стили побеждают любой селектор в каскаде. Переопределить их из внешних стилей — задача нетривиальная: чаще всего приходится тянуться за !important. А псевдоклассы, псевдоэлементы и медиавыражения в атрибуте style вообще не работают — :hover, ::before, @media мимо.

Зачем тогда их использовать? В вёрстке рассылок другого выхода нет — почтовые клиенты блокируют внешние стили. Ещё атрибут style удобен при отладке и в CMS, где стили задаются через интерфейс.

Разбираем приоритет, ограничения и случаи, когда встроенные стили оправданы. #css #html

💡 Читать статью
  • ❤ 4
  • ❤‍🔥 3
  • 🔥 2
Post #8545 1.3K
Совместно с Зионек мы запускаем программу «Фронтенд-разработчик» , открываем запись на программу в соответствии с планом найма, а после обучения компания нанимает выпускников.

HTML Academy предлагает 4 гранта на обучение от компании. Это — последняя возможность зайти в этот поток и гарантировать себе место в штате.

Напишите «ГРАНТ» и начните свою карьеру уже сейчас.

Записаться в Телеграме
Записаться через MAX
  • 🔥 3
  • ❤ 2
  • ❤‍🔥 2
Post #8544 1.19K
HTML Academy «Мидлы без ИИ скоро будут грустить» — что ещё прозвучало на эфире с Зионеком Час разговора с техническим директором — про ИИ в разработке, стек и путь от обучения до штата. Несколько моментов, ради которых стоит включить запись: ❤️ Почему техдир раздал Cursor…
«Мы посмотрели результаты чемпионатов по вёрстке и восхитились» — Михаил Иванычев, технический директор Zionec.

После этого компания запустила совместную с Академией программу обучения фронтенду. Что увидели в чемпионатах и зачем готовить разработчиков именно так — в клипе из подкаста.

Полный эфир: Смотреть на YouTube | Смотреть в VK

🎁 Программа обучения
  • ❤‍🔥 4
  • 👍 3
  • 🔥 3
Post #8541 930

Forwarded from Как стать мидлом

Конфиги webpack часто копируют из проекта в проект, а когда что-то ломается — гуглят каждую строку отдельно. Знакомо?

На курсе разбираемся, как устроена сборка изнутри: от entry и output до разделения кода и оптимизации под рабочее окружение. Настраиваете Babel и ESLint, подключаете обработчики и плагины, учитесь разделять окружения и уменьшать размер итоговой сборки.

После курса — сможете собирать и поддерживать конфигурации webpack самостоятельно. #htmlacademy #levelup

🔜 Подробнее
  • ⚡ 1
  • ❤‍🔥 1
Post #8538 1.26K
HTML Academy Mish — студия №1 по UX сайтов в Рейтинге Рунета. В третьем сезоне Чемпионата по вёрстке участники верстают их макет. В этом сезоне мы запускаем профессиональный трек для действующих разработчиков. Это способ прокачать цифровой профессиональный след и упростить…
Завершаем знакомство с партнёрами-работодателями третьего сезона чемпионата по вёрстке.

«5 углов» — интегратор Битрикс24, входит в топ-20 интеграторов России.

ОФЭП — агентство интернет-маркетинга. Разрабатывает сайты, занимается SEO, продвижением на маркетплейсах и PR.

Coding Team — разработка сайтов, мобильных приложений и AI-решений. Больше 200 реализованных проектов.

Всего за результатами третьего сезона следят больше 30 компаний. До конца активной части чемпионата осталось несколько дней.

👍 Профессиональный трек
  • ❤‍🔥 2
  • 🔥 1
Post #8537 1.27K
Рекрутёры всё реже верят резюме на слово. Слишком легко приукрасить опыт — и слишком сложно это проверить по тексту.

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

Разбираем, из чего складывается такой след и как он влияет на решение о найме.

🎁 Читать статью
  • ❤‍🔥 2
  • 🔥 1
Post #8536 1.01K

Forwarded from CSS Боль

Прощай, квадратный веб

Chrome радует скоростью релиза новых фич. Совсем недавно, в начале февраля, мы обсуждали новости про экспериментальную фичу — свойство border-shape. А спустя два месяца, 7 апреля 2026, фича уже в релизе в Chrome 147.

Напомню, чем так мил border-shape. Свойство позволяет задавать произвольную форму блока с помощью функции shape(), которая уже используется в clip-path, и с которой многие уже знакомы.

Но главное, что эту форму понимают все остальные декоративные свойства — рамки, тени, аутлайны. Эту форму видит и внутренний контент. Так что выход border-shape можно смело называть революцией.

И ещё один приятный момент. Сама функция shape() находится в интеропе 2026. А значит, что и border-shape во всех браузерах может появиться быстро.

В общем, всех поздравляю с обновкой! А я пошёл думать над интерактивным курсом по border-shape.
  • 🔥 10
  • ❤ 6
  • ❤‍🔥 1
Post #8531 1.14K
HTML Academy Mish — студия №1 по UX сайтов в Рейтинге Рунета. В третьем сезоне Чемпионата по вёрстке участники верстают их макет. В этом сезоне мы запускаем профессиональный трек для действующих разработчиков. Это способ прокачать цифровой профессиональный след и упростить…
Продолжаем знакомить с партнёрами-работодателями чемпионата по вёрстке. Сегодня — компании, которые уже давно сотрудничают с HTML Academy.

Only — агентство с фокусом на аналитику, дизайн и разработку цифровых продуктов. Среди клиентов — «Сибур», VK, «Сбер».

Bquadro — агентство полного цикла. Разработка сайтов и сервисов для недвижимости, промышленности и e-commerce.

WebRise — заказная разработка: фронтенд, бэкенд, мобильные приложения, дизайн и DevOps.

Все эти компании смотрят на результаты участников чемпионата.

👍 Профессиональный трек
  • ❤‍🔥 2
  • 👍 2
  • ❤ 1
  • 🔥 1
Post #8530 1.03K
Круговой прогресс-бар на CSS, уровень два: закруглить концы. Одно требование — и в коде появляются sin() и cos().

Показываем, как из двух градиентов и тригонометрии собрать такой прогресс-бар.

Демонстрация | Смотреть на YouTube | Смотреть в VK
  • ❤ 3
  • ❤‍🔥 1
  • 🔥 1
Post #8529 1.08K
Поповеры и диалоги выглядят одинаково — всплывающее окно поверх страницы. Путаница начинается, когда нужно выбрать между Popover API и Dialog API.

Ключевое отличие — в управлении фокусом. Popover API возвращает фокус триггеру, закрывается по клику мимо и по Escape. Dialog API с методом showModal() ловит фокус внутри окна и не отпускает, пока пользователь не примет решение. Для тултипов, меню и уведомлений — Popover API. Для модальных окон — <dialog>. #html #a11y

Разбираем, как они устроены и что учесть при выборе.

🎁 Читать статью

Резервный канал в MAX
  • ❤ 6
  • 🔥 5
  • ❤‍🔥 2
Older posts →
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →