Футере: что это такое, как правильно оформить подвал (footer) сайта

16.06.1981 alexxlab

Содержание

что это такое, как правильно оформить подвал (footer) сайта

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

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

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

Хороший пример: футер сайта kokoc.com

А вот так выглядит нижний блок сайта, футер которого поленились оформить:

Информации минимум, не указан даже разработчик, смысловой нагрузки ноль

Присоединяйтесь к нашему Telegram-каналу!

Теперь Вы можете читать последние новости из мира интернет-маркетинга в мессенджере Telegram на своём мобильном телефоне.
Для этого вам необходимо подписаться на наш канал.

Что размещать в футере сайта: базовая информация

В футере-подвале сайта может содержаться большой объем очень сжатой и четко структурированной информации. Базовый набор сведений таков:

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

Правовая информация. Если речь идет об электронном средстве массовой информации, то это номер, дата выдачи и наименование органа регистрации электронного СМИ. Для сайтов образовательных и медицинских компаний это сведения о выданной лицензии. Также к правовой информации относится запрет на копирование материалов без ссылки на сайт или без согласования с владельцем сайта. Договор оферты (или информация о том, что содержание сайта не является договором оферты) и политика конфиденциальности — тоже правовая информация, которую каждый владелец ресурса обязан размещать в соответствии с Федеральным законом № 152 «О персональных данных».

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

В футере карту можно увеличить и увидеть точный адрес компании

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

Выглядит страница карты сайта лаконично

Что дополнительно разместить в футере сайта

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

Информация о партнерах. Партнерство с «Яндексом» и Google, более локальное партнерство, указание компаний, которые поддерживают проект финансово или информационно — все это можно разместить в футере в виде логотипов или ссылок. Работает такая информация как социальное доказательство и помогает сформировать доверие к компании-владельцу ресурса.

Информация о «запасном» сайте. Если у вас есть дополнительный ресурс на случай проблем с основным сайтом, на него тоже есть смысл дать ссылку в подвале.
Форма обратной связи, заказа обратного звонка или другие дополнительные формы. Они помогают собирать базу подписчиков, получать лиды, собирать людей в рассылку. Для пользователей удобна форма «Задать вопрос», особенно если она не предусмотрена в других блоках/страницах сайта.

В футере этого сайта нашлось место даже для двух дополнительных форм захвата

Возрастное ограничение. Если сайт содержит материалы, не рассчитанные на детей, это тоже указывают в футере.

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

Встречается ссылка на фирстиль нечасто, но рассмотреть такой вариант стоит

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

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

Пример оформления условий доступа к сайту: ссылка на страницу размещена в футере

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

На этом сайте всего один язык, но кнопка в футере есть — возможно, компания готовится к работе на зарубежном рынке

Дополнительное меню. Оно может быть дублем основного верхнего меню, но в качестве дополнительного меню в футере сайта размещают ссылки на самые востребованные разделы, материалы или продукты (например, обучающие курсы) ресурса.

Вот как сделали владельцы этого сайта

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

При клике на выбранный тег пользователь видит все материалы сайта, отмеченные им. И для SEO такие метки — тоже плюс, ведь теги часто содержат ключевые слова по теме сайта.

Делаем выводы

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

Создание сайтов

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

Что такое футер сайта, что должно быть в подвале сайта

Оглавление

org/ListItem»> Что размещать в футере
Сведения об авторстве
Информация о партнерах
Дублирование контактов
Социальные сети
Обратная связь и другие лид-формы
org/ListItem»> Карта
Политика конфиденциальности и защита персональных данных
Возрастное ограничение
Другая информация
Карта сайта
Дополнительное меню
org/ListItem»> Облако тегов
Наверх
Счетчики
Оформление

Футер сайта (другое название – подвал) – это сквозной структурный элемент, расположенный в нижней части страниц. Противоположен хедеру (шапке) – сквозной верхней части ресурса.

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

da52af20-8711-4ca8-9bcb-1c66260edad4. png

Что размещать в футере

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

Сведения об авторстве

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

footer1.png

Источник maximilyahov.ru

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

footer2.png

Источник www.lamoda.ru

Дублирование контактов

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

footer3.png

Источник www.bmstu.ru

Социальные сети

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

footer4.png

Источник www.wildberries.ru

Обратная связь и другие лид-формы

Добавление в футер возможности непосредственно связаться или каким-то другим образом оставить свои контакты (заказ обратного звонка, подписка) повышает удобство для пользователей и одновременно помогает собирать базу заинтересованных посетителей сайта.

footer5.png

Источник ostin.com

Карта

Размещение в футере интерактивной карты повышает удобство для пользователей, если им важно точное положение компании (например, ищут что-то рядом с домом). Также это может способствовать повышению уровню доверия, как бы подтверждая, что фирма действительно существует за пределами интернета.

footer6.png

Источник modsystem.ru

Политика конфиденциальности и защита персональных данных

Если на ресурсе предусмотрена регистрация или каким-то образом собираются сведения, попадающие под определение персональных данных, на нем необходимо размещать соответствующие правовые документы: об использовании Cookies, пользовательское соглашение, политику конфиденциальности и т. д. Ссылки на них, как правило, добавляют в подвал.

footer7. png

footer7.png

Источник www.shopolog.ru

Возрастное ограничение

Если на сайте требуется указание, на какой возраст пользователей рассчитаны материалы, это часто публикуется в футере.

footer8.png

Источник — regnum.ru

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

footer9.png

Источник selineclinic.ru

Карта сайта

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

Дополнительное меню

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

footer10.png

Источник www.seonews.ru

Облако тегов

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

footer11.png

Источник promo.ingate.ru

Наверх

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

footer12.png

Источник adme.ru

Счетчики

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

footer13.png

Источник www.gvozdik.ru

Оформление

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

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

footer14.png

Источник www.yodiv.com

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

footer15.png

Источник www.oknadomkom.ru

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

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

Что такое футер (footer) и как его использовать на веб-сайтах

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

Основы футеров

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

Футер – это область, расположенная внизу каждой страницы сайта под основным контентом.

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

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

Люди пользуются футерами

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

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

а) Второй шанс принять решение.
Например, пользователь, прочитав все детали, решил, что он не хочет регистрировать банковский счет, но он все еще впечатлен банком и хочет стать их клиентом. Футер – хорошая возможность напомнить или рассказать потенциальным клиентам о других предложениях компании.

b) Последнюю надежду для труднодоступного контента

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

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

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

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

Элементы футера

По разным причинам дизайнеры сайтов выбирают для футера много разных типов контента. Элементы футера могут быть объединены в зависимости от целей бизнеса и пользователя. Вот некоторые из наиболее распространенных компонентов футера, примеры и рекомендуемые ситуации для их использования:

Полезные ссылки
Doormat navigation
Ссылки на второстепенные задачи
Карта сайта
Отзывы или награды
Бренды в организации
Вовлечение клиентов (рассылки по электронной почте и социальные сети)

Футер на сайте Uscreen.tv включает в себя несколько типов контента, таких как 1) контент второстепенной задачи 2) служебный контент и 3) ссылки на социальные сети

Полезные ссылки

Большинство сайтов имеют тенденцию включать в футер компактное меню, указывающее на:

Контактную информацию: адрес компании, номер телефона и ссылка на чат
информацию по обслуживанию клиентов
политику конфиденциальности
условия использования

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

Используйте для: всех сайтов

Футер сайта Clarity Money упрощает задачу, включая ссылки на Условия использования и Политику конфиденциальности, а также ссылки на аккаунты в социальных сетях

J. Crew предоставляет контактную информацию в виде ссылок на свой аккаунт в Twitter для обслуживания клиентов, номер телефона и адрес электронной почты службы поддержки

Doormat Navigation

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

Используйте для: сайтов с длинными страницами, особенно если глобальная навигация недоступна в нижней части страницы.

United Healthcare использует doormat navigation: основные категории отображаются как в верхней панели навигации (вверху), так и в футере (внизу)

Второстепенные задачи

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

подачу заявки на работу в компании
задания для создателей контента
доступ к информации для инвесторов
поиск документации или спецификаций продукта, или услуги
доступ к медиа-комплектам и другой PR-информации
поиск филиалов компании

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

Используйте для: помощи пользователям в поиске вторичного контента, который может не иметь прямого отношения к основной цели сайта

Например, на веб-сайте Dwell Magazine представлены категории, не относящиеся к темам журнала, в том числе About, Dwell Magazine, Professionals и Merchants, которые могут заинтересовать вторичные группы пользователей: профессионалов в области СМИ и дизайна, продавцов, инвесторов и рекламодателей (и потенциальных сотрудников).

Футер сайта Dwell Magazine содержит ссылки на второстепенные задачи

Карта сайта

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

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

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

Используйте для: больших сайтов с несколькими уровнями информации или поддоменов

