Метка: верстка

Рубрики
Верстальщику

Что нового в CSS3 c 2015?

С того момента, когда мы впервые услышали о CSS3 прошло уже очень много времени. Я нашел у себя в блоге пост от 2009 года «CSS3 — самое время«. Однако большинство улучшений были официально добавлены в спецификацию где-то в 2015 году. Но и с того времени стандарт развивается довольно динамично. На сегодняшний день нам доступны возможности, о которых в 2015 году мы мечтали.

Сейчас мы можем использовать таки вещи как:

  • Grid Layout
  • Переменные в CSS (Custom properties)
  • Медиа-запросы пользовательских настроек (Preferences Queries)
  • Доступна более широкая палитра значений свойства Color для свойства Background
  • Переменные шрифты
  • Использование путей и форм для маски и обтравки текста
  • Фильтры

Буквально в то же время как я опубликовал свой обзор нововведений в JavaScript c 2015, Крис Койер в своем блоге опубликовал детальных обзор «What’s New Since CSS3 in 2015?«. Думаю, что его пост будет интересен и полезен для многих фронт-енд разработчиков.

Рубрики
Верстальщику Разработка

Проблемы доступности слайдеров

Проблемы доступности слайдеров: анализ и варианты решений.

Сегодня карусель или слайдер – это одни из наиболее часто встречаемых элементов пользовательского интерфейса на сайтах. Они помогают создавать галереи изображений, витрины продуктов, ленты новостей и анонсов и прочее…

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

Но дайвайте сначала решим, что же такое карусель как компонент UX?

Продолжить чтение «Проблемы доступности слайдеров»
Рубрики
Верстальщику Разработка

Проблемы доступности веб-форм

Идея изображения с сайта www.deque.com

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

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

Продолжить чтение «Проблемы доступности веб-форм»
Рубрики
Верстальщику Разработка

Tailwind CSS: to use, or not to use?

Я немного опоздал с этой статьей поскольку пару месяцев назад вышло довольно много материалов, особенно в англоязычном Вебе о Tailwind CSS. Но, имея реальный опыт использования этого фреймворка на реальном продакшн проекте, я все-таки решил написать этот пост.

Лично я был весьма доволен результатом моей работы с фреймворком, однако объективно понимал, что это не совсем то, что можно назвать «best practice» в мире CSS. Именно в силу своих двояких чувств я решил написать этот материал, в котором для себя и может еще для кого-то кто думает попробовать этот фреймворк разложить все по полочкам. Когда-то давно я уже публиковал пост с размышлениями о том, стоит ли вообще использовать CSS фреймворки. Теперь, когда для многих вопрос с использованием не возникает вообще, стоит рассмотреть конкретный пример.

Продолжить чтение «Tailwind CSS: to use, or not to use?»
Рубрики
Верстальщику

Фронтенд по фэн-шуй. Часть 3

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

Компонентный подход

Очень сложно придерживаться модульности и компонентного подхода во фронтенде. Многое часто зависит от конкретного проекта. Важно как вы рендерите фронт, что используете. Однако, если у вас есть возможность придерживаться компонентного подхода в разработке фронтенда — вы должны это делать. Не обязательно придерживаться хрестоматийного определения компонентов, но вы должны, как минимум держать все вместе.

Продолжить чтение «Фронтенд по фэн-шуй. Часть 3»