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

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

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

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

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

5.

Посетители ожидают найти контактную информацию в правом верхнем углу заголовка. Это стандарт веб-дизайна. Также стандартно найти ссылку «контакт» в правом нижнем (или в центре) нижнего колонтитула.

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

1. Отправку формы легко отслеживать как выполнение цели в Analytics.
2. Посетитель не может находиться на компьютере, который он использует для электронной почты.
Формы
3. отправляют посетителей на страницы с благодарностью, которые могут предоставить больше сообщений и призывов к действию.
Формы
4. отправляют посетителям электронные письма с автоматическим ответом, опять же, больше сообщений и призывов к действию.
5. Forms может сохранять отправленные материалы в базу данных на случай, если электронная почта не будет доставлена.
6. Forms можно подключить к автоматизации маркетинга и другим системам.
В формах
7. можно задавать конкретные вопросы и направлять заявки конкретным людям в зависимости от ответов.
8. Ссылки электронной почты являются магнитом для спама.

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

На этом веб-сайте есть отличный копирайтинг, но контакт был бы лучше, чем ссылка по электронной почте.

6.Адрес и ссылка на карту / Как добраться

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

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

7.

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

8.

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

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

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

Вот несколько источников идей для навигации по нижнему колонтитулу:

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

9.

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

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

Вот хороший пример от Рафаля Томала.

10.

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

Это имеет смысл только в том случае, если вы активны в этой сети и имеете твердые редакционные стандарты в отношении того, чем вы делитесь.

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

11. Регистрация по электронной почте

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

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

в нижнем колонтитуле должны по-прежнему соответствовать лучшим методам подписки по электронной почте, предлагая социальное подтверждение (сколько уже подписывалось раньше?) И устанавливая ожидания (что получает подписчик? Как часто?)

Одинокий маленький ящик с адресом электронной почты с кнопкой отправки, скорее всего, не очень хорошо конвертируется, как этот парень…

12. Авторизация

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

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

13. Нажмите

Другой тип неперспективов — это пресса. Реально, только часть 1% ваших посетителей — журналисты и редакторы. Так что не тратьте драгоценное место в основной навигации на ссылку для прессы.

Если кто-то из СМИ все же зайдет к вам, они прокрутят вниз и найдут его.

14. Инструмент поиска по сайту

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

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

На веб-сайте Smalley Steel Ring есть инструмент быстрого поиска продуктов, помогающий посетителям сразу перейти в каталог с любой страницы.

15.Изображения

Если вы действительно хотите украсить нижний колонтитул, добавьте к нему изображение. Это шанс добавить сайту индивидуальности.

В нижнем колонтитуле Mason-Dixon Knitting есть изображение Кей и Энн, двух основателей.

16.

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

Experimental Sound Studio есть галерея фотографий. Щелчок по фотографии вызывает изображение в лайтбоксе.

17. Брендинг

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

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

18. Ваша миссия. Ваши ценности

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

The Better Government Association не только повторяет их миссию, но и показывает, какое влияние они оказали, используя цифры справа. Невозможно упустить из виду, почему и как они делают то, что делают.

19. Ключевые слова для поисковой оптимизации

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

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

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

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

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

ProTip: объедините все свои награды, сертификаты и логотипы членства в «ящик доверия».

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

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

• Сертификаты безопасности для сайтов электронной торговли
• Сертификат BBB для предприятий с местной аудиторией
• сертификатов Adwords для компаний цифрового маркетинга.
• сертификатов GSA для компаний, работающих с государством
• Сертификация MWBE для предприятий, принадлежащих меньшинствам и женщинам
• Сертификат B-Corp для социально-ответственного бизнеса

21.

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

Cookies By Design их ассоциации отображаются в правом нижнем углу нижнего колонтитула.

22. Отзывы

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

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

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

23. Последние статьи