Футер CNN содержит ссылки на навигацию верхнего уровня и на категории нижнего уровня

Отзывы или награды

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

Проведите юзабилити-тесты и A/B тесты со своей аудиторией, чтобы определить, подходит ли эта стратегия для вашего футера, и каково подходящее количество отзывов.

Используется для: стартапов или компаний с меньшей узнаваемостью бренда

Чтобы укрепить свой авторитет, Reykjavik Excursions показывает в своем футере награды и организации, от которых они получили признание

Бренды в организации

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

Используйте для: крупных международных организаций с большим количеством дочерних или партнерских брендов

Футер на сайте Walmart перечисляет другие бренды, которыми владеет компания, такие как Hayneedle, Jet и Modcloth

Вовлечение клиентов

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

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

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

На всех страницах сайта TheGoodTrade.com имеется большой многокомпонентный футер, который включает в себя: 1) предложение подписаться на рассылку, 2) виджет с фидом Instagram аккаунта, 3) ссылки на аккаунты в социальных сетях, 4) ссылки на второстепенные задачи и 5) отказ от ответственности с информацией об авторских правах

Варианты футеров

Бесконечный скролл и мини-футер

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

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

Использовать для: страниц с бесконечным скроллом

Сайты с бесконечной прокруткой, такие как LinkedIn.com, часто содержат контент футера в других местах, например, в нижней части правого столбца

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

Контекстные футеры

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

Например, на домашней странице Medium.com нет футера. На странице отображается бесконечно прокручиваемый список статей. (На странице есть мини-футер справа, как рекомендовано выше). Однако на странице отдельной статьи отображается футер на основе задач, которые зависят от того, является ли читатель подписчиком или нет.

Используйте для: сайтов с различными пользовательскими ролями (например, «создатель контента» vs «потребителя контента» или «участник» vs «гость»)

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

Характерные ошибки футера (и их решения)

Футеры прошли долгий путь с 1990-х годов, но по сей день еще встречаются следующие распространенные ошибки:

Более двух уровней информационной иерархии Нельзя добавлять всю карту сайта в футер. Футер – это ограниченное количество пространства экрана, которое должно быть посвящено только важной информации. Как однажды метко сказала моя мама: «Если все важно, ничего не важно».
- РЕШЕНИЕ: Подумайте о перераспределении контента и отображении только ссылок на категории первого и второго уровня, а не на весь сайт. Если отдельная страница нижнего уровня достаточно важна, отобразите эту конкретную ссылку в футере, но вам не нужно показывать все уровни информационной иерархии, чтобы ее можно было обнаружить.
Неясные имена ссылок в футере (например, Company Info или Help вместо Contact Us) Пресловутая ссылка «Ресурсы» во многих футерах является одним из прискорбных пережитков прошлого.
- РЕШЕНИЕ: Команды должны стараться придерживаться общепринятых, четких условий. Если команда не уверена, какой термин будет наиболее подходящим, сортировка карточек или тест юзабилити могут помочь определиться с терминологией.
Неясная структура или информационная иерархия Иногда футер может быть «свалкой» для потерянных ссылок, то есть ссылок, которые, по-видимому, не имеют отношения к глобальной навигации или второстепенным задачам. Если у футера отсутствует паттерн организации, пользователям либо придется просматривать все информацию, либо они потратят очень мало времени на его изучение.

Футер GM не имеет четкой структуры из-за отсутствия информационной иерархии. Подобная настройка затрудняет сканирование или поиск содержимого

РЕШЕНИЕ: Четко передайте информационную иерархию элементов в футере с помощью группирования или других шаблонов визуального дизайна, которые указывают визуальную иерархию (например, жирные ссылки на страницы верхнего уровня и обычные ссылки на страницы нижнего уровня).

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

В более ранней итерации футера на сайте Reserved.com использовалась функция аккордеона, которая по умолчанию была свернута, что затрудняло ее поиск

РЕШЕНИЕ: используйте разборчивый размер и цвет шрифта (с приличным контрастом) и избегайте использования декоративных шрифтов. Самое главное, не скрывайте футер – люди ожидают его там найти.

Вывод

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

Получите больше советов по созданию более эффективных веб-страниц в нашем курсе Web Page UX Design.

Ресурсы

Jakob Nielsen & Kara Pernice, 2010, Eyetracking Web Usability, The New Riders

Перевод статьи Therese Fessenden

подвал, низ, нижняя часть сайта

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

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

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

Какую роль играет

Footer в веб-разработке играет несколько ролей.

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

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

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

Что содержит

Содержимое блока footer — это индивидуальный вопрос. Каждый веб-мастер решает для себя сам, что должно быть в подвале сайта. Ниже приведен список элементов, которые наиболее часто располагаются в нем.

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

Как создать хороший футер

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

Ниже описаны некоторые советы и рекомендации по созданию качественного подвала.

Необходимо использовать те же стилевые приемы, что и в других частях сайта.
Информация должна быть структурирована: разбита на колонки, отдельные блоки. Пользователь должен легко в ней ориентироваться.
При использовании списков с заголовками последние должны выделяться.
Между отдельными элементами должны соблюдаться границы. Они располагаются на достаточном расстоянии друг от друга.
Используемые шрифты должны сочетаться с общим дизайном сайта.
Между первым элементом и началом блока подвала делается отступ.
Свободное пространство. Данных не должно быть слишком много. Не стоит их лепить друг на друга. Лучше сделать сам подвал больше. Чем больше свободного пространства вокруг элемента, тем лучше он запоминается и больше внимания привлекает.
Самые главные элементы можно сделать ярче. Остальные приглушить. Это позволит сфокусировать внимание посетителей на чем-то конкретном.

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

Что такое футер сайта или что писать в подвале

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

Содержание

1 Что такое футер или подвал сайта
2 Что обычно пишут внизу сайта
- 2. 1 Подвал первого уровня
- 2.2 Подвал второго уровня
- 2.3 Подвал третьего уровня
- 2.4 Навигация
- 2.5 Карта
- 2.6 Форма обратной связи или форма подписки
- 2.7 Контакты компании
- 2.8 Дополнения для мобильных
- 2.9 Кнопки социальных сетей
- 2.10 Стрелка вверх ↑
3 Заключение

Что такое футер или подвал сайта

Футер сайта, это сленговое понятие среди русскоговорящих веб-мастеров и разработчиков. Как и многие другие, оно было заимствовано из английского языка. Слово «footer» – переводится как «нога, нижняя сноска или подвал». То есть – это самая нижняя часть сайта.

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

Что обычно пишут внизу сайта

Футер сайта может состоять как из одного блока, так и из нескольких. Они могут слегка отличаться по цвету и иметь разное наполнение.

Обратите внимание, на моем сайте подвал состоит из трех уровней:

Подвал первого уровня

В самой нижней части подавала обычно располагают:

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

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

Подвал второго уровня

Следующая часть подвала чуть более функциональна… Там могут располагаться технические ссылки.

К таким, я отношу ссылки на:

партнерскую программу
карту сайта
политику конфиденциальности
соглашение об обработке персональных данных

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

Подвал третьего уровня

Следующий уровень подвала еще более информативен и полезен для посетителя. На нем мы остановимся подробнее. Ведь расположить там можно все, что душе угодно.

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

И так…

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

Меню в подвале дублирует главное меню сайта

Карта

Адрес и полноценная карта проезда подойдет для сайтов малого и среднего бизнеса. Если вас сложно найти, расположите карту не только на отдельной странице, но и в подвале.

Форма обратной связи или форма подписки

Если вы ведете рассылку, то форму подписки можно добавить в подвал.

Футер магазина М-Видео

И даже при наличии на сайте полноценной страницы «Контакты», дополнительную форму для отправки сообщения часто спускают в подвал, чтобы она была доступна с любой страницы сайта.

Контакты компании

В подвале можно разместить не только контакты, но и расписать полноценный график работы каждого филиала.

Дополнения для мобильных

К таким дополнениям можно отнести QR код или ссылки на AppStore и Google Play для установки официального приложения сайта.

Кнопки социальных сетей

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

Стрелка вверх ↑

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

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

Поэтому стрелки сейчас не располагают в подвале, а делают их плавающими по странице.

Заключение

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

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

А у меня все.

Нашли ошибку? Выделите фрагмент текста и нажмите CTRL+ENTER

Как разработать идеальный футер сайта? Подробное руководство с примерами

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

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

Что такое футер, насколько он важен и почему

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

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

Основные преимущества нижней части сайта

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

Акцент на важном

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

Рост лидогенерации

