Во время создания дизайна сайта или его SEO-оптимизации важно сделать так, чтобы им было удобно пользоваться. Хорошее юзабилити складывается, когда все элементы на странице продуманы: начиная шапкой и заканчивая подвалом. Зачастую оптимизацией последнего пренебрегают. В статье разбираемся, почему важен подвал сайта, чем полезен и как его грамотно использовать.

Что такое футер сайта

Футер или подвал сайта (англ. footer) — это блок в самом низу страницы с информацией, которая может быть полезна посетителю.

Аналитика

Из исследования, проведенного на основе 1.000.000 посетителей, было подсчитано, что большая часть времени проводится за линий сгиба экрана.

Убедиться можно самим, посмотрев отчет «карта скроллинга» в Яндекс.Метрике.

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

Во время тестирования сайта в компании UserTesting заметили, что размещение призыва к действию (CTA) в подвале помогло повысить конверсию на 50% за двухнедельный период!

Компания SmartInsights также сообщила, что они увидели почти 24% рост конверсии продаж, после оптимизации нижнего колонтитула своего сайта. Доработка подвала заключалась в грамотной перелинковке. Как ее сделать разберемся далее в одноименной главе.

Футер до оптимизации Футер после оптимизации

Что разместить в футере сайта

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

3 обязательных элемента

В каждом подвале должны быть 3 вещи:

  1. Политика конфиденциальности. Ссылка на документ или страницу, где объясняется, как вы будете использовать и защищать личные данные посетителей.
  2. Условия использования. Ссылка на страницу, где расписаны общие правила и рекомендации, регулирующие использование сайта.
  3. Авторское право ©. Эта информация дает понять, что копирование информации с вашего сайта будет считаться плагиатом.
3 обязательных элемента на примере www.healthline.com

Адрес

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

Карта

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

Карта сайта на примере 24stoma.ru

Обратная связь

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

+7-927-000-11-22.

Кроме того можно использовать и другие средства связи: Viber, WhatsApp, электронную почту.

Способы обратной связи в подвале на примере 63plitka.ru

CTA (Call to action)

В подвале должны быть кнопки или лид-формы, побуждающие совершить действие.

  • Кнопка подписаться. Самое удачное место для подписки на почтовую рассылку как раз в подвале. Перед уходом с сайта, посетитель может подписаться на вас в один клик.
  • Вход на сайт. Кнопка входа в личный кабинет так же будет органично смотреться в подвале.
  • Другие призывы к действию. Например, кнопка перенаправляющая на лид-форму с оставлением заявки, записи на прием и т.д.
Призыв «Добавить заведение» в подвале на примере banketof.ru Призыв «Записаться на консультацию» в подвале на примере oftalnova.ru Несколько CTA в подвале на примере zub.ru Несколько CTA в футере на примере www.orbitmedia.com Призыв «Подписаться на рассылку» в подвале на примере searchengineland.com Личный кабинет на примере ambotis.ru

Перелинковка

Включайте только самые важные страницы или разделы в качестве ссылок в подвале. Это могут быть основные/популярные разделы (меню) в вашем интернет-магазине, страницы с акциями и другие ссылки, которые могут заинтересовать посетителей. Для простоты восприятия разделяйте ссылки на столбцы.

Перелинковка в подвале на примере www.impl.ru Перелинковка в футере на примере lacasa-m.ru Перелинковка на примере www.poehalisnami.ua

Социальные кнопки

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

Кнопки соц. сетей в футере на примере www.mi.com

Преимущества

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

Примеры статических

2 преимущества в футере на примере level.travel Статический баннер в футере на примере webxloo.com Статический баннер в подвале на примере odesseo.com.ua

Примеры динамических (виджетов)

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

Курс валют в футере на примере www.teztour.ua

Виджет он же «Бейдж с рейтингом организации на сайт» от Яндекса. Мало того, что показывает ваш актуальный рейтинг на Яндекс.Картах, так и позволяет быстро оставить отзыв на сайт.