Если вы занимаетесь контент-маркетингом, вы можете дать своему сайту «импульс», но разместив последний контент прямо в нижнем колонтитуле.

Solar Fuels Institute делает это на своем веб-сайте вместе с социальным виджетом.

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

24. Предстоящие события

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

25. Видео: Ваше приветственное сообщение

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

Веб-сайт Marie Forleo полностью использует возможности видео, включая улучшенный нижний колонтитул.

26. Аудио: Your Jingle

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

Веб-сайт Food For Life встраивает в футер небольшой аудиоплеер с их джинглом. Очаровательный!

27. Один… последний… Призыв к действию

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

Веб-сайт Writers Theater следует передовым практикам для некоммерческих организаций, добавляя заметную кнопку «Пожертвовать» в нижний колонтитул.

Другие идеи дизайна нижнего колонтитула

Вот еще немного идей для создания нижнего колонтитула вашего следующего веб-сайта.

Цветовые схемы нижнего колонтитула

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

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

Липкий нижний колонтитул

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

Наши друзья из Conversion Sciences используют липкий нижний колонтитул, который всегда виден на каждой странице.

Хотите свой собственный липкий нижний колонтитул? Используете WordPress? Вот плагин для создания липких нижних колонтитулов.

Бесконечная страница… Без нижнего колонтитула!

У каждого веб-сайта есть нижний колонтитул, верно? На самом деле, на некоторых новостных и медийных сайтах нет нижних колонтитулов, потому что у них нет нижней части страницы! Страницы продолжаются вечно.

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

Что следует включить в дизайн нижнего колонтитула? Наши рекомендации относительно того, что включать в нижний колонтитул

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

Задайте себе вопрос: есть ли у посетителей важный вопрос, на который нет ответа в заголовке? Если да, добавьте его в нижний колонтитул.

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

Особая благодарность Курту и Бену за их помощь в исследовании этой статьи! Если вы думаете о чем-то, что мы упустили, дайте нам знать в комментариях ниже.

20 лучших дизайнов нижних колонтитулов веб-сайтов для вдохновения в 2020 году

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

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

• Что такое нижний колонтитул веб-сайта?
• Что должно быть в нижнем колонтитуле сайта?

Часть 1: Что такое нижний колонтитул веб-сайта?

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

Как правило, нижний колонтитул дает два преимущества, которые улучшают ваш веб-сайт:

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

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

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

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

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

Сделайте это простым и понятным: Вы должны сохранить все контент организован и приятен для глаз.

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

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

Часть 2: Рекомендации по дизайну нижнего колонтитула веб-сайта

Создание функционального и красивого нижнего колонтитула на самом деле требует много работы. Прежде чем начать, вам нужно подумать над некоторыми вещами: что должно быть в вашем нижнем колонтитуле? Чего НЕ ДОЛЖНО быть в нижнем колонтитуле? .

Итак, что должно быть в нижнем колонтитуле веб-сайта?

Эти три раздела содержания необходимы для любого веб-сайта. Они необходимы для правовой защиты.

Авторские права : Год и символ авторского права защитят ваш сайт от плагиата.

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

Условия использования: Предлагает общие правила и рекомендации, регулирующие использование сайта и / или продуктов.

Хотите, чтобы ваши посетители могли связаться и стать вашими клиентами? Тогда обязательно предложите им простые способы связи с вами. Наиболее распространенные способы связи:

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

Адрес электронной почты: Электронная почта по-прежнему остается одним из популярных способов развития бизнеса и общения.

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

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

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

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

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

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

Войти: Где ваши посетители могут войти с помощью электронной почты

Подписка: Где ваши посетители могут подписаться на информационные бюллетени

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

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

События: Поделитесь вехами и важными событиями прошлого, а также предстоящими.

Логотип: Разместите свой логотип в нижнем колонтитуле для брендинга.

Галерея: Вставьте мини-галерею ваших участников.

Награды: Продемонстрируйте свои награды.