Футер скажет пользователю, что конец сайта вовсе не конец. Он поможет удержать потребителя, подтолкнуть его к дальнейшему действию: заполнить форму обратной связи, перейти на страницу сообщества в социальных сетях, записать контактные данные или зарегистрироваться. Это все влияет на общую конверсию сайта. Благодаря правильному оформлению подвала посетитель запросто может стать клиентом. Главное, знать, что интересно для ЦА и что разместить в этой части страницы. Каждая ошибка может привести к снижению лидогенерации и, как результат, показателя конверсии. Чтобы избежать этого, посмотрите какие бывают ошибки веб-дизайна.

Максимум полезной и важной информации

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

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

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

Максимальный захват внимания

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

Что должно быть в футере сайта?

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

Авторские права

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

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

Награды и сертификаты

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

Карта сайта

Карта сайта в футере — это список страниц вашего сайта, которые помогут поисковому алгоритму проиндексировать страницы. Или карта может выступать в виде URL, которые поисковик ранее не обнаружил при сканировании сайта.

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

Политика конфиденциальности/условия пользования

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

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

Форма обратной связи

Не стоит упускать возможность удержать клиента, предложив ему заполнить форму обратной связи.

Форма обратной связи поможет сконвертировать пользователя в клиента. Она помогает посетителям принять окончательное решение о сотрудничестве, если ранее пользователь был не уверен, что готов к нему. При этом форма обратной связи может содержать различные призывы к действию. Например, призыв “Остались вопросы? Задайте их нам” очень неплохо работает. Особенно, когда пользователь не смог найти ответ на интересующий его вопрос. Размещение формы обратной связи в футере — большой и жирный плюс к конверсии сайта.

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

Контакты компании

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

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

Полезные ссылки на сайт

Навигационные ссылки на страницы сайта помогут посетителю найти то, что его интересует, если ранее он еще это не нашел в основном меню. Также подобными ссылками могут служить дубликаты на страницы “Доставка”, “Оплата”, “О компании” и т.д.

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

Иконки социальных сетей

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

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

Ссылка на вход в личный кабинет

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

Форма подписки на рассылку

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

Форма поиска по сайту

Для интернет-магазинов и крупных порталов форму поиска логично размещать вверху сайта на самом видном месте. Но для некоторых сайтов это неактуально.

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

О компании

Не всегда есть смысл посвящать целую страницу с информацией о компании, когда, в первую очередь, необходимо продвинуть свой товар или услугу. Поэтому нередко практикуется размещение краткой информации о компании в футере сайта. Здесь можно сжато предоставить самую основную информацию, ценную для пользователя. При этом объем информации не должен превышать 300-500 символов. Писать тексты на 5000 символов и скрывать кнопкой “читать дальше” бессмысленно, так как футер размещается на всех страницах и будет дублирующийся контент.

Ключевые запросы

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

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

Последние обновления в блоге

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

По этому же принципу можно размещать любую информацию в подобном блоке. Например, ссылки на полезные статьи.

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

Призыв к действию

Давайте сотрудничать! Напишите нам! Оставьте свой номер телефона и мы перезвоним в течение 5 минут! Простой, но броский призыв к действию в совокупности с формой обратной связи или формой для рассылки, размещенные в подвале, поможет повысить конверсию сайта. Не забывайте, что призывы должны быть понятные и четкие, чтобы пользователю не пришлось думать как сделать действие, которое ему предложено.

Карта

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

Размещайте рабочую карту, которой пользователям будет удобно пользоваться. Нет смысла размещать карту Yandex, если сайт ориентирован на украинских пользователей, так как сервис заблокирован для Украины и при загрузке подобной карты — будут пустота. Что, согласитесь, не солидно.

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

Чего не должно быть в футере?

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

Не переусердствуйте с SEO-оптимизацией футера. Не забывайте, что поисковая система на раз увидит черное SEO и накажет за это.

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

Как грамотно разработать дизайн подвала сайта? 5 ценных рекомендаций

Дизайн подвала сайта и его структура должны быть продуманы, чтобы интересовать и привлекать онлайн-пользователя. Как это сделать — читайте 5 ценных рекомендаций.

Используйте креативные решения

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

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

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

Разместите анимацию

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

Выбирайте читабельные шрифты

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

Используйте больше пространства

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

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

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

Разместите призыв к действию

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

Чем отличается футер интернет-магазина от подвала других видов сайтов?

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

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

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

Вакансиях компании;
Контакты менеджеров-консультантов относительно специфического оборудования, которое продает интернет-магазин;
Информация о скидках для постоянных клиентов, программе лояльности;
Сведения о вариантах оплаты для юридических и физических лиц;
Адреса сервисных центров;
Информация о сотрудничестве для партнеров и поставщиков;
Ссылка на FAQ;
Информация о покупке подарочных сертификатах;
Сведения о компании, режиме работы оффлайн- и онлайн-магазина и многое другое.

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

Потрясающие примеры оформления подвала сайта

Давайте рассмотрим примеры подвалов сайтов различных видов деятельности, дизайнов и наполнения. Черпайте идеи для разработки привлекательного и правильного футера для своего сайта 🙂

Пример подвала сайта № 1

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

Пример № 2

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

Пример № 3

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

Пример № 4

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

Пример № 5

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

Пример № 6

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

Пример № 7

Пример типичного футера для интернет-магазина, где расположено большое количество ссылок на разные страницы сайта. Здесь пользователь сможет найти дополнительную информацию о компании, магазинах и услугах. Благодаря правильной структуре подвала большое количество ссылок смотрится органично — здесь легко найти то, что нужно. Подобные идеи должны заранее прорабатываться СЕОшником и вноситься в ТЗ на создание сайта. Это делается для того, чтобы не пропустить часть важной информации, предоставив ее конечным потребителям.

А вы уже знаете каким будет ваш футер сайта?

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

Понравилась статья? Жмите палец вверх и подписывайтесь на наш блог!

Автор — Игорь Кобылянский

Основатель студии

Антиспам поле. Его необходимо скрыть через css

Ваша оценка:

Лучшие практики дизайна нижнего колонтитула веб-сайта: 27 вещей, которые нужно поместить в конец

Вот интернет-история, которая происходит миллион раз в день.

Вивиан посещает веб-сайт… но она не видит то, что ищет… она прокручивает немного вниз… но все равно не находит… прокручивает еще немного… все еще не там… затем она идет до конца в низ страницы… и вот оно, в нижнем колонтитуле сайта. Ссылка, которую она искала!

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

Нижний колонтитул веб-сайта предназначен для помощи посетителям путем добавления информации и параметров навигации в нижней части веб-страниц.

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

Насколько важны нижние колонтитулы?

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

Если вам интересно, как далеко посетители прокручивают ваш сайт, есть платные инструменты, которые покажут вам «глубину прокрутки» на вашем сайте. Lucky Orange, Crazy Egg и ClickTale — вот несколько примеров.

27 вещей, которые можно разместить в нижних колонтитулах

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

1. Copyright

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

Совет для профессионалов: небольшой фрагмент кода будет автоматически обновлять год.

2.

Карта сайта

Это наиболее распространенная ссылка в нижних колонтитулах, которая указывает на HTML-версию карты сайта. Посетители редко нажимают на эти ссылки, но, как и XML-карта сайта, они могут помочь поисковым системам найти что-то.

3. Политика конфиденциальности

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

Нужна политика конфиденциальности? Мы использовали Условия для создания наших или использовать этот удобный бесплатный генератор политики конфиденциальности.

4. Условия использования

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

Для веб-сайтов в строго регулируемых отраслях вы можете поместить текст прямо в нижний колонтитул.

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

5.

