Думаю любому современному дизайнеру или верстальщику рано или поздно в голову приходила мысль «А почему бы на этом проекте не использовать принципы отзывчевого веб-дизайна?». Пожалуй, сложно найти человека, который не слышал о responsive design в наше время, когда сёрфить веб могут с телефона, микроволновки и тапочек. Приступая к работе над подобным проектом, неплохо было бы иметь под рукой примеры возможного поведения лейаута и его отдельных элементов.
Парень по имени Брэд Фрост, из медийного агенства R/GA, любезно собрал, оформил и выложил коллекцию статей и паттернов отзывчевого веб-дизайна для нас, любимых. Количество и разнообразность различных подходов действительно поражает, среди них:
- Примеры поведения общего лейаута — растягивание, перестроение блоков, исчезание ненужных элементов и многое другое;
- Таблицы — скрытие ненужной информации, показ таблицы в виде диаграммы при маленьком размере экрана и прочее;
- Действительно удобные примеры показа навигации на мобильных устройствах;
- Различные типы типографских сеток;
- Поведения изображений, видео и прочего медийного контента;
- Отображение форм;
- Карусели, нотификации и прочие js необходимости (правда пока в зачаточном состоянии);
Так же на ресурсе собраны чуть ли не все статьи, касательно responsive design. Пользуйтесь, не забывайте делать пул реквесты и, конечно же, нарушайте правила и экспериментируйте!
Автор: omfg