Часть 3–20 Лучшие примеры дизайна нижнего колонтитула веб-сайта

1. Griflan Design Inc.

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

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

2. Chron

Chron — одна из крупнейших газет в США. В его уникальном дизайне нижнего колонтитула веб-сайта отсутствуют столбцы по вертикали, но вместо этого используется горизонтальная структура и макет для отображения содержимого.Как и большинство газетных сайтов, Chron предлагает несколько вариантов подписки, предоставляя пользователям свободу выбора.

3. Awwwards

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

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

4. Bluestag

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

5. WPBeginner

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

6. Orbitmedia

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

7. Random ize

Random утверждает, что это самый случайный сайт в сети. Он специализируется на рандомизации разных вещей.Дизайн нижнего колонтитула сильно отличается от стандартного и почти достигает размера полного экрана. Он подчеркивает мощь социальных сетей, таких как Facebook и Twitter.

8. Lifehacker

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

9. Фэндом

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

10. Wix

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

11. Mozilla

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

12. Isitwp

Интернет-сообщество isitwp на тему WordPress имеет очень функциональный нижний колонтитул. Он отображает личность бренда с хорошо написанным текстом: «Бесплатный онлайн-ресурс, который предлагает учебные пособия, инструменты, обзоры продуктов и другие ресурсы WordPress, которые помогут вам создать лучший веб-сайт WordPress.”Ссылки на сайты содержат раскрывающееся меню, чтобы указать, куда вы хотите перейти. Кроме того, в нижнем колонтитуле добавлена ​​юридическая информация, такая как авторское право, РЕДАКЦИОННОЕ ПРИМЕЧАНИЕ и ОТКАЗ.

13. Arduino

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

14. Roblox

Roblox — игровая платформа, и ее нижний колонтитул подчеркивает различные магазины приложений, где пользователи могут загрузить приложение.

15. Hook

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

16. Stacksocial

Stacksocial — это веб-сайт, который помогает клиентам по всему миру находить удивительные продукты. В нижнем колонтитуле указано специальное предложение для новых клиентов — скидка 10% для новых подписок.Это делает его привлекательным для тех, кто впервые зашел на сайт и решил совершить покупку.

17. Doogee

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

18. Lorealparisusa

L’Oréal Paris — ведущая компания по оказанию комплексной косметической помощи со штаб-квартирой в Париже, Франция. При прокрутке вниз вы увидите доступные предметы роскоши с подробной информацией. Дизайн нижнего колонтитула его веб-сайта также впечатляет, отражая его миссию превосходства в красоте. Справа находится большая область, которая побуждает пользователей подписаться на последние новости о красоте, образцы продуктов и купоны. В нижних колонтитулах содержится дополнительная полезная информация.

19.Sephora

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

20. Макияж

Макияж — это веб-сайт, на котором вы можете разделить образы из сферы красоты. Его нижний колонтитул полностью противоположен Sephora. Тонкий черный шрифт без засечек на белом фоне придает ему более женственный вид.

Часть 4: Дополнительные советы по дизайну нижнего колонтитула веб-сайта

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

Вопрос 1. Как шаг за шагом создать хороший нижний колонтитул?

Если вы хотите начать с самого начала, следуйте этим советам:

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

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

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

Передача разработчикам и разработчикам: превратите свои визуальные эффекты в настоящие веб-страницы.

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

Мы также настоятельно рекомендуем это видео YouTube: Как создать полностью настраиваемый нижний колонтитул веб-сайта с помощью elementor.

Вопрос 2: Чего не должно быть в нижнем колонтитуле веб-сайта?

1. Чрезмерная оптимизация для SEO: Google будет знать, что вы используете методы черной шляпы SEO.

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

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

Вопрос 3. Нужен ли нижний колонтитул веб-сайту?

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

Сайты, которые могут использовать бесконечную страницу: Сайты новостей и СМИ.

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

