10.08.2016
Источник: pixabay.com
Когда вы думаете о крутом веб-дизайне, вы, вероятно, думаете о домашней странице веб-сайта, или блоге, или странице со списком продуктов компании.
Как насчёт страницы «Обратная связь»?
Слишком многие дизайнеры сайтов ставят заботу о страницах с контактами в хвост списка своих задач. Подумайте о том, насколько много страниц с контактной информацией выглядят так, будто были созданы в 90-е. Даже если остальная часть сайта смотрится красиво и регулярно обновляется.
Друзья, это огромная ошибка. Страница «Свяжитесь с нами» является одной самых важных для вас, у большинства компаний она — самая посещаемая. Задумайтесь над этим. И, давайте попробуем выделить — что общего у «правильных» страниц с контактами.
• Они объясняют, почему кто-то должен хотеть связаться с вами, и описывают, как можно решить проблемы посетителей сайта.
• Содержат электронный адрес и номер телефона, так что посетители могут быстро найти нужную информацию.
• Содержат форму с полями для контактов посетителей, чтобы хозяин страницы мог понять, кто хочет связаться с ним.
• На них есть призыв к действию, удерживающий людей на сайте — и дающий им другой вариант, если они не хотят заполнять форму.
• Отображают идеи компании, без разницы — с помощью ли ссылок на свежие записи в блоге или статьи о ней в СМИ.
• Содержат ссылки на аккаунты компании в соцсетях (Twitter, Facebook, Instagram, LinkedIn), что даёт посетителям ещё один путь для взаимодействия с бизнесом.
• Перенаправляют на страницу с отзывами клиентов, где можно увидеть, когда и как вы можете связаться с посетителями.
Хотите немного вдохновения? Мы с помощью Hubspot выбрали 12 примеров классных страниц с контактами. Взгляните на них сами — и подумайте о том, какие из этих идей вы можете использовать для оформления собственной страницы.
1. Tune
О достоинствах страницы контактов Tune можно говорить очень долго: красивый дизайн, призывы к действию, четко выделенная контактная информация, форма для отзывов посетителей, которые сразу хотят оформить конкретные запросы.
Но что нравится больше всего — их приветливость. Фразы «Мы здесь, чтобы помочь! и «Спрашивайте нас в любое время, будем счастливы ответить на ваши вопросы» помогают посетителям чувствовать, что о них заботятся. Многие страницы контактов по-деловому холодны, но чем более дружественной вы делаете свою страницу, тем лучше чувствуют (и реагируют!) на это посетители. В конце концов, вы должны хотеть, чтобы они связались с вами, так что помогите им захотеть строить отношения.
2. Achieve3000
Как у многих компаний, у Achieve3000 хватает клиентов различного типа, которые заходят на их сайт — и поводы, по которым эти люди хотят связаться с фирмой, самые разнообразные. Потому они решили отказаться от однообразного подхода ко всем запросам.
Красивые пиктограммы предлагают клиентам три варианта решения их проблем: демо-версию, консультацию в отделе продаж и беседу со службой онлайн-поддержки. Каждый из вариантов ведёт к отдельной странице, пример вы можете видеть ниже. Отличный способ для решения самых разных проблем посетителей сайта!
3. Choice Screening
Сдавайтесь, лучшего варианта страницы «Обратная связь» вы не найдёте. Здесь прекрасно всё, начиная с восхитительного призыва «Поговорите с человеком» в заголовке.
Хорошо структурированная страница с контактной информацией, включающей электронный адрес каждого из отделов компании, форма обращения — пожалуй, даже слишком детальная, но это, видимо, облегчает им обработку всех запросов. Задумайтесь, когда будете решать, какие формы опросов нужны вам, что для вас важнее — число запросов или удобство их обработки. Чем больше у вас альтернатив для приёмов запросов, тем более сложную форму вы можете себе позволить.
4. Atlas 1031 Exchange
На первый взгляд, контактная страница Atlas 2031 Exchange — не самая привлекательная среди конкурентов. Но если всмотреться внимательнее, то вы поймёте, насколько тут продуман каждый аспект страницы «Обратная связь» — и прежде всего функциональность.
На странице подробно рассказано, как обрабатываются запросы: «Мы невероятно быстро реагируем на ваши обращения и ценим их». Там есть чёткий список того, на что могут рассчитывать клиенты после обращения, в том числе обещание обязательного ответа в течение 12 часов. Также на странице удобная для чтения контактная информация, линки на аккаунты в соцсетях и даже список сообщений, недавно опубликованных в блоге. Отлично сделано.
5. Morroni
Давайте будем честны … в наши дни, большинство людей предпочло бы заполнить форму, а не общаться по телефону с кем-то. При выборе того, о чём спрашивать людей, убедитесь, что выбираете вопросы, которые помогут именно вашим клиентам понять, как связаться с вами — и помогите понять, зачем им это.
Конечно, некоторые люди всё ещё предпочитают нажимать кнопки телефона, потому дайте им контактный номер. И оцените хорошую идею с вопросом, помогающим отличать людей от ботов: «Как у вас с математикой? 2+6 = ?»
6. Dubsat
«Как мы можем вам помочь?»
Это классический вопрос в обслуживании клиентов — и если вы думаете так же, то контактная страница вроде как неплохое место, чтобы предложить отличное обслуживание клиентов?
Посмотрите, как в Dubsat оформили страницу с контактами. Красивое изображение, простой вопрос и выпадающее меню, помогающее детализировать запрос. Хотите поговорить о продажах – одна форма, хотите поддержку касательно одной из конкретных услуг от компании – другая.
При этом в Dubsat нашли нестандартный способ показа общей контактной информации. Вы видите картинки городов, где у них есть офисы, а при наведении мышки на один из городов изображение превращается в показ конкретного места на карте и другой необходимых данных. Очень красиво и умно.
7. Pixpa
Вы будете удивлены, сколько страниц «Свяжитесь с нами» не включают в себя призыв к действию. Хотя основная цель таких страниц — помочь людям войти в контакт с вашей компанией. Всегда найдутся те, кто попадут на страницу и не будут хотеть заполнять форму – и вот тут призыв к действию и будет уместен.
Это может быть что-то простое, например, кнопка, нажав которую, они попадут в ваш блог. Или возможность увидеть ваш продукт, загрузить инструкцию по использованию, посмотреть видео – вам решать. Парни из Pixpa выбрали вариант с размещением внизу контактной страница возможности загрузить бесплатную пробную версию своего продукта. Попробуйте наш продукт и можете сразу пообщаться с отделом продаж – эта схема работает.
8. PeopleMetrics
Иногда самый простой подход является и самым лучшим. Страница с контактами PeopleMetrics не засорена, на ней всё просто и понятно, что делать. В компании знают, что большинство людей, попадающих на эту страницу, ищут простой и удобный способ связи, потому не перегружают страницу элементами дизайна.
Для того, чтобы сделать жизнь людей еще проще, в компании дали возможность клиентам использовать аккаунты Facebook или Google Apps. Плюс нельзя не отметить ироничное обращение: «Чувствуете, формализм? Заполните форму, и мы пообщаемся с вами».
9. Legalia
Ещё одна страница обратной связи с простым и функциональным дизайном. Вся информация, которую вы должны знать, в том числе и короткая форма, собрана вместе, так что нет ощущения перегруза. Прекрасный способ добиться этого – сделать так, чтобы фото здания офиса превращалось в план местности, где находится этот самый офис.
Кстати, стоит отметить небольшую, но важную деталь для компании, которые работают с клиентами из-за границу. Посмотрите, как в Legalia дали возможность выбрать префикс для кода своей страны перед тем, как использовать контактный номер телефона. Многие люди игнорируют это, а зря, ведь это очень полезно для ваших зарубежных коллег и клиентов.
10. Elluminati
Товарищи из Elluminati выдвинули на первый план возможность найти себя, начиная с того, что поместили на страницу встроенную карту Google Maps, прямо на которой можно менять масштаб. Это полезно для всех, в том числе для пользователей мобильных устройств.
И это тот редкий случай, когда белый текст хорошо выглядит на контрасте с фоном. Так же не можем не отметить изящное решение с кнопками соцсетей, которые подсвечиваются при наведении на них курсора мыши.
11. Weifield Group Contracting
В связи с продолжающимся ростом трафика просмотра сайтов со смартфонов очень важно, чтобы все страницы вашего сайта, включая страницу обратной связи, хорошо отображались на экранах мобильных.Для них надо упрощать навигацию, делая формы короткими и понятными, а кнопки с призывами к действию большими, чтобы можно было нажать одним пальцем.
Контактная страница The Weifield Group – отличный пример того, что нужно. Оцените их версию для компьютеров, а затем для смартфонов – и обратите внимание, как они адаптировали всё под работу с мобильных устройств.
Версия для компьютеров.
12. Survicate
Контактная страница Survicate – ещё один пример сочетания эффектной простоты и дружеского общения с клиентом. Прекрасный призыв «Давайте поговорим о вашем проекте». Разговорный вариант такого рода сразу располагает посетителей к бренду, заставляет чувствовать себя более близкими с вашей компанией.
Сама форма проста, с большими полями и кнопками с призывами к действию, что делает удобной и мобильную версию. Чуть ниже выложена вся контактная информация — адрес офиса, номер телефона, адрес электронной почты, часы работы и т.д. — так, чтобы было легко воспринимать необходимое. И, наконец, очень продуманное решение сделать кнопку с призывом к действию того же цвета, что и логотип компании. Простой штрих, который делает дизайн более привлекательным и завершённым визуально.
К этому вы и должны стремиться.
К этому вы и должны стремиться.