Фиксированный контент – это содержимое, которое сохраняет свое положение вне зависимости от положения полосы прокрутки в данное время. Обычно такое содержимое помещается внутри блоков, у которых css-правило position:fixed. То есть такая технология абсолютно не является новой. Однако особую популярность она приобрела именно на сегодняшний день, а вызвало ее активное использование мобильных телефонов, смартфонов и планшетов. Ведь для того, чтобы вернуться вверх страницы (особенно, если на странице содержится очень много материала) пользователю придется приложить ряд усилий.
Ввиду этого для мобильных сайтов была предусмотрена фиксированная навигация, положение которой не изменялось при прокрутке странице вниз. Позже этот подход перекочевал на старшие девайсы – планшеты и экраны мониторов.
Навигация это, пожалуй, один из важнейших аспектов сайта. Она позволяет пользователям перемещаться со страницы на страницу в поисках интересного контента. Поэтому расположение навигации всегда в одном и том же месте — большой плюс. Более того ввиду появления тренда вертикальной прокрутки контента (когда вся информация размещается по длине страницы, чаще в одну колонку), такое решение является универсальным, так как избавляет пользователя от необходимости постоянно возвращаться наверх страницы для выбора другого пункта меню.
С развитием адаптивного дизайна фиксированные элементы UI получили новый виток развития и уже не ограничиваются только навигацией. Умелые дизайнеры, которые способны правильно применять те или иные инструменты, могут превратить фиксированные элементы UI в мощные инструменты как визуального, так и тактильного воздействия на пользователя.
Наиболее типичные способы использования фиксированного интерфейса:
- Горизонтальная строка меню
Как уже было описано выше, это наиболее эффективный метод предоставления навигации для сайтов с длительной вертикальной прокруткой.
- Фиксированный сайдбар
Наиболее часто встречается в мобильных сайтах или приложениях для смартфонов и планшетов. Представляет собой вертикальное меню которое постоянно размещается на экране в виде узкого сайдбара с иконками пунктов меню и разворачивается при выполнении свайпа.
- Фиксированный логотип
Иногда дизайнер размещает логотип таким образом, что он всегда остается в одном и том же месте экрана. В сочетании с фиксированным фоном сайта создает иллюзию плавающего контента.
- Панель быстрого доступа
Наиболее частое решение. Предполагает собой плавающую панель с кнопками для вызова технической помощи, формы контактов, либо содержащая ссылки на представительства компании в социальных сетях.
- Блок со связанными материалами
Часто используется на новостных сайтах. По мере прокрутки страницы вниз появляется плавающий блок со статьями, которые могут быть интересны пользователю. Что важно, данная панель появляется только в том случае, если пользователь дойдет до определенной заранее точки экрана, а значит не будет мешать.
- Заменяющее меню
Если на сайте меню расположено таким образом, что прикрепить его просто так не получится, тогда дизайнеры предлагают использовать заменяющее меню, которое появляется в том случае, когда основное меню исчезает из поля видимости пользователя. Обычно такое меню закрепляется в одной части страницы (например вверху) и может выглядеть по-другому, содержать только основные пункты, либо возвращаться в начало страницы для использования основного меню.
Как видите, способов использования фиксированного UI достаточно много. Главное – при верном использовании такой подход станет мощным инструментом для повышения уровня usability на вашем сайте.