Главный экран: как не допустить распространенных ошибок

Главный экран: как не допустить распространенных ошибок

Ангелина Нехай Ангелина Нехай для раздела Академия

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

1. Не делайте надпись частью изображения

Почему нет?

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

alt alt

Выход

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

2. Не пишите много текста на первом экране

Почему нет?

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

alt

Выход

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

alt

3. Никакого длинного текста на кнопке

Почему нет?

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

Выход

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

alt

4. Не используйте изображения низкого качества

Почему нет?

Иногда заходишь на сайт, а там зернистая фотография на первой же странице и продолжать просмотр дальше уже не хочется. Фото — это первое впечатление клиента о компании. Он пока ничего не знает о вас: фото, краткое текстовое описание и кнопка для покупки — это все что у него есть. Какое впечатление сложится в голове человека зависит только от вас.

alt

Выход

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

Ангелина Нехай

Ангелина Нехай

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

Готовы начать?

Исследуйте все функции 🌱kvitly в течение 7 дней. Без обязательств и платежных карт.
Давайте пробовать!

App screenshot