For Web — фронтенд, дизайн, программирование
14.3K subscribers
5.47K photos
7 videos
5 files
1.74K links
Новости и полезности для фронтендеров.
Поддержать, чтобы в канале не было рекламы:
https://patreon.com/forweb
https://boosty.to/forweb
Download Telegram
CSS-размеры, зависящие от содержимого: Ахмад Шадид с обзором принципов работы и примерами использования auto, fit-content, min-content и max-content → https://ishadeed.com/article/intrinsic-sizing-in-css/
Используйте изображения подходящего размера: Виктор Жу напоминает, что изображения не должны значительно превышать размер, в котором они отображаются на странице → https://victorzhou.com/blog/properly-size-images/
Глубокое погружение в автозаполнение форм: инженеры eBay делятся опытом улучшения UX в формах адресов и банковских карт → https://tech.ebayinc.com/engineering/autofill-deep-dive/
Инженер, ориентированный на продукт: чем он полезен бизнесу, в чём его основные качества и как им стать → https://blog.pragmaticengineer.com/the-product-minded-engineer/
42: большой конспект доклада Вадима Макишвили (автора легендарного доклада «36») о том, почему и как личную эффективность нужно восстанавливать, а не повышать → https://habr.com/p/486170
Веб-компоненты и открытые стандарты: Борис Сердюк о проблемах стандартизации веб-компонентов и дискредитации веб-стандартов Гуглом → https://habr.com/p/486500/
Позиционирование в CSS: интерактивное руководство Ахмада Шадида → https://ishadeed.com/article/learn-css-positioning
Как и зачем мигрировать с mocha на jest в 14 простых шагов? Опыт Евгения Бондаренко из OneTwoTrip → https://habr.com/p/486360/
Как переписать фронтенд нагруженного проекта и не потерять главного: опыт инженеров Яндекс.Маркета → https://habr.com/p/486146/
Зачем использовать <form>, если форма отправляется через JavaScript? Чтобы не портить UX и доступность → https://gomakethings.com/why-use-a-form-element-when-submitting-fields-with-javascript/
Разрабатываем тетрис на JavaScript: пошаговое руководство с применением современных возможностей JS → https://medium.com/p/92d532bcd057
Роль анимации в UX: зачем и как стоит применять анимацию в интерфейсах → https://www.nngroup.com/articles/animation-purpose-ux/
Инженеры Wikipedia избавились от 7,8 КБ минифицированного JS, отказавшись от mustache.js в пользу обычных шаблонных строк → https://phabricator.wikimedia.org/phame/post/view/90/mustache.js_replaced_with_javascript_template_literals_in_extension_popups/
Почему стоит использовать <article>, а не <section>, и когда <section> всё-таки может пригодиться? Брюс Лоусон разбирается в нюансах семантики и доступности → https://www.smashingmagazine.com/2020/01/html5-article-section/
Раскрываем тайны браузеров: Эрик Лоуренс из команды Microsoft Edge с обзором ресурсов, которые помогут узнать, как устроены и работают браузеры → https://textslashplain.com/2020/02/09/demystifying-browsers/
Каскад в CSS, или как браузер выбирает между конкурирующими стилями: иллюстрированный интерактивный обзор Амелии Уотенберг → https://wattenberger.com/blog/css-cascade
Новый фронтенд Одноклассников: запуск React в Java.

Часть 1: исторический экскурс и особенности серверной реализации нового фронтенда → https://habr.com/p/480808

Часть 2: запуск, сборка, интеграция и специфика приложений на новом стеке → https://habr.com/p/486810
This media is not supported in your browser
VIEW IN TELEGRAM
Пошаговое руководство по созданию ripple-эффекта при нажатии на кнопки → https://blog.logrocket.com/designing-ripple-effect-ui-feedback
Эмиссия углекислого газа в вебе: Дэнни ван Кутен делится результатами оптимизации своих продуктов и призывает не оставаться в стороне → https://dannyvankooten.com/website-carbon-emissions/