Вопрос 4: Что такое нижний колонтитул?

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

В заключение

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

29+ примеров нижних колонтитулов веб-сайтов и почему они так хорошо работают

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

Что интегрировать в нижний колонтитул веб-сайта?

Во-первых, давайте посмотрим, какие элементы следует интегрировать в нижний колонтитул веб-сайта. Рассмотрите один или несколько пунктов из перечисленных ниже и тщательно решите, что включить в нижний колонтитул вашего сайта. Исследования показали, что улучшение нижнего колонтитула веб-сайта может привести к увеличению конверсии на 23,77%.
Мы возьмем эти элементы один за другим:

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

Уведомление об авторских правах обычно включает символ © (символ авторского права), год публикации и имя правообладателя.

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

Условия использования могут быть принудительно исполнены с помощью методов обзора и переноса по клику. Метод browsewrap подразумевает включение Условий обслуживания через ссылку в нижнем колонтитуле веб-сайта.Однако метод clickwrap относится к размещению условий обслуживания в формах, то есть когда пользователи пытаются создать учетную запись. Когда они нажимают «Отправить», они также должны согласиться с условиями обслуживания этого сайта.

• Контакты, адрес и время работы

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

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

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

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

Нижний колонтитул темы «Загипнотизированный»

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

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

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

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

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

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

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

Нижний колонтитул, созданный с помощью темы «Загипнотизация»

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

Что вдохновляет нижний колонтитул вашего сайта?

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

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

Источник: https://www.awwwards.com/

• Продолжить навигацию по сайту

Иногда нижний колонтитул может быть настолько интригующим, что не отпускает пользователя. Он предлагает ему / ей продолжить навигацию по сайту и найти ответ на ключевой вопрос: нравится ли мне этот сайт? Что вы думаете об этом:

Источник: https://www.awwwards.com/

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

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

• Чувство принадлежности к сообществу

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

Источник: https://www. awwwards.com/

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

Нижний колонтитул, созданный с помощью темы «Загипнотизация»

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

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

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

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

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

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

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

Demicreative.com содержит простой призыв к действию, когда приглашает пользователей «Привет нам». За приглашением следуют адрес электронной почты и номер телефона, чтобы люди могли «рассказать о своем бренде». Синий фон обнадеживает и профессионален, сглаживая то, как эти люди могут начать сотрудничество с Demicreative.

Bluestag.co.uk также имеет четкий призыв к действию «Наймите нас», за которым следует контактная информация. Номер телефона и адрес электронной почты кликабельны и упрощают процесс связи для всех, кто склонен «нанимать» Bluestag.co.uk.

Socialtriggers.com содержит более очевидный призыв к действию. Традиционная кнопка CTA является выдающейся — в нижнем колонтитуле веб-сайта своим расположением и ярким цветом.

Дизайн электронной почты.beefree.io — еще один пример нижнего колонтитула с призывом к действию. После просмотра веб-страницы люди более склонны выбирать услуги, которые предоставляет компания. Вот почему кнопка с надписью «Перейти в редактор Bee Mail» предлагает людям попробовать услуги компании, даже если они находятся в нижнем колонтитуле веб-сайта.

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

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

Карта сайта и ссылки в центре нижнего колонтитула

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

Нижний колонтитул, созданный с помощью темы «Загипнотизация»

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

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

Нижний колонтитул, ориентированный на авторские права и использование

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

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

На сайте Architecturaldigest.com есть более подробный параграф о пользовательском соглашении и политике конфиденциальности.Размещение информации составляет двухуровневый нижний колонтитул, поскольку правила веб-сайта представлены в виде своего рода нижнего колонтитула.

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

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

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

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

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

Хорошим примером этого является Mashable.com:

Собрать все вместе

