Верстальщик от бога

Слайдер с бесконечной плавной прокруткой на JavaScript #почитать В этой статье разберем компонент, представляющий собой бесконечный плавный слайдер с автоматической прокруткой, а также добавим его замедление при наведении. Похожие блоки часто используются для информационной ленты логотипов, фотогалерии и других подобных визуальных компонентов. ⏱Читать статью

There’s no such thing as a CSS reset #почитать CSS resets are a technique nearly as long lived as the modern CSS era itself, stretching all the way from the CSS Zen Garden days to inclusion in mass-market current-day tools like Tailwind. Resets are a staple in the CSS toolkit. But here’s the thing; there’s no such thing as a CSS reset. Now, to be clear, I’m not suggesting some kind of long-running mass hallucination. I’m suggesting CSS resets don’t do what the name says. The word “reset” implies an objective default state that you’re restoring to, but the only objective default state is what browsers ship. You cannot “reset” browser styles by addition. Resets are inherently subjective, which means in practice, you are not so much resetting as you are defining default element styles for a website. ⏱Читать статью

Разработка с учетом паттернов WAI ARIA #почитать Сегодня веб-приложения стали сложными интерактивными системами, напоминающими полноценные десктоп приложения. Однако за красивыми интерфейсами и богатым функционалом часто скрывается важный аспект, которому уделяется недостаточно внимания — доступность (accessibility). Для миллионов пользователей с ограниченными возможностями это означает, что они не могут полноценно взаимодействовать с сайтом, выполнить базовые действия или получить информацию. Проблема особенно ярко выражена в современных одностраничных приложениях (SPA), кастомных компонентах, модальных окнах и прочих динамических UI-решениях, которые не учитывают, как с ними будут работать вспомогательные технологии. ⏱Читать статью

Хочешь разбираться в Project Management? Для тебя уже всё сделали. 📌 Канал @projectmanager_it делится полезными секретами и лайфхаками управления проектами и продуктами в IT. Подписывайтесь и прокачивайте свои навыки: @projectmanager_it

Docs as Code и его использование на проектах #почитать Раскрываем Docs as Code: как этот подход меняет создание документации, какие инструменты стоит изучить в первую очередь, и с чего начать внедрение. ⏱Читать статью

Введение в WebRTC #почитать WebRTC - это технология, которая позволяет браузерам и мобильным приложениям обмениваться аудио и видео в реальном времени без необходимости использования промежуточных серверов. Это делает WebRTC идеальным выбором для приложений, которым необходим функционал видеозвонков, стриминга, и аудиовызовов. ⏱Читать статью

Пятничное. Вебмастеры и реликтовый веб #почитать

"Ты помнишь, как все начиналось, Все было впервые и вновь..." Перевернем подзорную трубу и взглянем на маленький интернет конца 1990-х - начала 2000-х годов, где не было регуляторов, не было слежки, не было мошенников, а все ограничения были только техническими.

⏱Читать статью

CSS :has() — проверка наличия потомков или соседних элементов #почитать Представьте селектор, который выбирает элемент не по его собственным классам, а по тому, что происходит внутри него или рядом с ним. Так работает псевдокласс :has(): он позволяет применить стили к родителю (или соседу), если в нужном контексте нашёлся подходящий элемент. В результате — меньше вспомогательных классов, меньше JavaScript для «протаскивания» состояний наверх, и чище разметка. ⏱Читать статью

Лигатуры в CSS: как сделать текст аккуратнее #почитать Если вы когда-нибудь присматривались к сочетаниям букв вроде «fi» или «fl» в хороших шрифтах, то, возможно, замечали, что они выглядят чуть иначе, чем при простом наборе. Буквы как будто «срастаются» в один знак, чтобы хвостики и точки не мешали друг другу. Это и есть лигатуры — особые глифы, которые шрифтовые дизайнеры создают для улучшения читаемости и эстетики текста. В вебе ими управляет свойство font-variant-ligatures. Лигатуры пришли к нам из полиграфии: ещё в эпоху ручного набора наборщики заменяли конфликтующие буквы на слитные формы, чтобы набор выглядел аккуратнее. Сегодня это реализуется средствами OpenType, а браузеры, если шрифт поддерживает лигатуры, могут автоматически подставлять нужный глиф вместо пары букв. Для фронтенд-разработчика важно знать, что лигатуры меняют только вид текста, но не его содержимое в DOM. Поиск, копирование, скрин-ридеры — всё продолжает работать корректно, ведь под капотом там по-прежнему две буквы, а не одна. ⏱Читать статью

AI во фронтенде — один из самых горячих трендов в разработке Бизнес-группа Поисковых сервисов и ИИ Яндекса приглашают на Yet Another Frontend Night 29 ноября, чтобы обсудить, как AI переворачивает фронтенд-разработку. Это событие для тех, кто уже имеет опыт в этой сфере и хочет активно использовать нейросети в своих проектах. - 5 докладов от фронтенд-разработчиков Яндекса - Активности с реальными кейсами от экспертов - Дискуссии и много нетворкинга в приятной атмосфере Нет времени думать! Скорее регистрируйтесь, чтобы услышать топовых экспертов: - Иван Артамонов (Яндекс Бизнес) — о преимуществах AI-ассистентов и реальных примерах из своей работы. - Павел Осташкин (Международная Реклама) — как создать и встроить собственный MCP-сервер в рабочие процессы. - Валерий Баранов (Яндекс 360) — как MCP-серверы снижают "галлюцинации" и делают дизайн-систему AI-ready. - Александр Иванков (Яндекс Поиск) — опыт разработки AI-помощника и подходы промпт-инжиниринга. - Андрей Дегтярев (Яндекс Браузер) — детальный разбор агентских сценариев и их практического применения. Встречаемся только офлайн 29 ноября в 15:00 в московском офисе Яндекса на Льва Толстого. Не пропустите, посмотреть записи в этот раз не получится! Регистрация и подробная программа