Дизайнерские грехи способные погубить любой проект ещё в колыбели

Фото unsplash.com

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

В этой статье я разберу ужасные грехи дизайнеров и расскажу как не стать вредителем и диверсантом лишь делая некачественный дизайн.

Сложная и запутанная навигация

Если на вашем сайте запутанная навигация, всё так сложно закручено и не понять где что есть, то пользователь закроет сайт и пойдёт прочь. Крайне мала вероятность, что он выполнит целевые действия, да и вообще захочет иметь с вами дело.

Есть правила 1 минуты и 3 кликов. Пользователю должно хватить 1 минуты, чтобы разобраться в вашем сайте и найти где что есть. Пользователю достаточно сделать 3 клика, чтобы совершить целевое действие. Не нужно заставлять пользователя напрягать мозг и что-то искать подолгу. Особенно если вы делаете промо-сайт вроде лендинга или визитки.

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

Свалка

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

Кто-то считает это креативно и типа творческий беспорядок или вовсе, как Вовка из Тридевятого царства по принципу "Да, ладно, и так сойдёт". На самом деле нет. Свалка - это полное неуважение к вашей аудитории.

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

Чтобы не было свалки нужна структурированность вашего сайта. Структура, структура и ещё раз: структура! На свалке место не содержимому сайта, а вашему художественному видению.

Непонятная магия с кнопками

Если вы делаете дизайн для сайта отвечающего за продажи товаров и/или услуг вроде интернет-магазина или лендинга, то кнопка с призывом к действию - один из основополагающих элементов интерфейса, влияющий на воронку продаж. Кнопка - это всё для сайта.

Не нужно заменять кнопку ссылкой, это отпугнёт пользователя. Либо пользователь может просто не заметить вашей ссылки и не кликнуть, совершив целевое действие. Если раньше этого было достаточно, когда на заре интернета про средства CSS не слышали, то сейчас такое не допустимо точно.

Кнопки должны быть яркими и хорошо заметными на общем фоне страницы. Для кнопок стоит применять акцидентный цвет из вашей цветовой палитры. Этот цвет не должен быть кричащим и ассоциироваться с повышенной готовностью или опасностью.

Кнопки должны быть соразмерны остальным элементам интерфейса. Не нужно делать слишком маленькие кнопки, т.к. пользователь их не найдёт. Не нужно делать и такие здоровенные, что даже косой не промажет.

В лендинге разместить кнопку совершения целевого действия после уникального торгового предложения - это верное решение.

Часто можно увидеть на странице сразу несколько кнопок. Это допустимо, но важно не перестараться. Вставлять призыв к действию слишком часто не стоит точно.

Кнопка должна быть кнопкой и выглядеть, как кнопка. Не нужно шаманить с ними, меняя формы. Да, это креативно, да стильно. Но пользователь должен вмиг догадаться, что это кнопка. С непонятной фигуркой пользователь будет думать "А где же кнопка?" и шарить глазами по экрану.

Злоупотребление Pop-Up

Всплывающие окна полезны при подсказках и при сборе контактных данных пользователе. В то же время такие окна могут сердить пользователей. Особенно если такие окна появляются сразу после захода на сайт и пользователь с порога видит всплывающее окно, но не содержимое вашего сайта.

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

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

Стоит помнить, что всплывающие окна могут блокироваться браузерами. В таком случае от них не будет толка.

Отсутствие свидетельств достижений и успехов

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

Но стоит помнить, что отзывы клиентов в последнее время - это избитая и заезженная тема. Из-за дискредитации института отзывов как такового путём применения технологий написания заказных или просто вымышленных липовых отзывов, накруток и т.д. блок с отзывами не всегда способствует доверию. Лучше сконцентрироваться на других способах подтвердить свои достижения и добропорядочность таких как: награды, дипломы и сертификаты, публикации в СМИ, фотохроники, портфолио (для творческих направлений), разрешительные документы.

Тоже избитая и тоже заезженная тема с "нам доверяют" и перечислением крупных компаний и их логотипов. Проверить эту информацию сложно, а рядовому человеку просто невозможно. Пускать пыль в глаза не стоит точно, даже если эти компании действительно имеют с вами дела. В глазах людей выглядит не как солидность, а как некий понт. Лучше показать удачные случаи взаимодействия с этими компаниями типа: "компании А тогда-то было сделано это", "компании Б тогда-то было сделано то-то", кратко расписав решение их проблем, а не просто написать "нам доверяют".

Отсутствие адаптива и его навязывание

В нынешнее время львиная доля посетителей интернета это люди, выходящие во всемирную паутину с мобильных устройств: смартфонов, фаблетов (класс устройств между смартфоном и планшетом), планшетов. Больше всего, конечно же смартфоны. Сайт должен отображаться на каждом из них не одинаково, а с учётом специфики этих самых устройств - дефицита экранного пространства.

