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

10 CSS-однострочников для преобразования веб-приложения #почитать CSS позволяет создавать красивые и отзывчивые веб-дизайны. Однако написание кода CSS может отнимать много времени и сил, особенно если вы не знакомы с новейшими методиками и лучшими практиками. К счастью, есть несколько однострочников, помогающих оптимизировать CSS-код и создавать более эффективные проекты. 1. Центрирование div 2. Создание свободно перемещающихся элементов 3. Позиционирование элементов в любом месте DOM 4. Универсальное свойство box-sizing 5. Адаптивные изображения 6. Центрирование элементов 7. Создание пользовательских стилей флажков 8. Выравнивание текста 9. Очистка float-элементов 10. Сброс всех стилей ⏱Читать статью

Изменить цвета и кнопки сервиса — и не сломать дизайн-систему #почитать

В прошлом году нам понадобилось полностью изменить внешний вид нашего сервиса. Разработчики и дизайнеры интерфейсов часто сталкиваются с подобными задачами: есть уже работающий сервис, но его нужно стилизовать, например, в случае ребрендинга.

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

Почему AVIF вместо JPEG, WebP, PNG и GIF #почитать

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

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

"Заявляю: Мы, как цивилизация, разучились использовать центрирование" #почитать

Плохое выравнивание может испортить прекрасный интерфейс. И напротив, с правильно выровненным текстом ваш интерфейс обретёт утончённую красоту. Даже если это трудно. Даже если инструменты создают неудобства. Даже если приходится искать решения. Я верю, что вместе мы можем разобраться, как засунуть один прямоугольник в другой ровно.

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

Анимация в веб-интерфейсе, влияние на UX #почитать

Любое движение в визуале триггерит пользователей лучше. По данным, Engagement Rate у видео и анимаций в 2 раза выше, в сравнении со статикой.

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

😙

CSS in Depth Автор: Keith J. Grant Год: 2018 ⏱Обзор ⏱Скачать книгу

Архитектура Inverted Triangle CSS (ITCSS) #почитать ▪️Settings (Настройки): Основополагающий слой, включающий конфигурацию, переменные и глобальные настройки. Он задаёт основу для всей таблицы стилей. ▪️Tools (Инструменты): Этот слой включает миксины, функции и другие инструменты, используемые в проекте. Он предоставляет разработчикам набор инструментов для эффективного управления и расширения стилей. Generic (Общий): на этом слое применяются сброс стилей и normalize.css, создавая единую базу для стилей в разных браузерах. ▪️Elements (Элементы): Далее идёт базовая стилизация элементов HTML. Это неклассифицированные селекторы, определяющие базовые стили для стандартных HTML-тегов. ▪️Objects (Объекты): Этот слой определяет многократно используемые шаблоны дизайна и структуры макета. Он сосредоточен на создании объектов, содержащих специфическое поведение стилей, что способствует модульности и возможности повторного использования. ▪️Components (Компоненты): На этом слое выполняется стилизация конкретных компонентов пользовательского интерфейса. Этот слой реализует большую часть стилизации приложения, обеспечивая чёткое разделение задач. ▪️Trumps (Козыри): Вершина перевёрнутого треугольника, слой Trumps, имеет дело с утилитарными классами и переопределением стилей. Он позволяет вносить специфические изменения и тонкие настройки, не нарушая целостности нижних слоёв. ⏱Читать статью

Яндекс приглашает студентов и начинающих разработчиков на Young Con — фестиваль для тех, кто интересуется карьерой в IT • 6000 участников • Свыше 10 часов нетворкинга и активностей • 30 топ-менеджеров расскажут о внутренней кухне больших IT-компаний и дадут советы, как начать карьеру в одной из команд • Знакомство с технологиями Яндекса • 9 тематических «миров» — интерактивных стендов, где участники смогут узнать про сервисы и карьерные возможности, которые дает работа в IT-компании. У участников будет возможность в будущем попасть на стажировку в Яндекс, ведь прямо на фестивале пройдут экспресс-собеседования. На фестивале также пройдет «Баттл вузов» — финал турнира по спортивному программированию между студентами. Команда-победитель разделит между собой призовой фонд в размере 1 млн рублей. Завершится мероприятие концертом музыкальных групп The Hatters и ХЛЕБ. Фестиваль пройдет 27 июня в Live Arena. Принять участие в нем можно очно или онлайн — для этого необходимо заполнить форму на сайте.

Инь-Ян в UI/UX дизайне #почитать

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

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