Size: a a a

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

2017 June 21
For Web — фронтенд, дизайн, программирование
Иллюзия скорости: как увеличить отзывчивость интерфейса с помощью UX-приёмов вместо оптимизации производительности — https://paulbakaus.com/tutorials/performance/the-illusion-of-speed/
источник
For Web — фронтенд, дизайн, программирование
источник
For Web — фронтенд, дизайн, программирование
Браузерные войны: как победил веб, вторая часть истории в переводе Дмитрия Мананникова — https://medium.com/@slonoed/92168ce17ae5
источник
For Web — фронтенд, дизайн, программирование
Нейросети с нуля для JS-разработчиков, первая часть руководства в переводе devSchacht — https://medium.com/devschacht/30c64ee9dbba
источник
For Web — фронтенд, дизайн, программирование
Как сделать доступное модальное окно? Рассказывает Роб Додсон в свежем выпуске A11ycasts — https://youtu.be/JS68faEUduk
источник
For Web — фронтенд, дизайн, программирование
БЭМ на примерах: зачем нужна эта методология и как начинающим избежать распространённых ошибок — https://seesparkbox.com/foundry/bem_by_example
источник
2017 June 22
For Web — фронтенд, дизайн, программирование
Кому нужны флексы, если на них не делают сайты? Разбирается Вадим Макеев в свежем выпуске «HTML-шортов» — https://youtu.be/Wpglfz7aXzo
источник
For Web — фронтенд, дизайн, программирование
До 70% наших стилей состоит из повторений: результаты исследования Йенса Майерта и выводы — https://meiert.com/en/blog/20170531/70-percent-css-repetition/
источник
For Web — фронтенд, дизайн, программирование
Можно ли написать сайт в Excel? Энтузиаст Воган Мэй рассказал о воплощении этой безумной идеи, перевод от @tproger_officialhttps://goo.gl/YdLjw4
источник
For Web — фронтенд, дизайн, программирование
Что за штуковины постоянно пишут в самом верху SVG? Питер Новелл разобрался и делится шпаргалкой — https://medium.com/@pnowelldesign/f3ad198eb54e
источник
For Web — фронтенд, дизайн, программирование
Pa11y, набор инструментов для автоматизированного тестирования доступности — http://pa11y.org/
источник
For Web — фронтенд, дизайн, программирование
Старый добрый аналог Excel в 25 строк кода, переписанный на ES 2015 — http://jsfiddle.net/ondras/o3tzx1px/
источник
For Web — фронтенд, дизайн, программирование
источник
For Web — фронтенд, дизайн, программирование
[tl;dr]
Что за атрибут inert и зачем он нужен?

Как можно догадаться из названия, этот атрибут помечает элемент как инертный (или неактивный, но не путайте с disabled). Для таких элементов (и всего дерева их потомков) отключается срабатывание пользовательских событий (например, фокус по нажатию tab, выделение текста, клики). Ассистивные технологии вроде экранных читалок просто игнорируют такие элементы. Также спецификация рекомендует разработчикам браузеров игнорировать инертные элементы при поиске по содержимому страницы.

По сути, этот атрибут сочетает в себе поведение tabindex="-1", aria-hidden и pointer-events: none. Им следует помечать скрытые модальные окна, выпадающие меню, невидимые слайды карусели и другие подобные элементы интерфейса. Это улучшит доступность ваших интерфейсов: при навигации с клавиатуры или при использовании экранных читалок инертные элементы просто будут игнорироваться.

Полезные ссылки:
— inert в спецификации whatwg (https://vk.cc/6NwDJF);
— история появления, способы применения, описание пробелов в спецификации и полифил (https://github.com/wicg/inert);
— выпуск A11ycasts с Робом Додсоном, посвящённый атрибуту inert (https://youtu.be/fGLp_gfMMGU).
источник
2017 June 23
For Web — фронтенд, дизайн, программирование
Как делался фронтенд Stripe Connect: CSS-гриды, 3D-анимации, графика на CSS и другие подробности — https://stripe.com/blog/connect-front-end-experience
источник
For Web — фронтенд, дизайн, программирование
Иван Акулов подробно рассказал, как он починил неработающий тришейкинг в библиотеке polished — https://iamakulov.com/notes/polished-webpack/
источник
For Web — фронтенд, дизайн, программирование
Александр Сурма и Пол Льюис из Google лайвкодят с нуля кодсплиттинг для приложения — https://youtu.be/4KVeNoN1aFM
источник
For Web — фронтенд, дизайн, программирование
Большая подборка полезных материалов по вёрстке писем от Артура Коха (https://t.me/emaildev) — https://medium.com/p/db73753f368e
источник
For Web — фронтенд, дизайн, программирование
Давайте выучим замыкания в JavaScript! Руководство Притти Кассириди в переводе Академии HTML — https://htmlacademy.ru/blog/195-lets-learn-javascript-closures
источник
2017 June 24
For Web — фронтенд, дизайн, программирование
Как устроен фронтенд Product Hunt, доклад Радослава Станкова на WeAreDevelopers 2017 — https://youtu.be/F38nRMktS9Q
источник