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 #8570 · Back to latest

Older Posts 17 shown
Post #8569 939
Самый крупный текст на макете — это всегда <h1> страницы?

Часто — нет.

Возьмём страницу магазина мороженого «Глейси». Крупное «Нежный пломбир с клубничным джемом» — это заголовок одного из слайдов: на следующем слайде стоит другой текст. Заголовок первого уровня для всего документа — «Магазин натурального мороженого Глейси». На макете этого заголовка нет: разработчик добавляет его в HTML отдельно, скрытым через класс visually-hidden.


Заголовок в HTML — это резюме содержимого блока. Крупный текст без такой функции лучше размечать как обычный абзац, а заголовок к блоку добавлять отдельно — скрытым через тот же класс. Так структуру корректно прочитают скринридеры и поисковые системы, а макет визуально не пострадает.

В статье — как разбирать макет на заголовки и когда нужны скрытые <h2>. И отдельно — про инструмент проверки иерархии заголовков в валидаторе W3C. #html #webdev

Читать статью
  • ⚡ 2
  • 🔥 2
Post #8568 886
Спросили у нейросети, как работает useEffect. Помогло. Через месяц на интервью просят объяснить — рассказать своими словами не получается.

Готовый ответ создаёт иллюзию понимания. Знания закрепляются, когда задача упирается и вы долго разбираетесь сами. Психологи называют это «желательными трудностями» — их обходят, когда отдают учёбу нейросети, и платят позже: на ревью, на интервью, в чужой кодовой базе.

В статье — обзор задач, где ИИ лучше отложить. Самая очевидная категория — обучение чему-то новому: готовые ответы убивают сами «желательные трудности». Сложные анимации лучше делать руками, пока не чувствуете тайминг и физику движения. Низкоуровневая оптимизация требует читать профайлер, которого нейросеть не видит. Архитектурные решения зависят от контекста команды и проекта. И отдельная история — код, влияющий на пользователей: тёмные паттерны в интерфейсах, аналитика, которая собирает больше нужного, и алгоритмы ранжирования. Это этический выбор разработчика, и промпт его не закроет.

Простой тест перед делегированием: если ИИ напишет код, а вы его не прочитаете — это станет проблемой? #ai #webdev

Читать статью
  • 👍 5
  • ❤‍🔥 4
  • 🔥 2
  • ❤ 1
Post #8567 831
🍀 На Кексодаче готовятся к майским.

Кекс приехал к воротам, проверил петли, починил колесо у входа — оно у нас собрано из обода старого велосипеда и подшипника от «Малютки». Грядки за зиму подзаросли, лягушки уже расселись на лилиях точно через space-between.

Первого мая ворота открываются. Каждый, кто заходит, по традиции крутит колесо и забирает корзинку с урожаем — внутри скидка до 50% на любой курс Академии.

➡️ Зайдите на htmlacademy.ru 1 мая, крутаните колесо у ворот и заберите свою скидку. Открытие сезона до 3 мая.
  • ❤‍🔥 2
  • ❤ 1
  • 👍 1
Post #8566 925
HTML Academy Финишная прямая! Третий сезон Чемпионата по вёрстке завершён. 29 апреля в 12:00 (MSK) вместе с экспертами из компаний подведём результаты, озвучим оценки и объявим победителя. 🐭 Подключиться в YT 🐹 Подключиться в VK Video
Через час эфир. Подведём итоги чемпионата по вёрстке 3: разберём проекты участников вместе с экспертами из бигтех-компаний, которые их проверяли, и объявим победителя сезона.

Подключайтесь в YouTube или в VK Video.
  • ❤‍🔥 1
  • ⚡ 1
  • 👍 1
Post #8565 1.11K
Утро, открываете тикет, кидаете задачу в нейронку: «Напиши компонент карточки товара». Через минуту в редакторе компонент. Классы выдуманные, поля называются как-то по-своему, а эффект при наведении вообще никто не просил.

Знакомо? Дальше — час правок.

Чаще всего проблема в самом запросе. В нём нет типа данных с сервера и списка классов из дизайн-системы — поэтому нейросеть достраивает всё сама. По общим примерам, без оглядки на ваш проект.

В статье — шаблоны запросов на новый компонент и на тесты к нему. Отдельный приём для правки существующих стилей: эффективнее попросить «измени только эту функцию», чем «перепиши файл». А ещё пять приёмов из практики, главный из которых — показать нейросети соседний компонент из проекта вместо описания на словах. #ai #webdev

🔥 Читать статью
  • 👍 7
  • 🔥 4
  • ❤ 3
Post #8564 953
HTML Academy Mish — студия №1 по UX сайтов в Рейтинге Рунета. В третьем сезоне Чемпионата по вёрстке участники верстают их макет. В этом сезоне мы запускаем профессиональный трек для действующих разработчиков. Это способ прокачать цифровой профессиональный след и упростить…
Финишная прямая!