Нижний колонтитул веб-сайта нельзя игнорировать. Согласно исследованиям и различным исследованиям, это благоприятное место для увеличения конверсии. В зависимости от типа веб-сайта и целей каждой страницы нижний колонтитул может включать различные элементы, используемые посетителями. Единственное, что вам нужно сделать, это выбрать ПРАВИЛЬНЫЕ элементы для размещения в нижнем колонтитуле веб-сайта и организовать их в соответствии с чистой структурой, удобной для просмотра и извлечения выгоды.

10 дизайнов нижних колонтитулов веб-сайтов, которые вы захотите скопировать

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

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

Создавайте нижние колонтитулы с Justinmind, которые заставят ваших пользователей спешить обратно!

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

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

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

Почему вы должны вкладывать время в нижний колонтитул

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

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

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

Для большинства веб-сайтов желаемый эффект нижнего колонтитула:

• Удерживать аудиторию как можно дольше
• Повысьте вероятность возврата пользователями
• Сделайте компанию более запоминающейся
• Оценка дополнительных лидов

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

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

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

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

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

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

Кроме того, это может быть возможность перейти к сути и продемонстрировать конкретный обзор контента, предлагаемого на веб-сайте.

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

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

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

Лучшие практики дизайна нижнего колонтитула веб-сайта

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

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

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

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

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

Следите за взглядом пользователей

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

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

В случае англоговорящих людей исследование горизонтального внимания, проведенное Nielsen Norman Group, показывает, что средний пользователь тратит около 80% своего времени на просмотр контента в левой половине экрана. Это исследование подчеркивает важность учета языка при прогнозировании того, на какую часть экрана пользователи будут смотреть в первую очередь.

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

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

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

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

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

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

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

Теперь мы знаем, о чем вы, возможно, думаете: разве не хорошо позволить им продвигать веб-сайт, даже если это произойдет до того, как у них появится возможность просмотреть все его содержание? Да, но похоже, что большинство пользователей привыкли с помощью ментальных моделей находить значки социальных сетей рядом или на нижнем колонтитуле.
По данным Orbit media, 72% ведущих маркетинговых веб-сайтов включают свои социальные иконки в дизайн нижнего колонтитула.

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

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

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

Поисковая оптимизация

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

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

Наполнение ключевыми словами означает перегрузку контента сайта популярными словами. Вы, вероятно, имели несчастье столкнуться с этим в какой-то момент — Google считает это спамом и наказывает сайты, которые это делают!

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

Почему? Потому что он будет виден на каждой странице, и вам нужно только один раз добавить его в дизайн нижнего колонтитула вашего сайта!

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

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

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

Также удобен контактный номер телефона, а еще лучше — кнопка CTA, чтобы сразу набрать номер!

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

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

Наконец, мы бы сказали, что нажимать кнопки необходимо на случай, если кто-то из СМИ захочет связаться с вашей компанией.

Однако, по данным Orbit Media Studios, менее 1% трафика веб-сайта — это пресса, желающая связаться с ними, поэтому вам не следует тратить для этого ресурсы своего основного веб-сайта на кнопки.Угадайте, где прекрасное место — дизайн нижнего колонтитула вашего сайта!

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

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

Electronic group Valaire отличный дизайн нижнего колонтитула и отличный веб-сайт.Как и на обычных веб-сайтах музыкальных групп, они предлагают такой контент, как видео, музыку, даты турне и товары группы.

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

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

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

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

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

The New York Times не может быть лучшим примером веб-сайта с большим количеством контента, но при этом не беспокоящимся нижнего колонтитула.Им удалось организовать большое количество категорий в сжатую и легко читаемую карту сайта в дизайне нижнего колонтитула своего веб-сайта.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Создание отличного дизайна нижнего колонтитула веб-сайта включает анализ следующих аспектов вашего веб-сайта:

• Какой тип контента доступен на вашем сайте?
• Как организована информационная архитектура вашего сайта?
• Кто целевые пользователи вашего сайта?
• Какую информацию они с большей вероятностью будут искать при посещении?

