Skip to content

Как создается хорошая страница контактов

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

Важность хорошей страницы обратной связи

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

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

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

Размещение

Первый шаг — расположение вашей контактной информации. Нет никакой пользы в странице контактов, если посетители не могут ее найти.

Вообще говоря, контактную информацию можно найти в двух местах:

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

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

Подвал также является популярным местом для контактной информации. Он может содерживать ссылку на страницу контактов:

Ссылка на страницу связи у Apple в "подвале"
Ссылка на страницу связи у Apple в «подвале»

Или полную контактную информацию с формой или без:

Hubspot показывает свой адрес и номер телефона
Hubspot показывает свой адрес и номер телефона

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

Содержание страницы контактов

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

E-mail адрес или форма связи

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

Адрес

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

Телефон

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

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

Многие веб-сайты начинают добавлять кнопки социальных сетей на контактные страницы. Тем более, что все больше и больше компаний предлагают поддержку клиентов через Twitter (иногда даже 24/7).

Компания Envato имеет очень активный канал помощи в Twitter
Компания Envato имеет очень активный канал помощи в Twitter

Вы на карте

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

contact-us-4

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

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

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

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

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

Используйте HTML5 и специальные атрибуты и типы полей. Если в форме пользователь должен ввести e-mail, для этого поля надо использовать соответствующее поле. Много полезной информации для форм вы сможете найти в уроках серии «Неделя HTML5»:

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

Еще неплохо для полей формы добавить пояснение в теге <label>, чтобы по клику на нем соответствующее поле получало фокус.

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

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

Завершение

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

contact-us-5
contact-us-6
contact-us-7

Источник: Webdesign Tuts+