Третий сезон Чемпионата по вёрстке завершён. 29 апреля в 12:00 (MSK) вместе с экспертами из компаний подведём результаты, озвучим оценки и объявим победителя.

🐭 Подключиться в YT
🐹 Подключиться в VK Video
  • ❤‍🔥 4
  • 🔥 2
Post #8563 1.18K
HTML Academy MediaMint — веб-студия, с 2014 года разрабатывает и продвигает сайты для бизнеса из разных отраслей. Делает современные, удобные и функциональные проекты, помогает компаниям эффективнее работать онлайн. В четверг 23 апреля в 12:00 (MSK) генеральный директор…
«Я постою над тобой и не дай бог шаг вправо, шаг влево» — CEO про джуна пять лет назад

Максим Заруцкий из MediaMint это помнит и не скрывает: пять лет назад он бы сказал джуну — полгода в офисе, надо посидеть, познакомиться. Сегодня берёт новичка на удалёнку с первого дня. В эфире объяснил, что изменилось: CRM и метрики показывают, кто как работает, без физического присутствия — и один из верстальщиков за полтора месяца дорос до фулстека и забрал проект целиком.

Если вы джун и боитесь, что вас возьмут только «обратно в офис под присмотр» — послушайте разговор. И посмотрите программу, по которой попадают в команду MediaMint.

🎁 Программа
🐭 Смотреть в YT
🐹 Смотреть в VK
  • 🔥 4
  • ❤‍🔥 2
  • 👍 2
Post #8560 950

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

«Мастер анимаций: CSS и JavaScript-анимации»

Курс учит анимировать карточки товаров, меню, модалки, слайдеры и аккордеоны — плавно и без фризов на слабых устройствах.

72 примера. Движемся от переходов по ховеру до 3D-трансформаций и параллакса со скроллом. Параллельно — отладка: в DevTools ловим просадки по кадрам и оптимизируем рендеринг. Отдельно — prefers-reduced-motion для пользователей, которым движения мешают.

Порядок обучения — от простого к сложному: transition, затем @keyframes и animation, а на финише — JavaScript для интерактивных сценариев. #htmlacademy #levelup

🎁 Смотреть программу
  • ❤‍🔥 5
  • 👍 1
Post #8559 969
Если в VS Code у вас в ходу одни и те же пять-шесть горячих клавиш — в редакторе есть ещё десятки. Вот четыре, с которых стоит начать:

- F2 переименует переменную сразу во всех местах.
- F12 откроет файл с её объявлением — даже если оно в другом модуле.
- Ctrl + G поможет попасть к строке по номеру.
- Alt со стрелками поменяет строки местами.

Ещё шесть — в статье. #vscode #tools

👾 Читать статью
  • 👍 15
  • ❤‍🔥 4
Post #8558 952
Фронтенд — ваше или не ваше? Проверьте за две недели

28 апреля стартует группа по программе «Фронтенд-разработчик для компании Зионек». На этот набор мы даём две недели пробного периода — чтобы вы проверили профессию на практике, ничем не рискуя.

Как это работает? Бронируете место за 15 000 ₽ и учитесь как все. За две недели успеете сделать первые задачи и поработать с наставником. Этого хватит, чтобы понять — ваше это или не ваше.

💡 Если подошло — продолжаете программу. Впереди месяцы обучения и проекты в портфолио, а на выходе — возможность поработать в компании Зионек.

📎 Если нет — ваши 15 000 ₽ не сгорают. Переведём вас на программу «Верстальщик»: курсы по фундаментальной вёрстке и адаптивной вёрстке, наставник в общем чате.

Записаться в Телеграме
Записаться через MAX
  • 🔥 4
  • ❤‍🔥 3
  • ❤ 3
  • 🤣 2
Post #8557 971
HTML Academy MediaMint — веб-студия, с 2014 года разрабатывает и продвигает сайты для бизнеса из разных отраслей. Делает современные, удобные и функциональные проекты, помогает компаниям эффективнее работать онлайн. В четверг 23 апреля в 12:00 (MSK) генеральный директор…
Вместе с MediaMint запускаем совместную программу обучения фронтенд-разработчиков

Сегодня в 12:00 (MSK) — прямой эфир с CEO. Компания работает с 2014 года, за это время — больше 270 проектов в самых разных отраслях. Внутри команды верстальщиков растят до фулстеков на реальных задачах, с наставниками. На эфире расскажут, зачем им новички с программы обучения и какой путь ждёт выпускников.

Успеть в первую сотню регистраций — последний шанс попасть в розыгрыш бесплатного места на программе. Результат объявим в прямом эфире.

https://htmlacademy.ru/events/live-mediamint
  • ❤ 5
  • 🔥 3
  • ❤‍🔥 2