Подводя итог, вы должны задать себе следующие вопросы: «Как я могу сделать информацию в дизайне нижнего колонтитула моего веб-сайта максимально актуальной?» и «сколько информации — это слишком много?» Ответьте на них, и вы уже на пути к победителю!

13 уникальных примеров дизайна нижних колонтитулов веб-сайтов

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

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

Почему дизайн нижнего колонтитула имеет значение

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

Нижний колонтитул означает лучшую навигацию

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

Нижние колонтитулы веб-сайтов содержат релевантную информацию

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

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

Нижний колонтитул — последний призыв к действию

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

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

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

13 уникальных дизайнов нижних колонтитулов веб-сайтов

Ознакомьтесь с этими 13 веб-сайтами, которые создают правильный дизайн нижних колонтитулов.

1. Avo

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

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

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

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

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

2. Дизайн клады

Эта домашняя страница дизайнерской фирмы Clade Design, полная контрастных форм, захватывающих микровзаимодействий и радостной палитры цветов, отличается необычным творческим подходом.

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

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

3. Обозначения

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

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

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

4. Think32

Нам всегда нравятся специализированные маркетинговые агентства. Сосредоточенность — это сильная стратегия выделиться среди конкурентов.

Think32 из Австралии — маркетинговое агентство для стоматологических кабинетов. Стоматологические изображения тонкие, с общим дизайном, спроектированным в стиле современной стилизации, который воспользуется любым высокопроизводительным агентством. Мы уверены, что 9 из 10 веб-дизайнеров и стоматологов согласятся с этим.

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

5. Голограмма

Hologram предоставляет предприятиям все необходимое для подключения их технологий к сотовым сетям.Будь то электросамокаты, дроны или датчик на промышленном оборудовании, голограммы и SIM-карты, которые они производят, помогают предприятиям объединить свои технологии.

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

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

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

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

Ссылки по теме: WordPress для Webflow: как Hologram модернизировал свой веб-сайт

6. Сообразительный

Видите ли вы что-нибудь знакомое с этим двухуровневым нижним колонтитулом ниже? (Подсказка: посмотрите последнюю запись.) Следите за обновлениями … это снова появится. Но давайте перейдем к нижнему колонтитулу от Savvy.

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

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

7. Астра

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

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

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

8. Fiddler Labs

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

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

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

9. Стрелки из латуни

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

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

10. Vectornator

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

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

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

11. Hi5

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

Левая часть кнопок стопки нижнего колонтитула дает вам возможность загрузить приложение в Google Play, WhatsApp, Apple App Store и в других местах. Благодаря темно-синему цвету эти кнопки невозможно пропустить, что делает их центром футера.

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

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

12. Аппасавр

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

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

13. Flowbase

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

Нижний колонтитул может быть началом пути к покупке

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

Дизайн нижнего колонтитула веб-сайта: что включать и чего избегать

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

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

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

Почему нижний колонтитул важен?

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

Однако исследование Chartbeat показало, что посетители тратят больше времени, чем вы ожидаете, прокручивая средний веб-сайт, при этом многие просматривают контент, который был примерно на 1200 пикселей вниз или примерно на 2 экрана вниз, если экран высотой 700 пикселей.

Кроме того, некоторые бренды наблюдали увеличение конверсии до 50%, когда они оптимизировали дизайн нижнего колонтитула своего веб-сайта с учетом конкретных целей.

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

Smart Insights зафиксировала рост дохода на одного клиента на 16%, когда они протестировали нижний колонтитул с более удобным управлением.

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

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

Что включить в дизайн нижнего колонтитула вашего веб-сайта

При выборе дизайна нижнего колонтитула вашего веб-сайта необходимо учитывать три основных фактора:

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

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

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

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

Карта сайта

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

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

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

• Что собрано
• Как хранится
• Как это можно использовать

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

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