For Web — фронтенд, дизайн, программирование. Страница 13

Если есть input, он должен быть обёрнут в форму: напоминание о распространённой ошибке, вредящей UX → https://tomekdev.com/posts/input-and-form

How to Design System: исчерпывающее руководство по созданию дизайн-систем, основанное на реальном опыте. Когда нужна дизайн-система, как продать её бизнесу, как её сделать, как измерить её полезность и многое другое → http://how-to-design-system.com

Интерактивное руководство по CSS-переходам и hover-анимациям: Джош Камю обо всех аспектах применения CSS-свойства transition, от основ до приёмов улучшения UX → https://www.joshwcomeau.com/animation/css-transitions/

Лайфхак дня: чтобы открыть любой публичный GitHub-репозиторий в VS Code прямо в браузере, добавьте 1s после github в адресной строке → https://github.com/conwnet/github1s

[Реклама]
Ключ к продажам и лояльности пользователей — в удобном и красивом интерфейсе. Ключ к такому интерфейсу — в UX-дизайне.

На открытом занятии Нетологии поговорим, как UX-исследования помогают дизайнерам лучше понимать пользователя. Эксперты digital-агентства AGIMA поделятся своим опытом и расскажут, как улучшить любую страницу при помощи UX-аналитики и дизайна.

Узнайте, как строится взаимодействие пользователя с интерфейсом, чтобы быстро и эффективно проектировать удобные интерфейсы → https://netolo.gy/gdl

Mock Service Worker, инструмент для честной подмены ответов на запросы к REST или GraphQL API, не требующий бэкенда и работающий на уровне сети через сервис-воркер → https://mswjs.io

Управление z-index в больших проектах: Стивен Фрисон предлагает подход к систематизации визуальных слоёв приложения → https://www.smashingmagazine.com/2021/02/css-z-index-large-projects/

JS minification benchmarks: обширное сравнение скорости и эффективности минификаторов JavaScript на примере популярных фронтенд-библиотек → https://github.com/privatenumber/minification-benchmarks

Объяснение принципов SOLID на примере реальных фронтенд-задач в пяти коротких видео → https://www.youtube.com/playlist?list=PLz_dGYmQRrr8rWKkoB3BtxF7JpCzUKny_

Как инженеры BBC News перешли с монолита на PHP на изоморфное SPA на React и значительно улучшили быстродействие → https://medium.com/bbc-design-engineering/26b08f7abfcc

Не используйте функции как колбеки, если они для этого не предназначены: Джейк Арчибальд предупреждает о неожиданных проблемах, с которыми вы можете столкнуться → https://jakearchibald.com/2021/function-callback-risks/

Синхронизируем вкладки браузера: Джейк Арчибальд и Александр Сурма обсуждают способы синхронизации данных между вкладками браузера и потенциальные проблемы → https://youtu.be/9UNwHmagedE

В чём разница между узлом и элементом DOM? Объяснение Дмитрия Павлютина → https://habr.com/p/539096/

Альтернативы спиннерам в вебе: Саймон Хёрн рассказывает, как улучшить UX ожидания → https://simonhearne.com/2020/alternatives-to-spinners/

Как ускоряли новую главную страницу GitHub: обзор применённых оптимизаций графики и анимаций → https://github.blog/2021-01-29-making-githubs-new-homepage-fast-and-performant/

Строим систему для мониторинга качества фронтенд-проектов: опыт инженеров ДомКлик → https://habr.com/p/539086/

Больше никаких хаков с padding-bottom: 100%. Новое CSS-свойство aspect-ratio скоро заработает во всех основных браузерах → https://web.dev/aspect-ratio/

Как избежать сдвигов раскладки из-за веб-шрифтов: исчерпывающее руководство Саймона Хёрна → https://simonhearne.com/2021/layout-shifts-webfonts