[Запись вебинара] Основы веб-дизайна: как должен выглядеть сайт для бизнеса

Редакция «Текстерры»

Основные тезисы доклада

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

Основные типы сайтов:

• лендинг;
• сайт-визитка;
• многостраничный (корпоративный);
• интернет-магазин.

Структура сайта

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

Анализ конкурентов

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

Контент

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

Прототип

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

Логотип и фирменный стиль:

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

Какие фото, видео и иллюстрации использовать на сайте

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

Откуда брать фото и иллюстрации (платные ресурсы):

• www.shutterstock.com
• www.istockphoto.com
• www.ru.depositphotos.com

Откуда брать фото и иллюстрации (частично платные ресурсы):

• www.iconfinder.com
• www.flaticon.com
• icons8.com
• www.flickr.com
• www.pixabay.com
• www.pexels.com

Оформление сайта

Важно реализовать не просто красивый сайт, заходя на который вы будете получать удовольствие. Важно, насколько он хорошо выполняет возложенную на него функцию. Не стоит использовать оформление сайта по продаже гаражей (допустим, из сендвич-панелей) «как у Apple», это совсем разный рынок и совсем разная ЦА. Используйте полученные данные на этапе анализа ЦА.

Типографика

• Используйте фирменные шрифты на своем сайте, но учитывайте, что не все шрифты могут правильно отображаться на различных устройствах и браузерах.
• Большой набор шрифтов, которые мы советуем использовать, есть на сайте Google Fonts. Не пытайтесь открывать этот сайт в IE, он на нем не работает.
• Обычно на сайтах используется один шрифт, это неплохо. Но мы советуем использовать так называемые шрифтовые пары, чтобы добиться контраста в контенте: например, шрифт с засечками и шрифт без засечек.

Цвет в web-дизайне

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

Планшетная и мобильная версия сайта:

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

Анимация на сайте

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

К кому обращаться: фрилансер или агентство?

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

Как готовить ТЗ

При заполнении ТЗ требуется подробно раскрыть всю информацию, которая потребуется в разработке сайта, а именно:

• название компании;
• информацию о ЦА;
• информацию о конкурентах и ссылки на их сайты;
• сайты, которые вам нравятся;
• сайты, которые вам не нравятся;
• описание ваших товаров или услуг;
• логотип или брендбук;
• фото и видео материалы.

Мы проводим вебинары каждый четверг. Следите за новостями, чтобы ничего не пропустить!