Натыкаетесь на кирпичную стену, когда дело доходит до проектирования/верстки вашего веб-сайта? Вы не одиноки; такое случается с лучшими из нас.
При всем том вдохновении, которое окружает нас в Интернете, может быть сложно понять, какие части наиболее важны для вашего веб-сайта.
Не зная, что должно быть на вашем сайте, вы легко можете получить бесполезный сайт, который не отражает суть вашей компании и не достигает ваших целей.
Если у вас нет правильно спроектированного веб-сайта, многие из ваших пользователей станут клиентами конкурента. Однако, если вы проектируете с использованием правильных ресурсов, вы можете создать потрясающий инструмент, который поможет стратегически продвигать ваш продукт(ы).
От пространства макета и изображений до четких призывов к действию и страниц о нас - ниже приведены несколько компонентов, которые следует и не следует включать на свой веб-сайт
Что следует разместить на своем сайте
Пробел
Белое пространство с точки зрения веб-дизайна - это «пространство между графикой, столбцами, изображениями, текстом, полями и другими элементами». Это один из самых важных инструментов дизайна, поскольку он определяет, как страница будет выглядеть и читаться.
Несмотря на свое название, важно отметить, что пустое пространство не всегда на самом деле белое - оно просто пустое. Пространство на веб-сайте можно легко заполнить фоновым цветом или простой текстурой, но если на нем нет элементов, это все равно пустое пространство.
Teamwork имеет фантастический пример сайта, который эффективно использует пустое пространство с максимальной эффективностью
Поля между заголовком и блоками контента позволяют легко отличить их друг от друга. Изображения, которые сопровождают контент с обеих сторон, также имеют соответствующие интервалы, чтобы указать, к каким областям они принадлежат, не мешая читаемости.
При правильном использовании пользователи должны иметь возможность подсознательно просматривать ваши страницы и усваивать информацию в правильном порядке
Простая навигация
Навигация вашего сайта во многом похожа на дорожную карту; он показывает вашим пользователям каталог всех ваших страниц и места, где можно найти определенную информацию.
Если у вас нет точного и четкого плана действий, как потенциальный клиент сможет узнать о вашем программном обеспечении или услугах? Как они могут узнать, где найти то, что им нужно?
Ваша навигация не должна быть сложной, она должна быть простой в использовании и идентифицируемой. Если можете, сделайте его компактным и убедитесь, что информация в нем организована правильно, чтобы пользователи могли легко в ней маневрировать.
Wistia имеет хорошо организованную навигацию, которая аккуратно распределяет наиболее посещаемые страницы по определенным вкладкам. Эти же страницы, а также некоторые другие, сохраняются в основной навигации в виде гамбургера, поэтому при необходимости пользователи по-прежнему могут видеть все страницы одновременно.
О нас
Страница «О нас» входит в пятерку самых обязательных страниц веб-сайта. У вас есть всего несколько коротких минут, чтобы завоевать расположение пользователей, и привлекательная страница о нас - один из лучших способов сделать это.
Менеджер по контент-маркетингу IMPACT Рамона Сухрадж сказала об этом лучше всего: «Не существует точной формулы, которой вы должны следовать - вы просто хотите, чтобы ваша страница о нас была интересной, информативной и представительной. Вы хотите дать своим потенциальным клиентам повод влюбиться в ваш бренд».
На странице Orchid Software есть множество дружелюбных и привлекательных изображений, которые добавляют приятную индивидуальность тому, что в противном случае могло бы быть скучным и неинтересным.
Включение разделов, посвященных их философии и культуре, помогает повысить прозрачность компании. Это также дает потенциальным клиентам понять, что они заботятся о своей команде
Призывы к действию (CTA)
Призывы к действию призваны побудить посетителя совершить действие, будь то загрузка электронной книги, регистрация на вебинар, посещение мероприятия и т. д.
Призыв к действию можно разместить в любом месте вашего веб-сайта (например, на ресурсе или в конце статьи блога). Однако вам необходимо убедиться, что его содержание и размещение соответствуют содержимому страницы, иначе у пользователей может не возникнуть желания нажимать на него.
У вас могут быть сложные, содержащие изображение и форму, или простые, которые представляют собой не более чем строку текста и кнопку.
В IMPACT мы используем на нашем сайте различные призывы к действию. Возможно, вам наиболее знакомы те из них, которые мы размещаем в конце статей нашего блога или на главных страницах сайта
Пока они используются правильно, ваши пользователи будут залогом увеличения количества потенциальных клиентов и привлечения новых клиентов.
Отличная качественная графика
Визуальные эффекты могут стать мощным элементом любого веб-сайта, если их правильно использовать. Любой дизайнер понимает, какое влияние он оказывает на ваш бренд и как он может помочь визуализировать ваши продукты, услуги и преимущества.
Для такого сайта, как Homeaway, правильное изображение имеет решающее значение. Фоновое видео в главном разделе главной страницы помогает задать тон отпуску, который вы, возможно, захотите провести.
Изображения арендуемой недвижимости ниже также имеют аналогичный эффект. Они показывают изображения, идеально подходящие для различных типов недвижимости, которые могут искать пользователи.
Хотя в этом видео много потрясающих изображений, вам следует быть осторожными при использовании их на своем сайте. Они, как правило, загружаются долго и обычно отвлекают пользователя от контента. Итак, прежде чем внедрять его, убедитесь, что фоновое видео является наиболее идеальным решением для вашего сайта.
Ценностное предложение
Ваше ценностное предложение - это первый элемент, который потенциальный клиент видит при посещении вашей домашней страницы. Часто от этого зависит, будут ли они продолжать проверять ваш сайт, прежде чем нажать кнопку «Назад» и перейти к конкуренту.
Он должен объяснять, как ваш продукт решает проблемы ваших клиентов, улучшает их ситуацию, обеспечивает конкретные преимущества и объясняет идеальному клиенту, почему он должен предпочесть вас кому-либо еще.
Ценностное предложение Stripe направлено на то, чтобы пользователи могли зайти на их сайт и сразу понять, что это за компания
Отзывы клиентов
Как доказать, что ваш продукт или услуга действительно работает? Лучший способ сделать это - включить отзывы довольных клиентов, которые объясняют, как им помог ваш продукт или услуга.
При разработке раздела отзывов имейте в виду, что включение фотографии клиента поможет персонализировать отзыв и повысить достоверность сопровождаемого заявления.
Invision сделала именно это на своей странице для клиентов. Они даже идут на дополнительный шаг и добавляют логотип компании прямо перед цитатой.
Это может быть разумной тактикой, чтобы привлечь внимание к отзывам, если компания пользуется репутацией и ее узнают люди
Чего следует избегать
Всегда есть элементы, которые не следует включать на свой сайт. Это может снизить ценность вашего сайта и даже раздражать пользователя.
Вот несколько элементов, которых следует избегать при редизайне вашего сайта.
Флэш
Вы можете помнить, а можете и не помнить, но в какой-то момент многие веб-сайты были разработаны с использованием Adobe Flash. Это произошло главным образом благодаря простоте использования программы и возможности добавления разнообразной анимации. - но времена Флэша давно прошли.
Веб-сайты, созданные с использованием этого программного обеспечения, загружаются медленно, плохо оптимизированы для поисковых систем, работают не на всех мобильных устройствах (особенно Apple) и обычно не реагируют на запросы.
Flash также требует загрузки и установки программного обеспечения - и последнее, чего вы хотите, - это усложнять процесс просмотра вашего сайта.
Для тех, кому нужна плавная анимация и переходы, попробуйте другие методы, а не загромождайте свой сайт использованием Flash.
Фотографии
Каждый в своей жизни использовал стоковые фотографии. Ключ к их использованию - избегать включения тех, которые выглядят фальшивыми или тех, которые постоянно можно увидеть на многих других сайтах.
Если можете, вообще не используйте стоковые фотографии. Попробуйте устроить фотосессию, чтобы сделать интересные и оригинальные снимки вашей настоящей команды или офиса.
Реальные фотографии вашей компании и сотрудников помогут составить более правдивую картину вашей культуры и окружающей среды. Вашим пользователям также будет гораздо легче доверять вашему бренду, когда они будут знать, что за продуктом, который они видят на сайте, стоят настоящие лица.