Молчание веба, примеры качественных звучащих сайтов, советы от Facebook и многое другое
Пользователю всегда важно, чтобы интерфейс давал обратную связь. Например, чтобы кнопка на сайте выделялась при нажатии, а около отправленного сообщения в WhatsApp или Telegram появлялись галочки.
Один из инструментов обратной связи — звуки. Грамотное звуковое сопровождение может сказать нам не меньше, чем иконка или картинка. Тогда почему в веб-интерфейсах звуки встречаются редко? В этой статье мы подробно поговорим на эту тему и расскажем, что делать, если вы все-таки решили использовать звуки.
Где мы встречаемся со звуками чаще всего
Именно в мобильных и компьютерных приложениях, а также в интерфейсе ПК мы слышим звуки постоянно.
Сами по себе звуки в интерфейсах нужны и важны, но стоит разделять типы интерфейсов, которые могут позволить себе их издавать. В мобильных или десктопных приложениях они вполне оправданы. Там звуки улучшают обратную связь с интерфейсом программ. На мобильных телефонах и в системном интерфейсе компьютера существует разделение типов звука, а также разделение их уровня громкости. Есть три группы: звуки мультимедиа, куда входят музыка и видео, звуки уведомлений и звуки интерфейса или системные.
Звуки интерфейса — это аудиосигналы взаимодействия с приложениями компьютера или телефона. Они сообщают о выполнении какой-либо команды пользователя или дают «говорящий» звуковой ответ. Например, что лента социальной сети обновилась, электронный ящик чист от спама, а товар успешно добавлен в корзину.
Звуки уведомлений или предупреждений часто называют earcons. Это так называемые «звуковые иконки» (от англ. ear — ухо и icon — иконка). Earcons привлекают внимание пользователя к важным событиям, например, сообщают об ошибках в написании слов или садящейся батарейке ноутбука.
Элементы мультимедиа могут играть роль контента или создавать особенную, запоминающуюся атмосферу на сайте и отдельных его страницах.
Гармоничное сочетание звуков часто становится визитной карточкой бизнеса. Неповторимой звуковой айдентикой. То есть узнавать компанию могут не только по фирменному логотипу, упаковке или цветам, а еще и по звукам.
Те, кто давно пользуются техникой Apple, должны помнить знаменитую тройку — сигнал включения Mac (Startup Mac QuadraAV), щелчок затвора камеры и Sosumi. Все они были созданы Джимом Риксом, бывшим сотрудником компании. Sosumi — это до мажор на синтезаторе, а звук камеры скопирован с самого обычного фотоаппарата.
Кстати, щелчок камеры — «говорящий» сигнал. Для интерфейсов эта характеристика важна, ведь пользователь сразу понимает цель и сообщение, которое передает звук.
Почему веб привык молчать
Sosumi — это хороший пример успешного использования звука в компьютерном интерфейсе. Однако в вебе таких примеров практически нет и вот почему.
На ноутбуке или смартфоне пользователь может легко отрегулировать громкость системных звуков или вовсе их отключить. При желании — оставить только вибро-отклик для сообщений и звонков. Таким образом, мы настраиваем нужный уровень громкости для каждой группы и привыкаем к этому уровню.
Здесь мы сталкиваемся с первой проблемой. К сожалению, невозможно отдельно регулировать громкость звуков в веб-интерфейсах, поскольку они являются не системными, а мультимедийными. Таким образом, если вставить на сайт видео с Youtube, оно будет проигрываться с той же громкостью, что и звуки нажатия кнопок. Пользователю это не понравится.
Вторая проблема — в отличии от программ на телефоне или компьютере, сайтов существует бесконечное количество. При этом каждый день один юзер может посещать с десяток разных порталов.
К звукам программ на ноутбуке или телефоне мы можем привыкнуть, если часто ими пользуемся. Однако постоянно перестраивать свое восприятие на новом сайте крайне сложно и раздражает. Ведь если бы каждый сайт использовал свою палитру сигналов, то в день вы бы слышали десятки вариаций только одного звука нажатия кнопки. Это раздражает, поэтому звуки в веб-интерфейсах практически не используются.
А если веб-интерфейс рассчитан на людей с ограниченными возможностями?
За стандарты разработки веб-интерфейсов для людей с ограниченными возможностями отвечает WCAG (Web Content Accessibility Guidelines). Согласно WCAG, доступный сайт — это надежный, понятный и легко управляемый ресурс, который спокойно воспринимают люди с разными особенностями здоровья.
Для серфинга всемирной сети незрячие люди пользуются функциями вроде talkback. Она позволяет прослушать текстовую информацию с экрана смартфона. Можно пролистать сообщения на Facebook или прослушать свежие новости. Кроме того, распространены скринридеры, которые озвучивают написанное на экране. Все эти дополнения уже создают плотный звуковой фон для пользователя.
Людям с ограниченными возможностями звуки в вебе будут скорее мешать, нежели помогать. Они неприемлемы по тем же причинам, что и для других юзеров. Однако тут добавляется гигантская проблема: если зрячий человек услышал звук ошибки, нажимая на кнопку, и понял, что это за кнопка, то незрячий человек не увидит этой кнопки. Для таких людей невозможно провести ассоциативный ряд действий/откликов на веб-сайтах из-за их обилия. Также незрячие люди пользуются инструментами диктовки текста. Если использовать звуки на сайтах, то им будет сложнее воспринимать информацию со считывающих устройств.
Если вы все-таки решили добавить звук, то
В первую очередь, необходимо задуматься, действительно ли звуки нужны, и трезво оценить цель сайта. Для лендингов, интернет-магазинов или продуктовых сайтов звуки — ненужная мишура. Они будут отвлекать пользователя от покупок.
Если ваша цель — заставить человека приобрести товар, а не закрыть вкладку как можно скорее, то автоматическое проигрывание фоновой музыки использовать не следует. Мода на нее ушла из интернета еще 20 лет назад.
Однако в некоторых случаях звуковое сопровождение может стать изюминкой сайта. Если вы решили пойти по этому пути, то необходимо помнить о комфорте пользователей.
Звуки приемлемы в веб-интерфейсах промо-сайтов, а еще в тех, случаях, когда нужно впечатлить пользователя. Например, они будут эффектным дополнением сайта музыкальной группы. При этом всегда должны быть уведомления, которые заранее, в экране загрузки, сообщают, что используются звуки и лучше надеть наушники. Таким образом, если у вас на сайте есть звуки, то пользователя нужно к этому подготовить. Продолжая серфить портал, он фактически соглашается играть по вашим правилам.
Следуя такому принципу, взаимодействие с веб-интерфейсом можно превратить в увлекательное и атмосферное приключение. Создать на сайте целую интерактивную историю, где звук будет гармоничным дополнением красивой картинки. Еще один вариант — записать авторское аудиосообщение. Сделать это можно в специальных сервисах вроде портала Reverb. Кстати, здесь также можно создать аудиосопровождение для обучающих сайтов. Например, для порталов по изучению иностранного языка, где аудирование — неотъемлемая часть программы.
В случае музыкальных групп, использовать звуки в веб-интерфейсах действительно проще. Большая часть посетителей таких площадок — поклонники, которые не прочь лишний раз послушать любимые песни. Поэтому на сайтах часто создают разделы с интерактивными элементами и аудио-оформлением. Например, на портале The Rolling Stones вы найдете вкладку Experience. Прочитав название, пользователь уже мысленно ожидает от раздела какого-то экшена, который в итоге получает.
Звуки создадут особую атмосферу даже на сайтах крупных ритейлеров. Пример — площадка о спортсменах Decathlon. Анимация, и музыка, которую пользователь может включить при желании, создает ощущение просмотра кино о жизнях реальных людей. Подобную киноисторию можно посмотреть на сайте, который рассказывает о Грете Тунберг. Материалы об экоактивистке собраны в виде таймлайна с разными этапами ее жизни. Посетители могут прокручивать ленту под аудиосопровождение — комментарии самой Греты и различных экспертов.
Главная особенность всех этих веб-интерфейсов — пользователь всегда готов к саунд-сопровождению. Где-то на сайте есть специальная иконка, которую можно нажать для прослушивания звука, где-то пользователя предупреждают, что нужно надеть наушники, где-то это понятно из контекста. Создатели порталов заботятся о комфорте юзера, поэтому звуки не вызывают негативной реакции.
Кроме того, во всех случаях использование звука подчиняется правилам. Один из вариантов таких правил предложил директор по саунд-дизайну в Facebook Уилл Литтлджон. Он обращает внимание на мобильные версии приложений, однако многие его рекомендации отлично подойдут и для десктопа.
Он рекомендует
- Выбирать простые решения. Лучше отдавать предпочтения звукам с простым ритмом и тоном, мягким и ненавязчивым. Помимо этого, звук должен гармонично вписываться в общий функционал страницы.
- Следить за сочетаемостью звуков. Важно следить за тем, чтобы они формировали единую систему с гармоничным звучанием.
- Всегда помнить о цели звука. Проанализируйте, в каких случаях звук может действительно дополнить опыт; пользователя, а в каких — испортить впечатление. Для человека звук должен быть полезным.
- Выбирать «говорящие» звуки. Так пользователю будет проще проникнуться нужным настроением и понять, что произошло.
В итоге
В веб-интерфейсах звуки не нужны, а вот в мобильных и десктопных приложениях их использование оправдано. Здесь разделяют три группы сигналов: звуки мультимедиа, уведомлений и интерфейса. Первые играют роль контента, вторые предупреждают о различных событиях, а третьи дают обратную связь.
На сайтах звуки не используются по нескольким причинам. Во-первых, невозможно отдельно регулировать их громкость в веб-интерфейсах. Во-вторых, если каждый сайт будет иметь свою палитру сигналов, то пользователю будет трудно постоянно перестраивать свое восприятие. Людям с ограниченными возможностями звуки будут мешать по тем же причинам. Кроме того, обилие саунд-эффектов не позволит им свободно пользоваться инструментами чтения с экрана.
В некоторых случаях музыка может дополнить user experience. Например, если сайт интерактивный и рассказывает какую-то историю. Кроме того, если пользователь вынужден проводить на нем много времени. Аудиосигнал напомнит юзеру о вашем сайте, когда нужная команда будет выполнена. При этом всегда должны быть уведомления, которые заранее, в экране загрузки, сообщают, что используются звуки и лучше надеть наушники.