[Перевод] Малоизвестные CSS-свойства

[Перевод] Малоизвестные CSS-свойства

Существует много CSS-свойств, о которых некоторые дизайнеры просто не знают. Или — знают, но забывают использовать эти свойства там, где они способны принести большую пользу. Некоторые из этих свойств могут помочь отказаться от использования JavaScript ради достижения некоего результата, некоторые позволяют экономить время за счёт написания меньших объёмов CSS-кода. Я, занимаясь фронтенд-разработкой, постоянно натыкаюсь на подобные свойства. Однажды я подумал о том, чтобы взять и

Подробнее
[Перевод] Motion Path: введение в современные анимации

[Перевод] Motion Path: введение в современные анимации

Вам никогда не хотелось создать красивую анимированную главную страницу для вашего сайта? А представить флагманский продукт в лучшем виде с помощью тщательно проработанных анимаций? А как насчет того, чтобы привлечь внимание пользователей к ссылкам меню, движущимся по замысловатой траектории? Для того чтобы выполнить подобные пожелания, актуальные для современного мира веб-разработки, CSS-модуль Motion Path Module Level 1 дает возможность использовать абсолютно новый вид анимаций и…

Подробнее
Дайджест свежих материалов из мира фронтенда за последнюю неделю №422 (29 июня — 5 июля 2020)

Дайджест свежих материалов из мира фронтенда за последнюю неделю №422 (29 июня — 5 июля 2020)

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него. Читать дальше →

Подробнее
[Перевод] Упрощаем фоновые рисунки c помощью конических градиентов

[Перевод] Упрощаем фоновые рисунки c помощью конических градиентов

Один из известных способов создания повторяющихся фоновых узоров — это применение линейных градиентов. Но если использовать с этой же целью conic-gradient(), требуется значительно меньшее количество CSS-кода. Данное преимущество конических градиентов проиллюстрировано в статье несколькими примерами, взятыми из галереи Лии Веру. Нам предстоит рассмотреть орнамент из пирамид, шахматный рисунок, шахматный рисунок под наклоном, фон из треугольников, а еще нас ждет…

Подробнее
Хватит это верстать, ударим автоматизацией по макетам

Хватит это верстать, ударим автоматизацией по макетам

А Вас не посещала мысль, что вёрстка руками — это долго, дорого, избыточно и устарело? Меня вот постоянно. В данной статье я поверхностно затрону текущее состояние индустрии, проблематики и поделюсь результатами своих исследований. Интересно? Добро пожаловать под кат! Читать дальше →

Подробнее
Дайджест свежих материалов из мира фронтенда за последнюю неделю №421 (22 — 28 июня 2020)

Дайджест свежих материалов из мира фронтенда за последнюю неделю №421 (22 — 28 июня 2020)

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него. Читать дальше →

Подробнее
[Из песочницы] Как верстать веб-интерфейсы быстро, качественно и интересно

[Из песочницы] Как верстать веб-интерфейсы быстро, качественно и интересно

Всем привет! Давно хотел и наконец написал небольшую книжку — бодрое пособие по своей профессиональной области: актуальным подходам к разметке интерфейсов, экранному дизайну и доступности. Она о моем оригинальном подходе к созданию GUI, препроцессорам CSS (для объективности, немного и об альтернативных подходах), и его эффективном практическом использовании с javascript и популярными реактивными компонентными фреймворками Vue и React. Материал представлен аккуратно последовательно, но

Подробнее
Дайджест свежих материалов из мира фронтенда за последнюю неделю №420 (15 — 21 июня 2020)

Дайджест свежих материалов из мира фронтенда за последнюю неделю №420 (15 — 21 июня 2020)

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него. Читать дальше →

Подробнее
[recovery mode] Crawc.net — создание и стилизация своих медиачатов

[recovery mode] Crawc.net — создание и стилизация своих медиачатов

Хочу рассказать о своем проекте. Это чат, а если точнее платформа медиачатов — это значит что тут можно создать и оформить свой однокомнатный чат с поддержкой медиа-контента в сообщениях и вставить его себе на сайт через iframe. Проект только недавно вышел из стадии Бета-версии. Мне много раз говорили что я пишу велосипед, но такого на просторах рунета еще не было. Есть куча чатиков, но они не предоставляют и половины функционала Кравча, а выглядят невероятно хреново. Я потратил огромное…

Подробнее
[Перевод] Использование Grid для макетов страниц, а Flexbox — для макетов компонентов

[Перевод] Использование Grid для макетов страниц, а Flexbox — для макетов компонентов

Мой брат недавно отучился на компьютерщика и сейчас завершает стажировку в области фронтенд-разработки. Он узнал и о CSS Grid, и о CSS Flexbox, но в том, как он пользуется этими механизмами создания макетов, я отметил одну особенность, с которой я уже сталкивался. А именно, ему тяжело даётся принятие решений о том, когда использовать Grid, а когда — Flexbox. Например, он использовал CSS Grid для создания макета заголовка сайта. При этом он отметил, что довести проект до ума ему было нелегко,

Подробнее
Дайджест свежих материалов из мира фронтенда за последнюю неделю №419 (8 — 14 июня 2020)

Дайджест свежих материалов из мира фронтенда за последнюю неделю №419 (8 — 14 июня 2020)

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него. Читать дальше →

Подробнее
Что должен уметь верстальщик, чтобы его все хотели

Что должен уметь верстальщик, чтобы его все хотели

В иерархии фронтенд-разработки верстальщики располагаются где-то здесь: Фронтенд-разработка в 2020, холст, масло В нулевых никаких фронтов не было, и человек, который делает сайты, был просто человеком, который делает сайты. Мог и на HTML что-то собрать, и стили прописать, и на JavaScript алерты наставить, где нужно. Веб-разработка была маленькой, смешной, но самодостаточной. А потом понеслось. Верстальщики стали больше писать на JavaScript и начали поглядывать в сторону именования…

Подробнее