От автора: в 2012 я выучил опасное правило: mobile first подход в UX обеспечивает пользователям единообразный опыт на всех устройствах. После четырех лет повторения этой мантры вместе с UX дизайнерами в одни воскресный день я понял, что это в прошлом. В догматическом распространении адаптивности и кроссбраузерной совместимости (процесс проектирования требует этого) что-то потерялось. По иронии судьбы я листал журнал выпускников ...

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

От автора: в Filament Group мы рекомендуем использовать подход критического CSS во многих наших проектах. Часто эти проекты используют для доставки CDN, и нам нужно обрабатывать каждую конкретную реализацию немного по-другому, чтобы задействовать различные CDN и их функции. В этой статье мы подробно рассмотрим эту проблему и предоставим руководство, как делается оптимизация CSS для нескольких CDN. Обзор Критический CSS — ...

От автора: в семействе встроенного в Firefox Developer Tools пополнение. Инспектор доступности позволяет проверять сайт на работу с вспомогательными технологиями. Введение Как веб-разработчик, вы когда-нибудь думали, как ваш сайт выглядит на скрин ридерах для слепых? Вы не думали, почему получаете сообщения о том, что люди с ограниченными возможностями не могут пользоваться вашим веб-приложением? Или как слепой пользователь, была ли у ...

От автора: рады сообщить, что Safari 11.1 на macOS и Safari на iOS 11.3 теперь поддерживают W3C Payment Request API для проведения транзакций Apple Pay в интернете. Впервые мы представили Apple Pay on the Web на macOS Sierra и iOS 10. Apple Pay сделал онлайн транзакции простыми в использовании, защищенными и конфиденциальными. Мы были рады увидеть, как массово ее стали ...

От автора: я видел, как много людей слепо используют современные JavaScript фреймворки React, Angular и Vue.js. В этих фреймворках много интересных вещей, но люди обычно упускают главную причину их существования. Эта причина не связана с: Они основаны на компонентах У них сильное сообщество У них много сторонних библиотек для работы У них есть полезные сторонние компоненты У них есть расширения ...

От автора: раньше иконки для сайта были такими легкими. Простой растровый favicon.ico 16х16 пикселей. Это как знак препинания в конце проекта. Для разработчика это эквивалент завершения предложения с восклицательным знаком или точкой. Так было раньше. Но за прошедшие 20 лет все изменилось. Что такое favicon? Favicon – это маленький значок, помогающий идентифицировать страницу. Это часто забываемая концепция бренда для сайта. ...

От автора: эта статья является обновлением «Сравнения Front-End фреймворков помощью тестов производительности от Real-World» от декабря 2017 года. В этом сравнении мы покажем, чем отличаются друг от друга разные реализации практически идентичных приложений RealWorld, и как делается с их помощью тест производительности. Пример приложения RealWorld характеризуется следующим: Приложение Real World — нечто большее, чем «задача». Обычно «задачи» не предоставляют достаточно ...

От автора: Ты удивишься: «Что? GraphQL — это язык запросов на стороне сервера. Redux — это клиентская библиотека управления состояниями. Как можно использовать вместо Redux GraphQL?» Хороший вопрос. Лучше тебе сесть, потому что я собираюсь ответить на него. Переключение на React Во-первых, небольшая предыстория. Еще в 2016 году front-end команда Pathwright начала переводить клиентский код из стека Backbone & Marionette ...

От автора: некоторое время назад, при создании большого количества приложений front-end после каждого внесённого изменения браузер необходимо было перезагружать. В то время это не казалось проблемой. Как говорится, необходимость — мать изобретений. Но как насчет того, чтобы нам не было нужно вручную перезагружать браузер, когда мы вносим изменения в наши приложения? Для этого нужно знать, как пользоваться webpack!!!! webpack — ...