Чем простые сайты лучше остальных?
Более того «типичные» сайты с простым для восприятия дизайном были оценены, как наиболее привлекательные по всем параметрам.При изучении сотрудниками Google в августе 2012, исследователи обнаружили не только то, что пользователей привлекают сайты, загрузка которых займет 0,02–0,05 секунды, но также то, что «сложные для восприятия» сайты соответственно расцениваются как менее привлекательные, чем их более простые копии.
Более того «типичные» сайты - те, которые содержат компоненты, в целом связанные с сайтами этого уровня – с простым для восприятия дизайном были оценены, как наиболее привлекательные по всем параметрам.
Другими словами при изучении выяснилось, что чем проще оформление, тем лучше.
Но почему?
В этой статье, мы рассмотрим, почему что-то вроде когнитивной беглости и теории зрительной обработки информации может играть решающую роль в упрощении вашего веб-проекта и как более простой дизайн мог бы привести к большим обращениям.
Мы также рассмотрим несколько случайных исследований сайтов, в которых упростили оформление, и то, как это улучшило частоту обращений к ним, также дадим несколько намеков, как упростить ваше собственное дизайн.
Что такое «типичный» веб-сайт?
Если бы я сказал «мебель», какой образ всплыл бы в вашей голове? Если вы относитесь к 95% людей, вы думаете о стуле. Если я спрошу какой цвет символизирует «мальчик» вы думаете «голубой», девочка = розовый, автомобиль = седан, птица = малиновка и т.д.
«Типичный» - это фундаментальное мысленное отражение, которое создает ваш мозг для того, чтобы классифицировать все с чем вы взаимодействуете. От мебели до веб-сайтов ваш мозг создал шаблон того, как следует видеть и воспринимать объекты.
«Типичный» сайт разбивается на меньшие категории. У вас есть отличающийся, но определенный мысленный образ для социальных сетей, мест электронной комерции и блогов – и если любой из тех особых веб-сайтов упускает что-то из вашего мысленного образа вы отвергаете его на сознательном и подсознательном уровнях.
Если бы я сказал «Интерактивный интернет-магазин одежды для модных 20 – «неважно чего»», то вы могли бы предположить что-то подобное:
Из этого следует, что «интерактивный магазин одежды» отпечатывается в сознании настолько близко, что отражает множество признаков схожих с оформлением онлайн магазина одежды для хип-хопа.
Ни один не испытывает недостатка в оригинальности, и маловероятно то, чтобы они «крали» друг у друга. Вместо этого они играют вашими первоначальными ожиданиями того, каким должен быть коммерческий сайт.
Что вы подразумеваете под когнитивной беглостью?
Основная идея, которая стоит за когнитивной беглостью заключается в том, что мозг предпочитает думать о тех вещах, о которых легко думать. Вот почему для вас предпочтительнее посещение сайтов, на которых вы инстинктивно понимаете, где все находится, и знаете, какие действия вам полагается совершить.
«Беглость приводит наше мышление в такие состояния, в которых мы не имеем представления о том, что это работает и затрагивает нас в любой ситуации, в которой мы взвешиваем информацию.» - сайт Uxmatters.
Когнитивная беглость – это основа очередной области поведения, известная как Простой эффект воздействия, который по существу излагает то, что чем больше раз вы подвержены раздражителю, тем больше вы его предпочитаете.
Еще раз, эти правила одинаково применимы к онлайн.
Это «знакомо» для блогов содержать opt-in (ы) на правой боковой панели или для коммерческих сайтов размещать изображение высокого разрешения с захватывающим внимание заголовком и эмблемой компании в верхней части левой стороны экрана.
Если ваши посетители, сформированные определенными особенностями являющимся стандартом для отдельной категории сайта, отклоняющиеся от этого, они могли бы подсознательно поместить вас в «менее привлекательную» категорию.
Здесь представлена «горстка» коммерческих сайтов. Посмотрите, заметите ли вы какие-нибудь сходства.
Внимание: что бы вы ни сделали, ради Божьей любви, не воспринимайте то, что я преподношу как «делайте то, что делают все». Таким образом, если вы не внимательные, вы могли бы навредить себе.
Важно понимать, что выборы дизайна - «prototypical» для сайта в твоей категории, но куда более важно найти доказательство, которое подтвердит правильность выборов дизайна результирующего в некотором роде подъем.
Многие проектировщики выбирают плохие альтернативы. Без проведения исследования, вы могли бы поступить аналогично. Например, многие коммерческие сайты используют автоматические слайдеры изображения для того, чтобы показать продукты, но изучение за изучением показывает то, что автоматические слайдеры отрицательно сказываются на обращениях.
Что происходит, когда ваши основные ожидания оправдываются и Ваш сайт соответствует ожиданиям пользователя?
В трех вышеуказанных изображениях все, что вы могли бы ожидать от коммерческих сайтов, расположено на своих местах. Даже если вы никогда не были на сайте вам свойственно «доверие» его дизайну.
С высоким уровнем беглости, сайт будет наполнен знакомым достаточно для, того чтобы посетителям не нужно было расходовать мысленные усилия для внимательного изучения и вместо этого они могли сосредоточиться на том, для чего посетили ваш сайт в первую очередь.
Когда восприятие замедленное, однако, вы чувствуете это немедленно
Вот пример розничного онлайн-магазина галстуков Skinnyties, который в действительности не выглядел как коммерческий сайт до изменения оформления в октябре 2012 года.
До:
После:
Немного ключевых изменений, которые ведут к огромным результатам:
- Размещайте темы по аналогии с коммерческими сайтами
- «Раскрывайте» гораздо больше свободным пространством
- Отражайте особенность отдельного продукта изображениями высокого разрешения и использованием контрастных цветов.
Здесь представлены варианты редизайна сайта впечатляющие, как для двух с половиной недель, после начала работы:
Редизайн сам по себе пока, в значительной степени не представляет ничего особенного. Он точно оперирует ожиданиями того, каким следует быть современному, розничному онлайн-продавцу одежды. Это “раскрывается” отзывчивым, и располагает последовательным языком дизайна на протяжении всех страниц продукции.
Но в сравнении со старым сайтом, очевидно, что недостаток этих простых элементов отрицательно сказывался на желании покупателей делать покупки на этом сайте.
Каким образом зрительная обработка информации должна повлиять на сложность сайта
В совместном изучении Гарвардом, университетами Мэриленда и Колорадо, исследователи выявили сильную математическую взаимосвязь между “приятным с эстетической точки зрения” для различных категорий населения - например, участникам, связанным с профессиональной диагностикой аппаратуры не понравились насыщенные цветами веб-сайты – но не было никаких рекомендаций для создания универсальной привлекательности.
Единственное, что было универсальным, так это то, чем более сложный для восприятия веб-сайт, тем ниже его визуальная притягательность.
Почему простота с научной точки зрения проще для обработки
Причиной того, что менее «визуально сложные» сайты считаются более привлекательными, состоит частично в том, что сайты не высокой сложности не требуют такой же тяжелой физической работы от глаз и мозга для расшифровки, хранения и обработки информации.
По существу, ваша сетчатка преобразует зрительную информацию из реального мира в электрические импульсы. Затем эти импульсы проходят через соответствующие фоторецепторы, чтобы передать цветовую и световую информацию в мозг.
Чем больше цветовых и световых вариаций на странице (визуальная сложность), тем больше работы глазу необходимо выполнить, чтобы послать информацию в мозг.
“… глаз получает зрительную информацию и преобразует ее в нейронную активность, которая возвращается в мозг, где она хранится и «кодируется». Эта информация может использоваться другими частями мозга связанными с умственной деятельностью, такой как, восприятие и внимание.” – сайт Simplypsychology.
Каждый элемент передает едва уловимую информацию
Вот почему важно, оформляя веб-сайт помнить каждую деталь – оформление, эмблема и выбор цвета – передают едва уловимую информацию о бренде.
Когда эти элементы не выполняют их работу, вебмастер часто компенсирует это добавлением ненужной копии и/или изображений, таким образом, добавляя визуальную сложность веб-сайта и отнимая общую эстетичность.
Оптимизация страницы с целью представления информации в наглядном виде – особо упрощающая информационное «путешествие» от глаза к мозгу – это что-то вроде передачи максимума от того, что вы можете, в столь малом количестве элементов насколько это возможно.
Когда они решили заставить бренд расти, они не добавили обычное “Мы делаем электронную почту с 2001 года, 3 миллиона человек доверяют нам, вот почему мы клёвые, бла бла бла”.
Вместо этого, они сократили объем написанного, упростили веб-сайт – главный заголовок просто читается “Отправь лучшее письмо” – и добавили еще более простую анимацию базовой идеи продукта (продукт с позиции основной выгоды, ради которой потребитель покупает товар).
До:
После:
Даже несмотря на то, что это была часть большей стратегии развития, результаты просто впечатляющие, более миллиона новых пользователей добавилось, когда новый фирменный знак впервые дебютировал.
”Кратковременная память” и Святой Грааль преобразования
Вся эта простота ведет к тому, что информация в наглядном виде сразу находит свой путь к мозгу.
Согласно знаменитому исследованию психолога Джорджа А Миллера в Принстоне, среднестатистический взрослый мозг способен хранить между 5 и 9 “порциями” информации в течение короткого промежутка времени в кратковременной памяти.
Кратковременная память это часть вашего мозга, которая временно, в течение нескольких секунд, хранит и обрабатывает информацию. Это то, что дает вам возможность фокусировать внимание, сопротивляться тому, что его отвлекает, и самое важное, позволяет вам принять решение.
Все о чем мы говорили вплоть до этого момента это уменьшение количества «шума», который попадает в кратковременную память.
Вот так простой сайт и дает 5-9 “порций”, которые кратковременная память пытается обработать - это что-то вроде гарантий, описаний продукта, цен или предложений. Когда кратковременная память сможет сфокусироваться на решении проблемы, она будет пытаться решить ее настолько быстро, насколько это возможно.
Отклонение приводит к отторжению
Когда вы отклоняетесь от ожиданий человека – цена была выше, чем ожидалось, цветовая схема и соразмерность отсутствовали, сайт не загрузился достаточно быстро, фотографии не были достаточно хорошего качества – кратковременная память обрабатывает эти замедляющие “порции” вместо того, что имеет значение.
Все потому, что кратковременная память обращается к долговременной памяти, чтобы пользоваться тем, что уже известно для выполнения задания. Когда долговременная память не может оказать помощь в обработке информации, процесс прерывается, и временная память освобождается и двигается дальше.
Вот почему столь важно, чтобы вы понимали степень не защищенности ваших посетителей от воздействия на них – не только для сайтов вашего уровня, но и для веб-сайтов в целом – если вы хотите “вклиниться” дизайном в их кратковременную память.
Блоги, которые они читают, сайты, на которых они делают покупки, их браузер, возраст, пол и фактическое месторасположение - все дает понять, как повлияет их степень знакомства на первое впечатление.
Заключение
Если посетители не могут полагаться на свой предыдущий опыт, они не думают о том насколько инновационный у вас сайт. Они просто уходят, удивляясь, почему объекты расположены не там, где им полагается. Не самое лучшее настроение, если вы хотите, чтобы они купили вещи.
ул. Ахматовой 9/18
ул. Чорновола 2-А
Сб. 11-00 -16:00