Контакт
Посетители ожидают найти контактную информацию в правом верхнем углу заголовка. Это стандарт веб-дизайна. Также стандартно найти ссылку «контакт» в правом нижнем углу (или в центре) нижнего колонтитула.
Это должна быть ссылка на контактную страницу с контактной формой, а не ссылка на электронную почту. Есть много причин использовать контактную форму, а не ссылку по электронной почте.
Отправку формы легко отследить как достижение цели в Analytics.
Посетитель не может находиться на компьютере, который он использует для работы с электронной почтой.
Формы отправляют посетителей на страницы благодарности, которые могут предоставить больше сообщений и призывов к действию.
Формы отправляют посетителям электронные письма с автоматическим ответом, опять же, больше сообщений и призывов к действию.
Формы могут сохранять отправленные материалы в базу данных на случай, если электронная почта не будет доставлена.
Формы могут подключаться к системам автоматизации маркетинга и другим системам.
Формы могут задавать определенные вопросы и направлять отправку определенным людям в зависимости от ответов.
Ссылки электронной почты являются магнитами для спама.
Так что оставьте эту ссылку электронной почты в нижнем колонтитуле! На самом деле, я не рекомендую размещать ссылку на электронную почту где-либо на вашем сайте.
На этом сайте отличный копирайтинг, но контакт был бы лучше, чем ссылка по электронной почте.
6. Адрес и ссылка на карту/проезд
Информация о месте — это то, что посетители ожидают найти в нижних колонтитулах. Это также способ сообщить Google, где вы находитесь, что важно для компаний с местными клиентами. Ссылка на карту — это удобный способ помочь посетителям найти вас.
При правильном программировании эта ссылка на карту превращается в большую кнопку размером с кончик пальца для мобильных посетителей, вызывая приложение карты на их телефоне или планшете.
7.
Номера телефона и факса
Как и адрес, номер телефона с кодом города является для Google свидетельством того, что вы являетесь местной компанией. Как и кнопка карты, номер телефона должен автоматически превращаться в кнопку, на которую можно нажимать, при просмотре на мобильном устройстве. Нажмите, чтобы набрать номер!
8.
Навигация
Здесь нижний колонтитул может спасти падающих посетителей. Если они забрались так далеко, то, должно быть, не нашли то, что искали. Время предложить еще несколько вариантов.
В последние несколько лет наблюдается тенденция удобства использования, называемая «толстым нижним колонтитулом», что означает добавление большего, чем просто стандартные элементы, перечисленные выше, начиная с навигации.
Нижние колонтитулы теперь часто содержат те же ссылки, которые вы найдете в раскрывающемся меню «мегаменю» в навигации заголовка. Но это не обязательно избавит посетителя от падения с вашей страницы. Помните, что это посетители, которые не нашли то, что искали выше.
Вот несколько источников идей для навигации в нижнем колонтитуле:
Проверьте отчет «Поиск по сайту > Запросы» в Analytics. Что ищут посетители? Что они не находят? См. отчет о разбитых мечтах.
Проверьте отчет «Карта поведения» в Analytics. Куда, по-видимому, хотят попасть посетители? Вот как найти лучший путь через ваш сайт.
Какие внутренние страницы нуждаются в повышении поискового рейтинга? Научитесь использовать внутренние ссылки для SEO-преимущества.
Вам не нужно просто повторять основную навигацию. Вы также не должны просто добавлять всю карту сайта. Это заставляет посетителей копаться в куче ссылок. Чем это полезно?
9.
Социальные иконки
Мы любим посетителей из социальных сетей. Но мы не любим, когда наши посетители уходят и переходят на Facebook, Twitter или YouTube. Если они это сделают… они не вернутся. Именно поэтому наши дизайнеры почти никогда не помещают иконки социальных сетей в шапки сайта.
Нижний колонтитул — лучшее место для добавления значков, привлекающих посетителей в социальные сети. Когда мы проанализировали 50 лучших маркетинговых веб-сайтов, мы обнаружили, что 72% содержат значки социальных сетей в нижнем колонтитуле.
Вот хороший пример от Рафаля Томала.
10. Виджеты социальных сетей
Некоторые нижние колонтитулы выходят за рамки значка и используют настоящий виджет социальных сетей. Они показывают последнюю публикацию из социальной сети, встроенную прямо в нижний колонтитул.
Это имеет смысл только в том случае, если вы активны в этой сети и придерживаетесь твердых редакционных стандартов в отношении того, чем вы делитесь.
Внимание! Если вы используете такой виджет в нижнем колонтитуле, сообщения в социальных сетях будут появляться на каждой странице вашего сайта. Особенно рискованно, если у вас есть стажер, который ведет ваши каналы в социальных сетях. Как известно, Applebee усвоила этот урок на собственном горьком опыте .
11. Регистрация по электронной почте
Нижний колонтитул веб-сайта стал очень распространенным местом, где посетители могут подписаться. Наше исследование стандартов веб-сайтов показало, что 24% ведущих маркетинговых сайтов имеют поле для подписки в нижнем колонтитуле.
Правда, подписка по электронной почте с большей вероятностью произойдет на странице, где посетитель получил ценность, например, полезный пост в блоге, все же неплохая идея позволить посетителям подписаться из нижнего колонтитула.
Окна подписки в нижнем колонтитуле должны по-прежнему соответствовать передовым методам подписки по электронной почте, предлагая социальное доказательство (сколько человек подписались раньше?) и устанавливая ожидания (что получает подписчик? как часто?).
Одинокое маленькое поле с адресом электронной почты с кнопкой отправки вряд ли будет очень хорошо конвертировать, как этот парень…
12. Логин
Не все посетители являются потенциальными. Некоторые посетители могут быть сотрудниками, партнерами, аффилированными лицами или торговыми посредниками. Если для этих людей есть область входа, нижний колонтитул — лучшее место для нее.
Эти люди часто возвращаются и знают, где найти вещи. Для них не нужно использовать ценную маркетинговую недвижимость в шапке. Небольшая ссылка для входа в нижний колонтитул — это хорошо, как здесь делает ATI.
13. Пресса
Другим типом неперспективы является пресса. На самом деле, только часть 1% ваших посетителей — журналисты и редакторы. Так что не тратьте драгоценное место в основной навигации на пресс-ссылку.
Если кто-то из СМИ все-таки зайдет, он прокрутит вниз и найдет это.
14. Инструмент поиска по сайту
Если они не нашли его в заголовке, в области содержимого или в какой-либо из ссылок в нижнем колонтитуле, инструмент поиска по сайту является наилучшей системой безопасности.
Инструменты поиска не так распространены в нижних колонтитулах веб-сайтов, как формы регистрации по электронной почте, поэтому, если вы их используете, убедитесь, что они четко обозначены.
На веб-сайте Smalley Steel Ring имеется инструмент быстрого поиска продуктов, позволяющий посетителям сразу перейти в каталог с любой страницы.
15. Изображения
Если вы действительно хотите украсить свой нижний колонтитул, добавьте к нему изображение. Это шанс добавить индивидуальности сайту.
Нижний колонтитул Mason-Dixon Knitting содержит изображение Кей и Энн, двух основателей.
16. Мини-галерея
Почему бы не сделать полный педикюр? Вместо одного изображения добавьте целую галерею.
Экспериментальная звуковая студия имеет галерею фотографий в нижнем колонтитуле. Щелчок по фотографии открывает изображение в лайтбоксе.
17. Брендинг
Изображения — еще один шанс укрепить бренд. Это хорошее место, чтобы использовать альтернативную версию вашего знака или использовать свой логотип по-другому.
Веб-сайт Центра изучения природы и человека использует оригинальную версию своего логотипа в нижнем колонтитуле, а заголовок содержит простую, разборчивую текстовую трактовку своего имени.
18. Ваша миссия. Ваши ценности
Логотипы хороши. Но почему бы не рассказать посетителям, почему вы занимаетесь бизнесом? Нижний колонтитул — отличное место, чтобы установить свой флаг и рассказать им, за что вы выступаете.
Нижний колонтитул веб-сайта Better Government Association не только повторяет их миссию, но и показывает влияние, которое они оказали, используя цифры справа. Невозможно не заметить, почему или как они делают то, что делают.
19. Ключевые слова для поисковой оптимизации
Текст в нижнем колонтитуле — это текст на каждой странице. Так что это отличное место, чтобы показать свою релевантность Google. Если вы включаете свою миссию, заявление о ценности или аннотацию «о нас», используйте это как возможность включить свою основную ключевую фразу.
Предупреждение. Текст нижнего колонтитула для поисковой оптимизации годами злоупотреблялся поисковыми оптимизаторами. Вероятно, поэтому Google не придает большого значения ключевым словам SEO в нижних колонтитулах. Так что не переусердствуйте. Просто используйте фразу один раз как текст, а не ссылку, и двигайтесь дальше.
Нижний колонтитул веб-сайта Комиссии по сертификации консультантов по реабилитации содержит их этический кодекс, который включает две наиболее важные ключевые фразы.
20. Награды и сертификаты
Эти маленькие логотипы внушают посетителям доверие. Это форма социального доказательства и мощный способ использовать «эффект ореола». Если вы когда-либо получали награду, добавление логотипа этой награды в нижний колонтитул — это быстрый способ повысить доверие к каждой странице вашего сайта.
Совет: объедините все свои награды, сертификаты и логотипы участников в «ящик доверия».
Компания Nitel завоевала множество наград. Сбор этих логотипов и размещение их вместе в нижнем колонтитуле веб-сайта помогает укрепить доверие в очень конкурентной отрасли.
Сертификаты также сопровождаются логотипами. Вот некоторые из них, которые часто появляются в дизайне нижнего колонтитула.
Сертификаты безопасности для сайтов электронной коммерции
Сертификат BBB для предприятий с местной аудиторией
Сертификаты Adwords для компаний, занимающихся цифровым маркетингом.
Сертификаты GSA для компаний, работающих с государством
Сертификат MWBE для предприятий, принадлежащих меньшинствам и женщинам
Сертификация B-Corp для социально и экологически ответственных предприятий
21.
Членство в ассоциации
Членство имеет привилегии. Одним из них может быть логотип, который можно использовать в нижнем колонтитуле. Торговые палаты, отраслевые ассоциации и даже онлайн-каталоги могут предоставить логотипы, которые хорошо смотрятся в нижнем колонтитуле.
Cookies By Design показывает их ассоциации в правом нижнем углу нижнего колонтитула.
22. Отзывы
Никогда не бывает плохо, чтобы ваши довольные клиенты сказали несколько слов. Включение отзывов в нижние колонтитулы — хороший способ добавить социальное доказательство всему сайту. Вот несколько рекомендаций по использованию отзывов:
Лучшие отзывы поддерживают конкретные маркетинговые заявления страницы, на которой они находятся, поэтому они не добавляются в нижний колонтитул на каждой странице.
Худшее место для размещения отзывов — страница отзывов. Проверьте свою аналитику, посетители просто не посещают эту страницу.
Веб-сайт Jody Michael Coaching содержит отзыв внизу каждой страницы. Он находится прямо над нижним колонтитулом, что позволяет размещать разные отзывы на каждой странице.
23. Последние статьи
Если вы активно занимаетесь контент-маркетингом, вы можете дать своему сайту «пульс», но при этом последний контент будет помещаться прямо в нижний колонтитул.
Институт солнечного топлива делает это на своем веб-сайте вместе с социальным виджетом.
Или вы можете контролировать, какие статьи будут представлены в нижнем колонтитуле. Затем вы можете выбрать те, которые отвечают на общие вопросы посетителей, или те, которые конвертируют посетителей в подписчиков на рассылку новостей с самыми высокими показателями.
24. Предстоящие события
Если вы проводите много мероприятий, нижний колонтитул является хорошим местом для их продвижения, так как все, что в нем, скорее всего, будет видно. Но не добавляйте этот , если у вас всегда есть предстоящее событие , иначе у вас будет дыра в вашей системе безопасности.
25. Видео: Ваше приветственное сообщение
Текст перевешивает изображения. Изображения перевешивают видео. Как правило, видео является наиболее привлекательным форматом для контента. Поэтому, если вы действительно хотите сделать все возможное в нижнем колонтитуле, добавьте видео.
Веб-сайт Marie Forleo в полной мере использует преимущества видео, включая нижний колонтитул с расширенным видео.
26. Аудио: Ваш джингл
Редко, но возможно добавить аудиофайл в нижний колонтитул. Во всяком случае, это, скорее всего, клип, который вы перепрофилируете из другого места, например, из радиоролика.
Веб-сайт Food For Life встраивает в нижний колонтитул небольшой аудиоплеер со своей мелодией. Очаровательный!
27. Один… Последний… Призыв к действию
На каждой маркетинговой странице должен быть призыв к действию. Таким образом, добавление одного из них в нижний колонтитул — это способ убедиться, что он появляется везде. Вы никогда не должны оставлять посетителей в раздумьях, как выполнить желаемое действие.
Веб-сайт Writers Theatre следует рекомендациям для некоммерческих организаций, добавляя заметную кнопку «Пожертвовать» в нижний колонтитул.
Другие идеи дизайна нижнего колонтитула
Вот еще немного вдохновения для разработки нижнего колонтитула вашего следующего веб-сайта.
Цветовые схемы нижнего колонтитула
Обратите внимание, как много примеров выше показывают светлый текст на темном фоне. Инверсия цветов — хороший способ сообщить посетителям, что они внизу, и это начало конца страницы.
Подсказка: предостережение: изменение цветовой схемы (от темного текста на светлом фоне к светлому тексту на темном) в области содержимого страницы. Это может создать «ложное дно», заставив посетителей поверить, что они попали в нижний колонтитул, и, возможно, пропустить остальную часть страницы.
Липкий нижний колонтитул
Точно так же, как навигация может «прилипнуть» к верхней части страницы, независимо от того, как далеко прокручивается посетитель, нижние колонтитулы могут оставаться внизу. Он всегда там, независимо от глубины прокрутки.
Наши друзья из Conversion Sciences используют липкий нижний колонтитул, который всегда виден на каждой странице.
Хотите собственный липкий футер? Используете WordPress? Вот плагин, который создает липкие футеры.
Бесконечная страница… Без нижнего колонтитула!