Рейтинг организации в футере на примере greencardamon.ru

Виджеты оценок и отзывов других сервисов повышают доверие к ресурсу.

Виджет оценок в футере на примере hotelsalut.ru Виджет отзывов в футере на примере skydent.ru

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

Виджет погоды в футере на примере voschod.ru

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

Виджеты посещаемости в футере на примере www.fontanka.ru

Логотип

Размещайте логотип со ссылкой на главную страницу сайта. Так вы повысите узнаваемость бренда и упростите навигацию по сайту.

Логотип в подвале на примере www.belcantofund.com

Возраст домена

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

Поэтому используйте простую PHP функцию для вывода актуального года автоматически:

Возраст домена в подвале на примере www.cvz.ru

Мобильные приложения

Ссылки на скачивание мобильных приложений как нельзя кстати разместить в подвале сайта.

Ссылки на приложения в подвале на примере www.svyaznoy.ru

Текст в подвале

В некоторых тематиках, например в медицинской, стоит указывать текст об отказе от ответственности. Это особенно актуально, когда Google стал очень жестко относиться к E-A-T тематикам.

Текст отказа от ответственности в подвале на примере www.startsmile.ru Текст отказа от ответственности в футере на примере rsdent.ru

Также в нижнем блоке может размещаться небольшой текст-информация о сайте.

Описание сайта в подвале на примере www.pepper.ru

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

График работы в подвале на примере www.sfe.ru

Способы оплаты

Для интернет-магазинов полезно размещать способы оплаты для наглядности в виде иконок.

Иконки способов оплаты в подвале на примере shop.megafon.ru

Ссылки в подвале сайта

Часто SEO-компании или разработчики размещают обратную ссылку на свой сайт. Отличное место для рекламы ?. Спросите у Тильды. Кстати говоря, SEO-эффект таких ссылок уже невелик. Раньше их могли использовать для серьезного прокачивания ссылочной массы, но это в прошлом.

Бэклинк в подвале на примере tyre-service.kz Бэклинк в футере на примере www.aqua-shop.ru Обратная ссылка в подвале на примере maskiest.ru

Карта сайта в подвале

Раньше на большинстве сайтов была карта сайта. Ее обычно размещали как раз в подвале сайта, чтобы ссылка была на нее сквозная. Якобы карта сайта помогает поисковым роботам лучше понять структуру сайта. Но на текущий момент это скорее рудимент, чем реальное средство.

Что еще?

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

Строка поиска в подвале на примере www.vo-da.ru

Популярные посты. Это поможет подогреть интерес к вашим статьям.

Популярные публикации в подвале на примере ahrefs.com/blog/

Используемые бренды, партнеры.

Бренды в подвале на примере www.walmart.com

Рекомендации по футеру

Мы рассмотрели основные элементы подвала сайта, которые могут быть полезными для посетителей. Их получилось достаточно много и теперь важно выбрать наиболее подходящие именно вам. Оформление же футеров ограничивается только вашей фантазией. Кроме этого:

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

Примеры качественных подвалов

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

Бренды в подвале на примере www.rudenta.ru Бренды в подвале на примере hotel.democrat Бренды в подвале на примере offspring.lifehacker.com Бренды в подвале на примере www.lorealparisusa.com Бренды в подвале на примере www.apple.com Бренды в подвале на примере www.elegantthemes.com

Примеры неудачных подвалов

Так же стоит понимать, как лучше не делать. Мы прокомментировали каждый неудачный футер, чтобы вы не допустили таких же ошибок.

Слишком много кнопок (причем одинаковых). Сложно зацепиться глазу за что-то одно Портянка текста, которая увеличивает размер страницы не лучшее решение Слишком длинный. Не оптимально сгруппирован Без комментариев Плохо сгруппированы элементы и слишком много полей для ввода Аляпистые тексты Плохо читающийся текст Просто малополезный футер

Вывод

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