Я разработал много сайтов со времен коммутируемого интернета. За эти годы я понял, как важно продемонстрировать мощный бренд, который должен быть переведен непосредственно в мощный дизайн веб-сайта.
Если вы хотите привлечь новых клиентов и существующих клиентов на свой веб-сайт, один из ключей – это функциональный и привлекательный пользовательский интерфейс, управляемый вашим брендом.
Есть семь элементов, которые я считаю критически важными для привлечения ваших посетителей на ваш сайт и обеспечения того, чтобы они оставались достаточно долго, чтобы сделать что-то продуктивное.
1. Призывы к действию
Я знаю я знаю Как зомби в Ходячие мертвецыОни повсюду. Но точно так же, как те голодные до мяса монстры (которые часто могут быть эффективными в получении еды), все еще есть место для кнопки CTA.
Хотя я не фанат всплывающих окон, мне нравится кнопка CTA и мне нравится модель freemium. Призыв к действию может позволить пользователям немедленно начать бесплатную пробную версию, добавить продукт в корзину или подписаться на новостную рассылку.
Эффективное использование кнопки CTA – Netflix, гигант потокового кино. Они обращаются к новичкам с привлекательным интерфейсом и простотой дизайна. Netflix имеет сильный бренд и узнаваемые фирменные цвета.
Когда посетитель попадает на домашнюю страницу, Netflix дает понять, что в долгосрочной перспективе не нужно совершать коммиты. Клиент может присоединиться и отменить в любое время.
2. Используйте контрастные элементы
Это одна из моих любимых стратегий в веб-дизайне. Используя цвет и размер текста, вы можете создавать контрастные элементы, чтобы сосредоточить внимание посетителей на чем-то конкретном. В качестве примера мы будем использовать поэму общественного достояния Уолта Уитмена.
Приветственное стихотворение
Уолт Уитмен
от Листья травы
В приведенном выше примере мы хотели выделить посетителя этого уникального стихотворения Уолта Уитмена. Но рассмотрим следующий пример:
Приветственное стихотворение
Уолт Уитмен
от Листья травы
В данном случае мы хотим подчеркнуть, что мы имеем в виду великого поэта Уолта Уитмена.
Этот контрастный метод очень важен, особенно в блогах или социальных сетях. Вы хотите подчеркнуть тему (то есть название поэмы)? Или вы бы предпочли выделить человека, который опубликовал пост (то есть автора Уолта Уитмена)?
3. Заставьте цвет работать на вас
Красочный дизайн замечательный, и он очень важен для ваших потребителей. Цветовая психология постоянна, когда дело доходит до дизайна сайта.
Поэтому сделайте так, чтобы цвет по назначению работал на вас.
Ваша цель состоит в том, чтобы направить ваших посетителей на полезные предметы. Рассмотрите веб-сайт Dell во время курортного сезона.
Используя синий цвет своего бренда на сером почти снежном фоне, глаза посетителей обращены к левой стороне экрана. Текст подчеркивает потенциальную экономию в легко читаемом шрифте с засечками. Dell предлагает три простых варианта действий кнопки, которые поощряют покупки или финансирование.
4. Используйте значки, чтобы добавить интерес и для быстрого сканирования
Мне нравятся значки, потому что они добавляют визуальный интерес к странице. Если вы предлагаете услуги, иногда нет смысла публиковать изображение вместе с информацией, которую вы хотите предоставить своему потребителю или потенциальному клиенту.
В этом случае значки могут добиться цели, предоставляя определенную степень визуального стиля. Цифровая валюта Dogecoin использует три значка на своей домашней странице, чтобы добавить интерес и поделиться быстрой информацией.
Значок ракеты для пользователей, чтобы начать, довольно умный. Значок сообщества из трех человек является стандартным и легко узнаваемым. Последний значок, «Get Dogecoin», немного эзотерический со стрелками, указывающими в обе стороны, но он выполняет свою работу, указывая транзакционный характер вашей валюты.
5. Слайдеры в модерации
Как и кнопки «Призыв к действию», ползунки могут использоваться слишком часто, поэтому я рекомендую их экономно. Многие крупные издательские сайты допустили ошибку, поместив ползунки почти на каждой странице с большим количеством изображений, что требует высокой пропускной способности и вычислительных ресурсов. Важно знать, может ли ваш веб-хостинг справиться с таким тяжелым бременем. Очень немногие ресурсы, которые типичны для бесплатных и очень дешевых опций, могут серьезно замедлить скорость загрузки вашей страницы.
Веб-серверы имеют различные ограничения на то, что может быть загружено, поэтому PHP-хостинг и его опции важны
Эффективное использование означает ограниченное количество ползунков с четким действием.
В качестве примера можно привести веб-сайт Музея американского искусства «Хрустальные мосты». Используя четыре видео слайдера, музей фокусируется на привлечении посетителей, показывая естественную красоту окрестностей музея, расположенных в сельской местности в Бентонвилле, штат Арканзас.
Слайдеры включают в себя музейную горку с деревьями и водой и освещенный открытый купол с покровителями, наслаждающимися видом снизу.
Как и Netflix, в художественном музее есть простой CTA, чтобы поощрить посетителей «планировать посещение».
6. Пустое пространство – твой друг
Я часто покупаю компьютерное программное обеспечение и продукты. Одна из главных причин, по которой я покидаю сайт, – это занятая графика и слишком много текста.
Для ваших целей рассмотрите элегантный дизайн с большим количеством пустого пространства, чтобы позволить вашим посетителям и потенциальным клиентам сделать перерыв при рассмотрении вопроса о покупке товаров или услуг.
Соответствующий пробел особенно актуален для мобильных пользователей, которым приходится прокручивать дальше, чтобы собрать столько же контента, сколько пользователь настольного компьютера.
High Prairie Landscape Group, базирующаяся в Канзас-Сити, использует много пустого пространства, чтобы направлять своих посетителей на важные аспекты вашего сайта.
Помимо слайдера и небольшой галереи изображений, компания обсуждает свой метод ландшафтного дизайна, выделяет руководство по ценообразованию и использует простые кнопки CTA для привлечения клиентов к действию.
Пробел продолжается с большим количеством опций и разделом отзывов. Дизайн понятен, лаконичен и легко читается.
Нижняя строка
Стоит ли использовать Wix, WordPress, Joomla, Drupal или вручную кодировать свой сайт с нуля?
Мой твердый ответ … наверное. Реальность такова, что одно из решений для веб-приложений DIY может обратиться к вам больше, чем другое. Есть большая вероятность, что вы начнете с одного из «других», а затем решите, что предпочитаете WordPress.
Вы находитесь в хорошей компании, потому что почти 30% Интернета работает на этой системе управления контентом (CMS).
Суть в том, что вам не нужно нанимать такого разработчика, как я, для выполнения относительно простых задач. Плагины, которые позволяют легко переносить контент вашего сайта с практически любой другой платформы на WordPress, также стали более изощренными. И как только вы попали на WordPress, вы сделали это – это популярно по многим причинам, но одна из них – простота использования, даже для начинающих владельцев сайтов.
Потратьте время на изучение и реализацию советов по пользовательскому интерфейсу в этой статье, и вы сможете настроить свой веб-сайт так, как он должен выглядеть. Если вы не думаете, что это имеет большое значение, я здесь, чтобы вежливо сказать вам, что вы не правы. Это большая проблема, и это может быть разница между сайтом, который позволяет вам зарабатывать на жизнь, или сайтом, который лучше всего определить как убыточное хобби.