У каждого веб-сайта есть нижний колонтитул, верно? На самом деле, некоторые новостные и медийные сайты не имеют нижних колонтитулов, потому что на странице нет низа! Страницы просто продолжаются вечно.
Подход «бесконечной страницы» к веб-дизайну просто загружает следующий фрагмент контента, когда посетитель прокручивает страницу вниз. Посмотрите примеры на сайте Quartz или ESPN. Эти сайты никогда не заканчиваются.
Что следует включить в дизайн нижнего колонтитула? Наши рекомендации о том, что включать в нижний колонтитул
Все зависит от целей вашего сайта и потребностей ваших посетителей. Вы крупный сайт электронной коммерции? Много ссылок может быть полезным. Служба поддержки клиентов занята? Добавьте эту информацию туда.
Спросите себя: у посетителей есть важный вопрос, на который нет ответа в шапке? Если это так, добавьте его в нижний колонтитул.
Экспертное мнение: Курт Круз
«Почти все сводится к использованию этой ценной недвижимости для достижения целей вашего сайта. Будьте целеустремленными. Оказаться полезным. Будьте внимательны. Поставьте себя на место пользователя, а затем убедитесь, что он хорошо организован. Дайте им то, что им нужно, но не перегружайте их».

Итак, вот ваши 27 идей дизайна нижнего колонтитула. Но, пожалуйста, не используйте их все, иначе у вас будет самый толстый нижний колонтитул всех времен. Подумайте о своем посетителе и о том, что может зацепить его, прежде чем он попадет в нижнюю часть страницы!
Особая благодарность Курту и Бену за помощь в подготовке этой статьи! Если вы можете вспомнить что-то, что мы пропустили, сообщите нам об этом в комментариях ниже.
Word: верхние и нижние колонтитулы
Урок 16: верхние и нижние колонтитулы
/en/word/columns/content/
Введение
Верхний колонтитул — это раздел документа, который отображается в верхнем поле , а нижний колонтитул — это раздел документа, который отображается в нижнее поле . Верхние и нижние колонтитулы обычно содержат дополнительную информацию, такую как номера страниц , даты , имя автора и сноски , которые могут помочь организовать более длинные документы и облегчить их чтение. Текст, введенный в верхний или нижний колонтитул, появится на на каждой странице документа.

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

