В дизайне многих порталов, интернет-магазинов и лендингов кроются ошибки, способные испортить все впечатление. От каких популярных приёмов нужно отказаться?
Низкая контрастность текста
Текст с низкой контрастностью вызывает у пользователей раздражение. Светлые строчки на светлом фоне и тёмные на тёмном со стороны смотрятся интересно, но при чтении вызывают дискомфорт.
Страдает просмотр сайта на мобильных устройствах. Легко ли будет прочитать серый текст на светло-серой странице на улице под ярким солнцем?
Когда утрачена чёткость текста, пользователи всматриваются в экран, их глаза быстро устают. Как показали исследования, люди склонны меньше доверять трудно читаемому тексту. Пользователи чувствуют себя неуверенно, теряют ориентацию в структуре сайта, и покидают страницу.
Форматирование текста должно быть подчинено единственной цели − комфорту пользователей. Заголовки, текст и фон не сливаются по цвету. Вокруг важного элемента всегда присутствуют отступы. Ценная информация вынесена в отдельный столбик.
Аккуратно используйте реверсивные шрифты — светлый текст на фоне тёмной страницы. Белые буквы на цветном и чёрном фоне читаются труднее чёрных букв на белом фоне. Не стоит экспериментировать с реверсивными шрифтами в продающих и рекламных текстах.
Мелкий шрифт
Минимально допустимый стандарт – шрифт в 14 пикселей. На многих сайтах используется шрифт от 18 пунктов.
Шрифты разных видов различаются по размеру. Verdana в 16 пунктов крупнее Calibri того же разряда.
В футере допустимы шрифты помельче, но если вы хотите, чтобы гости сайта прочитали надпись, остановитесь на шрифте не менее 16 пикселей.
Оценить оптимальный тип и размер шрифта поможет плагин WhatFont для Google Chrome. Он определяет характеристики шрифта при клике по надписи.
Слайдеры
Многочисленные тесты показали, что подвижные слайдеры и карусели изображений − малоэффективный способ предоставления контента.
Ничтожно малое количество посетителей кликают по слайдам. Чаще всего их внимание привлекает первое изображение. Нет смысла занимать ценное пространство на главной странице сайта бесполезным, но модным в среде разработчиков элементом.
Разместите на главной странице одно, наиболее привлекательное, предложение. Остальные услуги продвигайте при помощи кнопок или текстовых блоков.
Маленькая высота строки
Если шрифт и размер тщательно обдумывают, то высоту строки часто ставят произвольную. Маленькая по высоте строчка создаёт эффект слепленного текста и портит впечатление от сайта.
Слишком длинная строка
Вытянутый в длину текст неудобно читать онлайн. Оптимальная длина строки − 50-60 символов, допустимый максимум − 75.
Проблема всплывает при реализации адаптивного дизайна. Идеальная пропорция при вёрстке − ширина текста в 516 пикселей. В этом случае при шрифте в 18 пикселей длина строки составит 65 символов.
Отсутствие цветового акцента на кнопках призыва
Сделайте кнопки «Попробовать бесплатно» и «Купить» яркими. Не повторяйте в них основной цвет лендинга. Используйте по отношению к нему дополнительные (комплементарные) цвета.
На стандартном цветовом круге комплементарные цвета находятся напротив. Оказавшись рядом, они смотрятся ярче.
Нарушение привычных принципов проектирования сайтов
В Интернете сложились определённые традиции дизайна сайтов, и пользователи к ним привыкли.
Посетители ожидают увидеть логотип компании вверху слева. Чтобы узнать подробности о компании, нужно перейти на страницу «О нас», а адрес, телефон и координаты в социальных медиа нужно искать на странице «Контакты».
Стандартные функции нужно реализовывать с учётом привычек пользователей, а спецэффекты применять осторожно.
