17 сентября 2011

Как создать эффективный футер на сайте. Советы и примеры

Сейчас в футере (от англ. слова footer — нижняя часть страницы) большинства веб-сайтов, можно найти такую информацию как дата создания, название ресурса или информацию об авторских правах. Некоторые сайты размещают в «подвале» навигационные ссылки, например на страницы «О сайте» или «Контакты», или перечисляют наиболее читаемые категории. Наш блог можно отнести именно к таким сайтам и поэтому мы можем с уверенностью сказать, что эти ссылки никому не интересны и процент пользователей, которые на них кликнут, близок к нулю.

Гораздо эффективнее сделать футер более «видимым» и красивым, насытив его полезной информацией. К сожалению, дизайн каждого сайта индивидуален и такой футер может просто не вписаться во внешний облик ресурса. Поэтому внедрение расширенного футера в дизайн лучше всего осуществлять на этапе создания прототипа или эскизов будущего веб-проекта.

Так же очень важно правильно выбрать какими именно блоками насыщать футер. Здесь основной выбор стоит делать исходя из тематики сайта и задач, поставленных перед ресурсом. Ниже мы расскажем какие бывают элементы и для каких видов сайтов эти элементы подходят.

Какие элементы добавить в подвал сайта?

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

Навигация по сайту

Повторение навигации бывает очень полезно, если страница длинная и для поиска такого же блока нужно совершить ряд действий. При большом количестве страниц или категорий желательно сделать выпадающее меню, которое поможет улучшить поиск нужного раздела. Если же выпадающее меню не подходит, то следуют выбрать наиболее полезные для вашей аудитории страницы и показывать только их.

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

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

Контактная информация

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

При разработке, как правило, ограничиваются следующими элементами: адрес магазина или организации, телефоны, e-mail адреса, карта проезда (либо, ссылка с иконкой, либо полноценная карта с возможностью просмотра без перехода на другой сайт) или форма обратной связи.

Так же, нередко можно встретить комбинированный вариант, когда в «подвале» размещают ссылки на важные страницы ресурса и краткую контактную информацию (без карты и формы обратной связи).

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

Социальные данные

Если ваш сайт относится к социальным медиа или вы активно общаетесь с аудиторией ресурса через социальные сети, стоит задуматься о размещении ссылок на соответствующие сайты. Как и с группой о навигации, стоит давать ссылки только на наиболее популярные сети, если вы зарегистрированы более чем на 5 сайтах.

Социальные сети являются популярными инструментами для получения информации, поэтому очень важно, чтобы посетитель смог найти в каких сетях есть тот или иной ресурс. Если вы ведете блог, обязательно установите кнопки вида «Мне нравится» и «Твитнуть».

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

Примеры красивых и эффективных футеров