Post #8556 924
Алгоритмы абстрактны, их сложно представить в голове. Поэтому сортировку пузырьком и вставками удобнее посмотреть, чем изучать по тексту.

В клипе — анимация обоих алгоритмов на одних и тех же данных. Сразу видно, как каждый перебирает массив и чем они отличаются по ходу работы.

В интерактивных демках из курса можно задать свой массив и прогнать алгоритм заново:

Сортировка вставками — https://htmlacademy.ru/demos/187
Сортировка пузырьком — https://htmlacademy.ru/demos/181
  • 🔥 6
  • ❤‍🔥 3
  • ❤ 2
Post #8555 915
HTML Academy MediaMint — веб-студия, с 2014 года разрабатывает и продвигает сайты для бизнеса из разных отраслей. Делает современные, удобные и функциональные проекты, помогает компаниям эффективнее работать онлайн. В четверг 23 апреля в 12:00 (MSK) генеральный директор…
Завтра — эфир с CEO. Главные вопросы о нейросетях в работе джуна

23 апреля в 12:00 (MSK) — один час, чтобы успеть спросить главное у CEO компании, которая год работает с ИИ-агентами в повседневной разработке.

Что спросим:

❤️ Джун и ИИ-агент: ускоряет рост или подменяет его
❤️ Какой вопрос на собеседовании показывает: разобрался сам или ответил через агента
❤️ В каких задачах ИИ ускоряет команду прямо сейчас, а в каких всё портит

В нашу программу обучения уже включён курс «Фронтенд на автопилоте: AI-агенты на практике» — научитесь работать с агентами, разбирать их ошибки и встраивать в рабочий процесс.

🎁 Бонус: место на программе обучения разыграем среди первых 100 регистраций. Результат — на эфире.

https://htmlacademy.ru/events/live-mediamint
  • ❤ 8
  • ❤‍🔥 2
  • 🔥 2
Post #8554 943
Какой цвет фона в .selector { background-color: 20px; background-color: red; }?

А если первое значение — var(--not-a-color), и переменная содержит те же 20px? Результат будет другим.

Каскад — один из четырёх этапов обработки значений в CSS. Сначала браузер фильтрует объявления и отбрасывает невалидные, потом через каскад для каждого свойства выбирает одно значение. Если какого-то не хватает — берёт унаследованное или начальное. Дальше три стадии вычислений: вычисленные, используемые и действительные.

Разбираем весь путь CSS-значения: от объявления в файле до значения, с которым браузер отрисовывает элемент. Со схемами, примерами и тестом для самопроверки. #css

🔴 Читать статью
  • ❤ 4
  • ❤‍🔥 3
  • 🔥 2
Post #8553 1.04K
MediaMint — веб-студия, с 2014 года разрабатывает и продвигает сайты для бизнеса из разных отраслей. Делает современные, удобные и функциональные проекты, помогает компаниям эффективнее работать онлайн.

В четверг 23 апреля в 12:00 (MSK) генеральный директор компании расскажет о совместной программе обучения: как устроена работа в небольшой веб-студии из топ-100 по 1С-Битрикс и почему здесь разработчики растут от вёрстки до фулстека, работая с AI-инструментами.

Бонус: первые 100 зарегистрировавшихся попадают в розыгрыш бесплатного места на программу. Итоги — в конце эфира.

https://htmlacademy.ru/events/live-mediamint
  • ❤‍🔥 3
  • 🔥 3
  • ❤ 2
Post #8552 1.4K
HTML Academy «Мидлы без ИИ скоро будут грустить» — что ещё прозвучало на эфире с Зионеком Час разговора с техническим директором — про ИИ в разработке, стек и путь от обучения до штата. Несколько моментов, ради которых стоит включить запись: ❤️ Почему техдир раздал Cursor…
«Больше работаешь — больше зарабатываешь»


Михаил Иванычев, технический директор Zionec, рассказал, какая зарплата ждёт выпускников совместной программы обучения фронтенду. Ответ — в клипе.

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

🎁 Программа обучения
  • 🤣 8
  • 👍 3
  • ❤‍🔥 2
  • 🔥 1
Post #8549 1K

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

Вы когда-нибудь настраивали Content-Security-Policy для рабочего проекта? Тема, которую фронтенд-разработчики откладывают — пока в баг-трекере не появится репорт про XSS.

Курс «Протоколы и сети: веб-безопасность» — шесть разделов по конкретным группам уязвимостей. XSS, CSRF, SQL-инъекции, DoS, MitM — каждую разбираете на кейсе, пишете защиту и сверяете с эталонным решением. Отдельные практики: настройка CSP, безопасная работа с cookie, хеширование паролей с солью, корректный CORS.

На выходе — чек-листы безопасности по каждому разделу. Готовый артефакт для проекта. #htmlacademy #levelup

☝️ Смотреть программу
  • ❤‍🔥 4
  • 🔥 3
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 →