вторник, 6 октября 2015 г.
10 Отличных примеров оформления и использования футера
Хороший футер всегда оценивается посетителями и оставляет лишь позитивные впечатления.
Есть много способов улучшения футера. Ниже мы покажем 10 самых простых и интересных идей.
1) Сделайте футер основным инструментом навигации
Звучит удивительно, не правда ли? Зачем нам менять уже сложившиеся традиции располагать основные инструменты навигации в заголовке, перемещая их в футер? Это нарушает все правила и может сильно ухудшить юзабилити. Однако если выполнить это довольно качественно, то в результате может получиться интересная и простая задумка. Просмотрев пример, приведённый выше, можно в этом убедиться. На данном сайте можно также полностью выключить навигационное меню для просмотра сайта в полную красоту.
2) Создайте кнопку “Наверх”
В примерах выше можно заметить кнопку “Наверх”, которая находится в футере. При нажатии на неё нас перебрасывает на верхнюю часть страницы. Это особенно удобно если информации на странице достаточно много.
3) Придайте футеру контрастность
Можно сделать футер более ярким или наоборот более тусклым по сравнению с другими частями вашего сайта. В примере выше мы видим, что футер чёрного цвета, тем самым он выделяется от остальной белой части сайта и бросается в глаза клиентам. Также красивая картинка привлекает внимание к себе и соответственно к футеру. Ещё мы видим простую контактную форму для заполнения, которую разместили на свободное место футера.
4) Вставьте свою иллюстрацию в футер
Если вы талантливый иллюстратор, то футер для вас – это лишь свободное место для вашей творческой идеи. Это позволит вам оторваться от строгой тематики сайта. Футер, чаще всего – это то, что последнее видит клиент, посещая ваш сайт. Так что попробуйте удивить ваших клиентов какой-нибудь необычной иллюстрацией. Просмотрев два сайта, указанных выше, можно в этом убедиться.
5) Содержание в футере
Существует много аргументов, которые заставляют нас оставлять футер простым и незагромождённым информацией. Но всё-таки есть исключения. В трёх примерах выше футер является одной из основных частей информационного содержания сайта. Просто сделано всё компактно и не запутанно, что и не даёт ввести посетителей в замешательство.
Также из примеров заметим, что в футере можно указать список свободных внешних ресурсов.
6) Прикрепите вашу фотографию к футеру
Если у вас нет идей чем заполнить ваш футер, то вы всегда можете вставить туда свою фотографию, написать немного о себе, и конечно же добавить контактную информацию.
7) Включите в футер социальные медиа
Также в футер можно включить свои различные социальные связи и средства массовой информации. Это довольно распространённая методика. У многих пользователей Интернета в их блогах, на их сайтах и т.д. в футере располагаются ссылки на их профили в Facebook, Twitter, MySpace.
Не забывайте, что стиль каждой ссылки должен быть своеобразен. Посмотрите на пример приведённый выше, чтобы получить представление об этом.
8) Обновляйте ежедневно
Ещё одна интересная идея для футера – это содержание дополнительной информации, которая будет постоянно обновляться. Клиенты заметят ежедневные изменения, и им станет интересно посещать ваш сайт каждый день.
9) Информационные графики
Недавно я наткнулся на сайт, на котором увидел информационные графики, расположенные в футере. Обычно посетители не любят слишком сложную информацию. В этом случае график оказался довольно прост и понятен. Может и вам захочется использовать эту идею в футере. Вы можете посмотреть пример на сайте, указанном выше.
10) «Оживите» футер
Немного анимации никогда не помешает, а наоборот добавит визуального интереса к вашей странице. В футере примера показанного выше мы видим анимированных светлячков, которые летают вокруг свечи. Анимация подходит к дизайну и становится очень красивым и интересным дополнением. Я советую не ставить слишком сложную анимацию, она лишь будет отвлекать посетителей от основного содержания сайта.
Заключение
Надеюсь, что хотя бы один из этих десяти примеров придётся вам по вкусу. Ну или конечно же у вас есть свои собственные идеи. Делитесь ими друг с другом в комментариях!
0 коммент.:
Отправить комментарий