Чтобы создать верхний или нижний колонтитул:
В нашем примере мы хотим отображать имя автора вверху каждой страницы, поэтому мы поместим его в верхний колонтитул.
Дважды щелкните в любом месте верхнего или нижнего поля документа. В нашем примере мы дважды щелкнем верхнее поле.
Откроется верхний или нижний колонтитул, и в правой части ленты появится вкладка Design . Точка вставки появится в верхнем или нижнем колонтитуле.
Введите требуемую информацию в верхний или нижний колонтитул. В нашем примере мы напечатаем имя автора и дату.
Когда вы закончите, нажмите Закрыть верхний и нижний колонтитулы . Вы также можете нажать клавишу Esc .
Появится текст верхнего или нижнего колонтитула.
Чтобы вставить предустановленный верхний или нижний колонтитул:
Word имеет множество предустановленных верхних и нижних колонтитулов, которые можно использовать для улучшения дизайна и макета документа. В нашем примере мы добавим предустановленный заголовок в наш документ.
Выберите вкладку Вставка , затем щелкните команду Верхний колонтитул или Нижний колонтитул . В нашем примере мы нажмем команду Заголовок .
В появившемся меню выберите нужный пресет верхнего или нижнего колонтитула .
Появится верхний или нижний колонтитул. Многие предустановленные верхние и нижние колонтитулы содержат текстовые заполнители, называемые полями Content Control . Эти поля удобны для добавления такой информации, как название документа, имя автора, дата и номер страницы.
Чтобы отредактировать поле Content Control, щелкните его и введите нужную информацию .
Когда вы закончите, нажмите Закрыть верхний и нижний колонтитулы . Вы также можете нажать клавишу Esc .
Если вы хотите удалить поле Content Control, щелкните его правой кнопкой мыши и выберите Remove Content Control в появившемся меню.
Редактирование верхних и нижних колонтитулов
После того, как вы закроете верхний или нижний колонтитул, он все еще будет виден, но будет заблокирован . Просто дважды щелкните верхний или нижний колонтитул, чтобы разблокировать его, что позволит вам редактировать его.
Параметры вкладки «Дизайн»
Когда верхний и нижний колонтитулы вашего документа разблокированы, Дизайн В правой части ленты появится вкладка, предоставляющая различные варианты редактирования:
Скрыть верхний и нижний колонтитулы на первой странице : Для некоторых документов вы можете не захотеть, чтобы на первой странице нижний колонтитул, например, если у вас есть титульная страница и вы хотите начать нумерацию страниц со второй страницы. Если вы хотите скрыть верхний и нижний колонтитулы первой страницы, установите флажок рядом с Другая первая страница .
Удалить верхний или нижний колонтитул : Если вы хотите удалить всю информацию, содержащуюся в заголовке, щелкните команду Заголовок и выберите Удалить заголовок в появившемся меню. Точно так же вы можете удалить нижний колонтитул с помощью команды Нижний колонтитул .
Номер страницы : Вы можете автоматически пронумеровать каждую страницу с помощью команды Номер страницы. Просмотрите наш урок о номерах страниц, чтобы узнать больше.
Дополнительные параметры : С помощью команд, доступных в группе «Вставка», вы можете добавить дата и время , информация о документе , изображения и многое другое в верхний или нижний колонтитул.
Чтобы вставить дату или время в верхний или нижний колонтитул:
Иногда полезно включить дату или время в верхний или нижний колонтитул. Например, вы можете захотеть, чтобы в вашем документе отображалась дата , когда он был создан .
С другой стороны, вы можете захотеть показать дату, когда она была напечатана , что вы можете сделать, установив для нее значение автоматически обновлять . Это полезно, если вы часто обновляете и печатаете документ, потому что вы всегда сможете определить, какая версия является самой последней.
Дважды щелкните в любом месте верхнего или нижнего колонтитула, чтобы разблокировать его. Поместите точку вставки в то место, где должны отображаться дата или время. В нашем примере мы поместим точку вставки на строку под именем автора.
Появится вкладка Design . Нажмите Дата и время 9Команда 0377.
Появится диалоговое окно Дата и время . Выберите нужный формат даты или времени .
Установите флажок рядом с Обновлять автоматически , если вы хотите, чтобы дата менялась каждый раз, когда вы открываете документ. Если вы не хотите, чтобы дата менялась, оставьте этот параметр не отмеченным.
Щелкните OK .
Дата появится в заголовке.
Вызов!
Откройте наш практический документ. Если вы уже загрузили наш практический документ, чтобы следовать уроку, обязательно загрузите новую копию, щелкнув ссылку на этом шаге.
Открыть заголовок .
Выберите Align Right на вкладке Home и введите свое имя.
Под своим именем используйте команду Date & Time на вкладке Design и вставьте дату в любом формате.
В секцию нижнего колонтитула вставьте предустановленный нижний колонтитул Сетка . Если в вашей версии Word нет стиля сетки, вы можете выбрать любой доступный стиль.
Закрыть верхний и нижний колонтитулы.
Когда вы закончите, ваша страница должна выглядеть примерно так:
Продолжать
Предыдущий: Столбцы
Далее:Номера страниц
/en/word/page-numbers/content/
Как сделать разные нижние колонтитулы в Word
Microsoft Word упрощает добавление одного и того же нижнего колонтитула на каждую страницу, но что, если вам нужны разные нижние колонтитулы? Узнайте, как сделать разные нижние колонтитулы в Word.
Microsoft Word — мощный инструмент для создания любых документов, будь то письмо, эссе или плакат.
Вы можете настроить каждый раздел своей страницы, от заголовка страницы до верхнего и нижнего колонтитула. Например, вы можете добавлять разные нижние колонтитулы в Word, что позволяет настраивать внешний вид каждой страницы.
Если вы хотите создать разные нижние колонтитулы в Word, выполните следующие действия.
Как сделать нижний колонтитул в Word
Прежде чем вы сможете создавать разные нижние колонтитулы, вам нужно знать, как сделать свой первый нижний колонтитул.
Вот как добавить нижний колонтитул в Word:
Щелкните меню Вставить .
Нажмите Нижний колонтитул .
Выберите стиль нижнего колонтитула, который вы хотите использовать, из предложенных вариантов.
Если вы не хотите использовать какой-либо из стилей нижнего колонтитула, нажмите Изменить нижний колонтитул , чтобы создать собственный пользовательский нижний колонтитул.
Отредактируйте или добавьте текст в нижний колонтитул.
Нажмите Закрыть верхний и нижний колонтитулы или нажмите Esc для выхода.
Теперь ваш нижний колонтитул создан. Если вы хотите отредактировать его, просто дважды щелкните нижний колонтитул.
Как сделать другой нижний колонтитул в Word для первой страницы
Вам может понадобиться другой нижний колонтитул только для первой страницы документа. Например, это может иметь место, если ваш документ включает титульный лист.
Чтобы сделать другой нижний колонтитул в Word для первой страницы:
Щелкните меню Вставить .
Нажмите на Нижний колонтитул .
Выберите стиль нижнего колонтитула, который вы хотите использовать.
Если вы не хотите использовать какой-либо из стилей нижнего колонтитула, нажмите Изменить нижний колонтитул .
Установите флажок Другая первая страница .
Ваш первый нижний колонтитул теперь будет иметь метку Нижний колонтитул первой страницы .
Отредактируйте этот нижний колонтитул, затем нажмите Esc для выхода.
Прокрутите вниз до следующей страницы и дважды щелкните нижний колонтитул.
Отредактируйте этот нижний колонтитул. Это станет нижним колонтитулом для всех страниц, кроме первой.
Нажмите Esc , чтобы выйти (или щелкните мышью за пределами нижнего колонтитула).
Как сделать разные нижние колонтитулы в Word для четных и нечетных страниц
Также можно создавать разные нижние колонтитулы для нечетных и четных страниц. Это может потребоваться, если вы создаете печатный документ с номерами страниц, например, и хотите, чтобы эти номера страниц всегда отображались на свободном краю страницы.
Чтобы создать в Word разные колонтитулы для четных и нечетных страниц:
Нажмите меню Вставить .
Щелкните Нижний колонтитул .
Выберите стиль нижнего колонтитула, который вы хотите использовать.
Если вы не хотите использовать какой-либо из стилей нижнего колонтитула, нажмите Изменить нижний колонтитул .
Установите флажок Разные нечетные и четные страницы .
Ваш первый нижний колонтитул теперь будет иметь метку Нижний колонтитул нечетной страницы .
Отредактируйте этот нижний колонтитул, затем нажмите Esc для выхода. Это станет нижним колонтитулом для всех нечетных страниц.
Прокрутите вниз до следующей страницы и дважды щелкните нижний колонтитул, который будет помечен как Нижний колонтитул четной страницы .
Отредактируйте этот нижний колонтитул. Это станет нижним колонтитулом для всех четных страниц.
Нажмите Esc для выхода.
Как сделать разные нижние колонтитулы в Word для любой страницы
Что делать, если вы хотите иметь несколько разных нижних колонтитулов? Сделать это можно, но немного сложнее.
Вот что нужно сделать:
Щелкните меню Вставить .
Щелкните Нижний колонтитул .
Выберите стиль нижнего колонтитула, который вы хотите использовать.
Нажмите Изменить нижний колонтитул , чтобы изменить любой из них.
Создайте свой первый нижний колонтитул и нажмите Esc для выхода.
Теперь переместите курсор на последнюю страницу, на которой должен появиться этот нижний колонтитул.
Щелкните меню Layout , а затем нажмите Перерывы .
В разделе Разрывы разделов нажмите Следующая страница .
Прокрутите страницу вниз и дважды щелкните нижний колонтитул. Теперь он должен читаться как Нижний колонтитул — Раздел 2-.
Нажмите Ссылка на предыдущий на ленте. Эта кнопка должна быть отключена, чтобы нижние колонтитулы в каждом разделе были разными.
Отредактируйте нижний колонтитул и нажмите Esc для выхода.
Повторите шаги 5–9 выше, чтобы создать столько разных нижних колонтитулов, сколько хотите.
Создание пользовательских документов Word
Используя описанные выше шаги, вы сможете создавать различные нижние колонтитулы для своих документов Word.
Чем больше вы знаете о Word, тем больше вы можете заставить его делать то, что вы на самом деле хотите, а не то, что, по его мнению, вы от него хотите. Например, вы можете изменить шрифт всего документа Word, чтобы исправить любые нежелательные изменения шрифта. Также полезно знать, как настроить отступы маркеров или нумерованных списков в Word, когда ваше форматирование начинает идти наперекосяк.
Взгляните на эти 10 основных советов по работе с Microsoft Word, чтобы узнать больше.
Связанные элементы: Hero, Office, word
Вставить верхний или нижний колонтитул
Разметка страниц
Справка и обучение Word
Разметка страниц
Разметка страниц
Вставьте верхний или нижний колонтитул
Изменить поля
Статья
Создавайте колонки новостей
Статья
Изменить ориентацию страницы на альбомную или портретную
Статья
Добавить границу на страницу
Статья
Вставьте верхний или нижний колонтитул
Статья
Вставьте номера страниц
Статья
Вставить разрыв страницы
Статья
Вставить оглавление
Статья
Следующий: Вставка таблиц, изображений и водяных знаков
Word для Microsoft 365 Word для Microsoft 365 для Mac Word для Интернета Word 2021 Word 2021 для Mac Word 2019 Word 2019 для Mac Word 2016 Word 2016 для Mac Word 2013 Word 2010 Word 2007 Word для Mac 2011 Word Starter 2010 Дополнительно. .. Меньше
Перейти к Вставить > Верхний колонтитул или Нижний колонтитул .
Выберите стиль заголовка, который хотите использовать.
Совет: Некоторые встроенные макеты верхних и нижних колонтитулов содержат номера страниц.
Добавить или изменить текст для верхнего или нижнего колонтитула. Дополнительные сведения о том, что можно делать с верхними колонтитулами, см. в разделе Изменение существующих верхних и нижних колонтитулов. Чтобы отредактировать уже созданный верхний или нижний колонтитул, дважды щелкните его.
Чтобы удалить заголовок (например, удалить его на титульном листе), выберите его и установите флажок Другая первая страница .
Выберите Закрыть верхний и нижний колонтитулы или нажмите Esc для выхода.
Для удаления выберите Вставить > Верхний колонтитул (или Нижний колонтитул ) > Удалить верхний колонтитул (или Удалить нижний колонтитул ).
Добавить стандартный или настраиваемый верхний или нижний колонтитул
org/ListItem»>
Перейти к Вставить > Верхний колонтитул или Нижний колонтитул .
Выберите из списка стандартных верхних или нижних колонтитулов, перейдите к списку вариантов Верхний или Нижний колонтитул и выберите нужный верхний или нижний колонтитул.
Или создайте свой собственный верхний или нижний колонтитул, выбрав Изменить верхний колонтитул или Изменить нижний колонтитул .
Когда вы закончите, выберите Закрыть верхний и нижний колонтитулы или нажмите Esc.
Важно: Office для Mac 2011 больше не поддерживается . Перейдите на Microsoft 365, чтобы работать где угодно с любого устройства и продолжать получать поддержку.
Обновить сейчас
На вкладке Макет в разделе Вид щелкните Макет страницы .
На вкладке Макет в разделе Параметры страницы щелкните Верхний и нижний колонтитулы .
Выберите из списка стандартных верхних или нижних колонтитулов, перейдя во всплывающее меню Верхний или Нижний колонтитул и щелкнув нужный верхний или нижний колонтитул.
Или создайте свой собственный верхний или нижний колонтитул, нажав Настроить верхний колонтитул или Настроить нижний колонтитул и следуя инструкциям.
Примечание. При настройке верхнего или нижнего колонтитула вы можете добавить изображения, номера страниц, дату, время, имя листа, имя файла и путь к нему и многое другое.
Перейти к Вставить > Верхний и нижний колонтитулы .
Добавить текст верхнего или нижнего колонтитула.
Используйте меню Параметры для дополнительной настройки.
Чтобы выйти, выберите Закрыть верхний и нижний колонтитулы или нажмите Esc .
Чтобы удалить, выберите Вставить > Заголовок (или Нижний колонтитул ) > Удалить верхний колонтитул (или Удалить нижний колонтитул ).
Дополнительные сведения о верхних и нижних колонтитулах см. в разделе Верхние и нижние колонтитулы в Word.
(Архив) Microsoft Word 2003: Создание верхних и нижних колонтитулов
Последнее обновление Понедельник, 31 августа 2020 г., 10:35
Эта статья основана на устаревшем программном обеспечении.
Вы можете создавать верхние и нижние колонтитулы в документе Word, чтобы такая информация, как имя автора, название документа или номера страниц, отображалась в верхнем и/или нижнем поле документа. Вы можете создать верхний и нижний колонтитулы, которые отображаются одинаково на каждой странице, или настроить страницы с разными верхними и нижними колонтитулами.
Панель инструментов верхнего и нижнего колонтитула
Панель инструментов Верхний и нижний колонтитулы содержит кнопки для функций, которые вы будете часто использовать при работе с верхними и нижними колонтитулами в документе. Кнопки описаны здесь.
.
Кнопка Функция
Вставляет Автотекст , запись для экономии времени, состоящая из аббревиатуры и связанной с ней фразы. Дополнительные сведения см. в разделе Работа с автотекстом
Вставляет номер страницы, вставляет количество страниц и форматирует номера страниц
Вставляет дату и время
Отображает диалоговое окно Page Setup и показывает или скрывает текст документа
Делает верхний или нижний колонтитул таким же, как в предыдущем разделе
Переключение между верхним и нижним колонтитулом, отображение предыдущего верхнего или нижнего колонтитула и отображение следующего верхнего или нижнего колонтитула
ПРИМЕЧАНИЕ. Предыдущий и следующий параметры актуальны, когда документ разделен на разделы.
Закрывает Верхний и нижний колонтитулы вид
Создание универсального верхнего и нижнего колонтитула
Если вы хотите, чтобы на каждой странице отображались одни и те же верхний и нижний колонтитулы, создайте универсальный верхний и нижний колонтитулы. Используя кнопки, расположенные на панели инструментов Верхний и нижний колонтитулы , вы можете вставить номер страницы, дату или время в верхний и/или нижний колонтитулы.
ПРИМЕЧАНИЕ. Чтобы вставить часто используемые поля в верхний или нижний колонтитул, см. раздел Вставка автотекста в верхний и нижний колонтитулы ниже.
Поместите точку вставки в любом месте документа
В меню View выберите Верхний и нижний колонтитулы
Появится панель инструментов Верхний и нижний колонтитулы .
В заголовке введите и отформатируйте нужную информацию
Нажмите ПЕРЕКЛЮЧЕНИЕ МЕЖДУ ВЕРХНИМ И НИЖНИМ колонтитулом
В нижнем колонтитуле введите и отформатируйте нужную информацию
Чтобы закрыть панель инструментов Верхний и нижний колонтитулы и вернуться к документу, нажмите ЗАКРЫТЬ
Создание другого верхнего и нижнего колонтитула первой страницы
Вы можете создать верхний и нижний колонтитулы первой страницы, содержащие другую информацию, чем верхний и нижний колонтитулы в остальной части документа.
Поместите точку вставки на первую страницу документа
В меню View выберите Верхний и нижний колонтитулы
Появится панель инструментов Верхний и нижний колонтитулы .
Щелкните НАСТРОЙКА СТРАНИЦЫ
Появится диалоговое окно Page Setup .
Выберите Макет Вкладка
В разделе Верхние и нижние колонтитулы выберите Другая первая страница
Нажмите ОК
В Заголовке первой страницы введите и отформатируйте нужную информацию
Щелчок ПЕРЕКЛЮЧЕНИЕ МЕЖДУ ВЕРХНИМ И НИЖНИМ колонтитулами
В нижнем колонтитуле первой страницы введите и отформатируйте нужную информацию
Чтобы создать верхний и нижний колонтитулы для остальной части документа, щелкните ПОКАЗАТЬ СЛЕДУЮЩИЙ
В заголовке введите и отформатируйте нужную информацию
Щелчок ПЕРЕКЛЮЧЕНИЕ МЕЖДУ ВЕРХНИМ И НИЖНИМ колонтитулами
В нижнем колонтитуле введите и отформатируйте нужную информацию
Чтобы закрыть панель инструментов Верхний и нижний колонтитулы и вернуться к документу, нажмите ЗАКРЫТЬ
Создание четных и нечетных верхних и нижних колонтитулов
Если вам нужно по-разному выровнять информацию или включить другую информацию в верхние и нижние колонтитулы нечетных и четных страниц, вы можете создать верхние и нижние колонтитулы нечетных и четных страниц. Вы также можете создать другую первую страницу, а также верхние и нижние колонтитулы нечетных/четных страниц в одном документе.
Поместите точку вставки на первую страницу документа
В меню View выберите Верхний и нижний колонтитулы
Появится панель инструментов Верхний и нижний колонтитулы .
Щелкните НАСТРОЙКА СТРАНИЦЫ
Появится диалоговое окно Page Setup .
Выберите Макет Вкладка
Под Верхние и нижние колонтитулы , выберите Различные нечетные и четные
ДОПОЛНИТЕЛЬНО: Создайте другой верхний и нижний колонтитулы первой страницы
Нажмите ОК
В Заголовке нечетной страницы введите и отформатируйте нужную информацию
Щелчок ПЕРЕКЛЮЧЕНИЕ МЕЖДУ ВЕРХНИМ И НИЖНИМ колонтитулами
В нижнем колонтитуле Odd Page введите и отформатируйте нужную информацию
Нажмите ПОКАЗАТЬ СЛЕДУЮЩИЙ
В Заголовке четной страницы введите и отформатируйте нужную информацию
Нажмите ПЕРЕКЛЮЧЕНИЕ МЕЖДУ ВЕРХНИМ И НИЖНИМ колонтитулом
В нижнем колонтитуле четной страницы введите и отформатируйте нужную информацию
Чтобы закрыть панель инструментов Верхний и нижний колонтитулы и вернуться к документу, нажмите ЗАКРЫТЬ
Вставка автотекста в верхние и нижние колонтитулы
С помощью команды Вставить автотекст в Word вы можете быстро и легко добавлять такие элементы, как имя файла, имя автора и дату сохранения, в верхние и нижние колонтитулы без использования многочисленных пунктов меню.
В меню View выберите Верхний и нижний колонтитулы
Появится панель инструментов Верхний и нижний колонтитулы .
Поместите точку вставки в область верхнего или нижнего колонтитула, куда вы хотите вставить Автотекст
На панели инструментов Верхний и нижний колонтитулы щелкните ВСТАВИТЬ АВТОТЕКСТ » выберите нужный Автотекст опция
Чтобы закрыть панель инструментов Верхний и нижний колонтитулы и вернуться к документу, нажмите ЗАКРЫТЬ
Эта статья была полезной? Да Нет
Просмотр/печать PDF
3 элемента, которые должны быть на всех веб-сайтах, а также то, как
Контент Themeisle является бесплатным. Когда вы покупаете по реферальным ссылкам на нашем сайте, мы получаем комиссию. Узнать больше
Нижний колонтитул вашего сайта едва ли не самый гламурный его раздел. Спрятанные внизу каждой страницы, легко упустить из виду другие, более заметные элементы. Тем не менее, неспособность тщательно спроектировать нижний колонтитул WordPress означает упустить некоторые ключевые возможности взаимодействия.
Нижний колонтитул на самом деле является важным инструментом, по-своему столь же важным, как и заголовок вашего сайта. Он обеспечивает «шапку» для вашего контента и прекрасную возможность предложить ключевую информацию вашим посетителям. Простой, но продуманный нижний колонтитул может принести большую пользу вашему сайту.
В этом посте мы немного подробнее поговорим о том, почему так важен нижний колонтитул WordPress. Затем мы дадим несколько советов, как сделать его максимально эффективным. Давайте взглянем!
Почему нижний колонтитул WordPress является неотъемлемой частью вашего сайта
Простой, но эффектный футер идеально дополнит дизайн вашего сайта.
Когда дело доходит до написания статьи, сообщения в блоге или аналогичного письменного контента, вы, вероятно, хорошо понимаете важность введения и заключения. Первый дает читателям предварительный взгляд на ваш контент и то, о чем он, а второй дает важное резюме и последний шанс привлечь их внимание и заинтересовать.
Мы поднимаем этот вопрос, потому что может быть полезно подумать о своем веб-сайте таким же образом. Заголовок, меню и другие элементы верхнего уровня вашего сайта образуют его «введение», и может возникнуть соблазн сосредоточить на них все свои усилия. Тем не менее, ваш нижний колонтитул — или «заключение» — так же важен. На самом деле, многие посетители остаются вовлеченными вплоть до нижней части каждой страницы.
Другими словами, нижний колонтитул представляет собой сводную информацию о вашем веб-сайте в целом. Собирая самые важные детали в одном месте, вы создаете эффективное окончание своего контента и предоставляете посетителям место, где они могут легко найти то, что им нужно.
Три совета по созданию нижнего колонтитула вашего веб-сайта
Итак, как же создать эффективный нижний колонтитул WordPress? Хотя вы не хотите, чтобы ваш сайт был шаблонной версией любого другого сайта, есть некоторые общие и важные элементы, которые следует учитывать независимо от того, что вы создаете. Давайте рассмотрим три наиболее важных совета по созданию качественного футера.
В настоящее время большинство тем используют виджеты для нижнего колонтитула WordPress, поэтому вы должны иметь возможность добавлять эти элементы с помощью обычных виджетов WordPress. То есть перейти к Внешний вид → Виджеты на панели инструментов WordPress и добавьте новые виджеты в нижний колонтитул. В этом посте более подробно объясняется, как использовать виджеты.
1. Включить контактную информацию
Для многих веб-сайтов контактная информация является одной из важнейших функций. Как еще клиенты будут задавать вопросы о вашем бизнесе электронной коммерции или читатели вашего блога WordPress будут делиться своими идеями и пожеланиями? Упрощение контакта с людьми является ключом к созданию аудитории, повышению конверсии и многому другому.
Это настолько важно, что на большинстве веб-сайтов есть целая страница, посвященная обмену контактными данными. Мы рекомендуем сделать это и на вашем собственном сайте. Тем не менее, вы также можете рассмотреть возможность добавления информации (или хотя бы ее части) в раздел нижнего колонтитула:
.
В конце концов, ваша страница контактов, скорее всего, будет найдена с помощью меню где-то в начале каждой страницы. Нижний колонтитул, с другой стороны, — это последнее, что видят посетители после прокрутки страницы продукта, прочтения сообщения в блоге и так далее. Немедленно предоставьте им контактную информацию после того, как они закончат просмотр вашего контента, — это разумный шаг, чтобы побудить их немедленно связаться с вами.
Есть несколько способов сделать это. Конечно, вы можете просто предложить ссылку на свою контактную страницу. Однако это легко пропустить, поэтому мы рекомендуем указать хотя бы несколько конкретных сведений, таких как ваш физический адрес, адрес электронной почты и номер телефона.
Кроме того, вы также можете рассмотреть возможность встраивания контактной формы в нижний колонтитул WordPress:
Контактная форма займет немного больше места в нижнем колонтитуле, но может стать ценным дополнением, если у вас недостаточно информации для включения в раздел. Более того, когда вы используете такой инструмент, как Contact Form 7, размещение формы в нижнем колонтитуле так же просто, как и в любом другом месте вашего сайта.
2. Создайте раздел «ключевые ссылки»
Мы не можем переоценить важность четкой и функциональной навигации для успеха вашего сайта. В любом случае жизненно важно, чтобы посетители знали, как передвигаться, и могли быстро и легко найти то, что им нужно.
Вы, несомненно, заметили, как много сайтов содержат ссылки в нижних колонтитулах — это настолько распространено, что ваши посетители могут ожидать этого. Если они прокрутят вниз до раздела нижнего колонтитула в поисках помощи в навигации, вы не хотите их разочаровывать. Вот почему разумно включить специальный раздел для ключевых ссылок в футере:
Чтобы сделать это хорошо, вам нужно:
Подумайте, какие самые важные ссылки на вашем сайте. Пространство в нижнем колонтитуле ограничено, поэтому вы должны придерживаться страниц верхнего уровня и важных разделов — мест, куда посетители, скорее всего, пойдут.
Разбейте эти ссылки на несколько разделов. Это отличный способ составить краткую полезную «карту» вашего сайта. Например, вы можете перечислить все страницы с основной информацией о вашей компании в одном разделе, а все ваши услуги в другом.
Помимо преимуществ удобства использования, этот подход также может помочь вам направить ссылочный вес на ключевой контент, что является важной частью WordPress SEO.
3. Включите призыв к действию (CTA)
CTA вашего сайта — это элемент, который сообщает посетителям, какое именно действие вы хотите, чтобы они предприняли, и предоставляет простые средства для этого. Это может быть кнопка «Купить сейчас», подписка на список адресов электронной почты или даже форма регистрации членства.
CTA настолько важны, что вам следует тщательно продумать их размещение. Они должны быть заметными, и вы не хотите использовать слишком много (чтобы не приставать к посетителям и не перегружать их слишком большим количеством опций). Тем не менее, было бы неплохо использовать ваш основной CTA пару раз на вашем сайте.
Как вы, наверное, догадались, мы рекомендуем вам разместить последний призыв к действию в нижнем колонтитуле WordPress. В конце концов, этот раздел — ваш последний шанс привлечь внимание ваших посетителей и побудить их к действию:
Вот несколько советов по разработке эффективного призыва к действию нижнего колонтитула:
Сделайте его максимально простым и минималистичным. Это не загромождает нижний колонтитул, облегчает поиск CTA и не оставляет сомнений в том, что посетитель должен делать.
Убедитесь, что люди действительно могут выполнять нужные действия внутри самого нижнего колонтитула. Не предлагайте им совершить покупку или подписаться на список рассылки и не ожидайте, что они прокрутят до вашего основного CTA, чтобы сделать это. Вместо этого вставьте кнопку призыва к действию, ссылку или форму прямо в нижний колонтитул.
Самое главное, мы настоятельно рекомендуем размещать не более одного CTA в нижнем колонтитуле вашего сайта.