Если сайт не адаптирован под мобильные устройства, то посетителю с планшетом будет ещё как-то можно разглядеть, а вот пользоваться сайтом со смартфона или фаблета будет неудобно. Отказаться от адаптива - это отсечь часть своей аудитории при том немалую.

Маленький нюанс, на который все предпочитают забить: не нужно навязывать всем адаптив. Как бы парадоксально не выглядело и не казалось противоречием, есть такие пользователи, которые посещают сайт с мобильного устройства, но предпочитают видеть его версию для ПК или, как ещё называют, полную версию. Да, бывают и такие люди, пусть их мало, но они есть. Поэтому не надо их обижать и расстраивать, лучше сделать ссылочку или кнопочку вроде "Полная версия", "Версия для ПК", нажав на которую взору любителя полны версий предстанет именно полная версия сайта, как будто он зашёл с ПК. Пример: издание "Фонтанка" этим согрешило в один момент убрав такую опцию.

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

Шрифты и плохая типографика

Для веба лучше применять шрифты без засечек или как их называют гротескные шрифты, особенно для наборного текста. Шрифты с засечками (актиква) не подходят для веба, т.к. хуже будут смотреться, создавая иллюзию смазанности и будут быстро замыливать глаза читающего. Есть редкие исключения вроде газет, которые печатаются шрифтами с засечками у которых это традиция и которую они стремятся сохранить.

Не нужно размазывать наборный текст на всю ширину экрана. Пользователю будет неприятно бегать глазами по экрану, описывая букву Z или вовсе пытаться раскосить глаза.

Мелкий шрифт - это зло! Мелким шрифтом и "звёздочками" любят грешить мошенники или не честные на руку компании. Да и вообще мелкий шрифт - это отличный повод поломать глаза вашим пользователям, заставляя их проливать слёзы и тереть свои глаза. Раздвинуть пальчиками текст на смартфоне или зажать Control и двигать колёсиком мыши, меняя масштаб страницы в браузере умеют не все.

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

И что ещё важно: убедитесь, чтобы в вашем интерфейсе не было светлого текста на светлом фоне. Светлый текст на темном фоне тоже не лучший выбор, от него быстро устают глаза. Так же его можно просто не заметить. Оптимальный выбор — темный текст на светлом фоне.

Цвет

Цвет - это мощный инструмент воздействия на людей и животных, которые воспринимают его подсознательно. Поэтому к выбору гаммы цветов нудно подходить с умом в зависимости от того кто ваша целевая аудитория, что вы хотите с ней сделать (взбодрить, развеселить, заинтересовать). Бывает так, что у компании есть брендбук и в нём прописаны все корпоративные цвета, в таком случае необходимость выбора гаммы цветов отпадает, но возникает другая задача - обыграть цвета из брендбука так, чтобы они гармонировали друг с другом.

Избегайте кричащих оттенков в качестве акцидентных. Акцидентный цвет должен ненавязчиво подталкивать пользователя что-то сделать. Кричащий цвет встревожит пользователя. Избегайте грязных и блёклых оттенков.

Некачественная графика

Некачественные иллюстрации или фото способны подорвать все усилия по созданию сайта. Любительские изображения, картинки с низким разрешением, фотографии с артефактами сжатия, смазанные, нечёткие изображения могут вызвать непонимание или чаще всего отвращение у посетителя. Чтобы этого не было, выбирайте графику для будущего веб-ресурса с умом. Картинки должны иметь высокое разрешение, для растра это критично. В случае с растровыми изображениями уменьшить разрешение всегда можно, а вот увеличить - нет.

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

Заключение

Избегание этих ошибок при создании сайта - действенный способ обеспечить пользователям позитивные впечатления от его посещения. Это своеобразный способ повысить конверсию и улучшить воронку продаж.

Стоит помнить, что дизайнер - это не художник, который так видит, который всё красит и малюет чтобы было вау. Дизайнер - это некто вроде архитектора для сайта, который его задумывает и прорабатывает. Вряд ли кто-нибудь хотел бы жить в доме с многогранными квартирами, в которых треугольные комнаты и овальный коридор с круглой кухней, зато красивый фасад лишь потому, что архитектор оказался хорошим художником и так увидел будущий дом.

Работа дизайнера хоть и творческая, но она подчиняется определённым устоявшимся правилам и закономерностям, соблюдение которых приведёт к успеху. Смысл работы дизайнера не делать креативную красоту, а решать боли заказчика посредством качественно выполненной работы со шрифтами, текстами, цветом, графикой, структурой и прочим визуалом.