UX или опыт взаимодействия: руководство для начинающих
![](https://static.wixstatic.com/media/72c0b2_229a11fd54884a0fad8546724dd466bf~mv2.png/v1/fill/w_51,h_29,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/72c0b2_229a11fd54884a0fad8546724dd466bf~mv2.png)
Нет ничего хуже, чем зайти на сайт и обнаружить битые ссылки, непонятные тексты и отсутствие малейшего намека на контактную информацию. Такие «сурьезные шедевры» не годятся никуда. Да, сайт может быть чертовски красивым и необычным, но если человеку неудобно им пользоваться, ваши усилия идут насмарку.
В процессе работы хороший дизайнер всегда думает о «user experience» или, если по-русски, опыте взаимодействия пользователя с сайтом. Этот опыт должен быть положительным, а значит, нужно продумать каждую мелочь — от цвета до навигации и всего остального.
Предлагаем не отставать от опытных коллег, разобраться в вопросе досконально и понять, как сделать удобный для пользователя ресурс.
![UX или опыт взаимодействия: руководство для начинающих](https://static.wixstatic.com/media/72c0b2_e5b0e3e293f24ee4a1f98a6d73658e75~mv2.png/v1/fill/w_65,h_40,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/72c0b2_e5b0e3e293f24ee4a1f98a6d73658e75~mv2.png)
Продумайте алгоритм работы сайта
Прежде чем засесть за клавиатуру, нарисуйте на бумаге макет будущего сайта и подумайте, как он должен работать. Навигацию удобно проектировать с помощью клейких листочков, помечая цветами элементы, повторяющиеся на каждой странице. Сделав это, вы поймете, какой шаблон вам нужен на самом деле, и выберете не самый красивый, а наиболее подходящий по структуре и функционалу. Имейте в виду, что в Wix все можно настроить так, как вам захочется.
![Продумайте макет сайта хорошенько, чтобы вашим пользователям не пришлось гадать, где найти нужную информацию.](https://static.wixstatic.com/media/72c0b2_1262af19200543f4906ffa801f51b23e~mv2.png/v1/fill/w_65,h_33,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/72c0b2_1262af19200543f4906ffa801f51b23e~mv2.png)
Проверьте, хорошо ли читается текст
Текст на сайте должен легко читаться — это закон. А как у вас? Воспользуйтесь специальной функцией редактора Wix и устройте «пользовательское тестирование» — покажите сайт друзьям и выслушайте, что они скажут. Взгляд со стороны бывает очень полезен, ведь когда долго над чем-то работаешь, глаз замыливается.
Несколько общих правил оформления текста:
Используйте шрифт 12-14 размера и не делайте слишком длинные строки. 13 слов — это максимум.
Все шрифты должны сочетаться друг с другом, и их не должно быть много.
Если вы выбрали светлый фон, то шрифт должен быть темным, и наоборот.
Все, что задумано кликабельным, должно выглядеть кликабельным (например, используйте подчеркивание).
![Читабельность мать порядка.](https://static.wixstatic.com/media/72c0b2_effce7dc635444178d209b0194a6759e~mv2.png/v1/fill/w_65,h_45,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/72c0b2_effce7dc635444178d209b0194a6759e~mv2.png)
Главное должно быть видно сразу
На сайте есть область, которую пользователь видит ровно в тот момент, когда попадает на страницу и не прокручивает ее вниз. В оффлайн-мире это называется «Верхняя половина полосы» — та часть газеты, в которой находятся самые важные новости, чтобы читатели замечали их в первую очередь. Несмотря на то, что большинство людей обычно все-таки прокручивает страницу до конца, особо важную информацию лучше помещать именно в верхней части сайта.
Что считать важной информацией:
Контакты
Кнопки соцсетей
Логотип
Поисковую панель
Заглавное изображение
![Важная информация должна быть на виду.](https://static.wixstatic.com/media/72c0b2_32f2c378d7a9413c9e660ca9cb9f66ce~mv2.jpg/v1/fill/w_117,h_72,al_c,q_80,usm_0.66_1.00_0.01,blur_2,enc_auto/72c0b2_32f2c378d7a9413c9e660ca9cb9f66ce~mv2.jpg)
Выдерживайте стиль
Ваш сайт должен восприниматься как часть полноценного бренда. Самый простой способ достичь
этого — выбрать «свои» цвета и работать с ними. Сайт, оформленный подобным образом, выглядит убедительно и производит хорошее впечатление на пользователей. Принципы стилевого единства распространяются на текст хедера, заголовки, кнопки и меню. Вообще, почаще спрашивайте себя: «Насколько это в духе моего бренда? Поймет ли пользователь, что ему делать»? Если ответ «да», значит, все правильно.
![Соблюдайте единство стиля на всех маркетинговых материалах.](https://static.wixstatic.com/media/72c0b2_4fe66669bbb64667821c951a63f6ec4f~mv2.png/v1/fill/w_65,h_45,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/72c0b2_4fe66669bbb64667821c951a63f6ec4f~mv2.png)
Не морочьте людям голову
Сайт может быть оформлен гениально, но достаточно одной неработающей ссылки, чтобы испортить благоприятное впечатление. Если пользователь нажимает на ссылку и попадает в тупик — это серьезная ошибка. Следующие правила помогут вам избежать ее:
Внимательно проверьте все ссылки перед публикацией (и после).
Делайте так, чтобы при клике страница открывалась в новой вкладке.
Если у вас есть страница регистрации или всплывающие окна, добавьте на них кнопки «Вернуться на главную» или «Зарегистрироваться попозже».
![Не заводите ваших пользователей в тупик.](https://static.wixstatic.com/media/72c0b2_a7332bd8a4334a6fa9a8d1a5c5d5a532~mv2.png/v1/fill/w_65,h_43,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/72c0b2_a7332bd8a4334a6fa9a8d1a5c5d5a532~mv2.png)
Сделайте мобильную версию
Ни для кого не новость, что люди все чаще пользуются смартфонами и планшетами, чтобы найти нужную информацию в интернете (не так давно мы выяснили, что Google уделяет этому особое внимание). Это значит, что пришла пора заняться мобильной версией своего сайта — чем раньше, тем лучше. Проверьте, как ваш сайт выглядит на маленьком экране, перенесите контакты в верхнюю часть страницы и подсократите тексты. Пользователи Wix могут легко адаптировать свои сайты под просмотр с мобильных устройств с помощью специального редактора Mobile, не внося изменений в исходную десктоп-версию.
![Мобильная версия: что нравится Google?то понравится и вашим пользователям.](https://static.wixstatic.com/media/72c0b2_ad26501c641747d981e8c36642e99426~mv2.png/v1/fill/w_65,h_45,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/72c0b2_ad26501c641747d981e8c36642e99426~mv2.png)
Подумайте о дополнительной пользе
Присутствие в интернете — это не только сайт, но еще страницы в соцсетях, почтовые рассылки и разные дополнительные приложения. Все эти инструменты — неотъемлемая часть вашего взаимодействия с пользователями, поэтому их тоже нужно проработать:
В шаблоны Wix кнопки соцсетей встроены по умолчанию, от вас требуется только поменять ссылки, чтобы они вели на ваши страницы.
Верстая рассылку в Wix ShoutOut, старайтесь, чтобы оформление письма соответствовало общему стилю сайта, используйте те же цвета и элементы.
Добавьте на сайт полезные приложения: календарь событий, форму для ответа на приглашения, подписку на рассылку, раздел с отзывами и т.д. Они положительно влияют на опыт взаимодействия, а люди охотно и с удовольствием пользуются функционалом сайта.
Ну как, готовы применить знания на деле? Зайдите в свой аккаунт и оптимизируйте опыт взаимодействия с посетителями. Если у вас еще нет своего сайта на Wix, никогда не поздно начать. Откройте один из наших бесплатных шаблонов в редакторе, и создайте свой неповторимый сайт.