Дизайн Digital Breath
737

Дизайн сайта: стоит ли вкладываться?

Создание качественного веб-ресурса в интернете - это работа digital-агентства, где трудятся дизайнеры, программисты, копирайтеры. Ваш сайт создает целая команда узких специалистов. Их работа обойдется недешево, но зато вы будете уверены в результате.

В закладки

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

Мы, http://breath.digital/, собрали мнения экспертов, работающих в российских и зарубежных агентствах, чтобы вы смогли что называется “на берегу” оценить все возможные риски и ответили для себя на вопрос: стоит ли вкладываться в дизайн и разработку сайта, заказывая его у профессиональных агентств?

Елена Медведева руководитель отдела имиджевых коммуникаций digital-агентства Faros Media
Василий Курпеев основатель агентства Digital Milk (Чехия)
Булат Давлетов UX-дизайнер репутационного агентства Репутация. Москва
Артём Бурунов Главный web-designer PICONSULT Digital

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

Елена Медведева: Работая над сайтом, всегда держите в памяти две вещи: конечная цель и портрет целевой аудитории. Представим, что мы работаем с сайтом, цель которого – привести и удержать как можно больше уникальных пользователей (информационные, развлекательные ресурсы, социальные сети). В таком случае стоит сконцентрироваться на приятных подложках, не раздражающих глаз, плавных переходах. Использовать по минимуму наличие контрастных элементов.

А теперь возьмем сайт, цель которого единичное действие - покупка продукта, услуги, запись на мероприятие. Здесь дизайн, наоборот, должен вовлекать, быть ярким. Главная задача - удержать пользователя на сайте необходимые 30-50 секунд и динамично довести его до кнопки «записаться», «перезвонить», «положить в корзину»...

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

Василий Курпеев: Когда я начинал заниматься дизайном 12 лет назад, то мне казалось, что секрет успеха бизнеса в передовом дизайне сайта. Но со временем мне стало ясно, что он должен отвечать той целевой группе, которая на него приходит. Есть такие азы дизайна, как например толщина шрифта - чем толще шрифт, тем более доступный продукт. Но дизайнеры любят злоупотреблять тонкими изысканными шрифтами не к месту. Порой из виду упускается юзабилити сайта в угоду "красоте", а ведь для бизнеса важно прохождение воронки продаж, начиная от посещения лендинг-страницы до совершения покупки. Поэтому важно выполнять условия ярких цветов для кнопок и простых форм в видимой части экрана не только в desktop, но и мобильной версии сайта. А рабочий прототип поможет избежать многих ошибок.

Булат Давлетов: Дизайнер работает с тремя вещами: информацией, графикой и поведением. Тонкостей в веб-дизайне бесконечно много. Но есть основные, без которых дизайн не работает:

  • У сайта есть цель. Дизайнер должен её прекрасно знать и в каждом шаге вести сайт к её выполнению.
  • Дизайн зависит от типа сайта. Есть имиджевые, «одноразовые» сайты и лендинги. На таких сайтах мало информации и она не меняется. Фантазия дизайнера здесь может быть безгранична и не требует больших знаний. На «рабочих» сайтах информация постоянно добавляется, обновляется. Это сайты со статьями, интернет-магазины. Главное здесь - удобство пользования и производительность веб-ресурса.
  • Хороший дизайн должен быть живым, продуманным. Важно, как на сайте будут выглядеть реальные данные. В процессе работы над сайтом дизайнеры используют «рыбу» — временную информацию для создания дизайн-макетов. Когда сайт сверстан и вместо «рыбы» наполняется настоящим контентом, тогда и всплывают недочеты. Именно здесь проявляется профессионализм дизайнера: учел ли он все возможные варианты поведения сайта с реальным контентом.

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

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

- Какие трудности могут возникнуть при выборе дизайна для тематического сайта? С какими трудностями сталкивались Вы, подбирая дизайн для сайта, или, создавая его? Как решили данную проблему?

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

Если сайт предполагает обилие объемных графических элементов, анимации, видео, то необходимо для этого оптимизировать весь контент. Долгое ожидание загрузки при переходе по страницам - основная причина, почему пользователь закрывает вкладку, так и не совершив конверсионных действий.

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

Василий Курпеев: Лет 10 назад мы делали сайт для Красного Креста, и у нас было более 200 версий страниц различных вариантов, в которые они бесконечно вносили правки - это ночной кошмар для любой дизайн-студии... После этого я пришел в выводу, что часто заказчик руководствуется своим личным вкусом вперемешку с неуверенностью в правильности решения. Бывали случаи, что логотип крупной строительной компании выбирался на семейном совете, а видеоролик рекламы пива утверждался коллегами из отдела поставок и финансового отдела.

Идеальный вариант для дизайнеров, когда исполнитель обладает непререкаемым авторитетом, к примеру, как Артемий Лебедев, который уверен в своей работе настолько, что может отказать заказчику в возможности вносить комментарии по дизайну. Но в жизни такое встречается редко, поэтому чаще клиент отметает смелые и удачные дизайнерские решения потому, что он пришел из другого бизнеса, и ему кажутся непривычными визуальные образы, которыми живет утонченный дизайнерский коллектив.

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

Булат Давлетов:

  • Первая и самая большая сложность это представления заказчика. Он хочет увидеть картинку, которую нарисовал у себя в голове. Но у дизайнера иное виденье результата. Если цель заказчика отличается, то и дизайн будет другим.
  • Непредсказуемость. На больших сайтах первоначальный дизайн-макет часто отличается от финального. Дизайнер не может предсказать, каким он будет выглядеть в итоге.
  • Инновации и традиции. Трудности могут возникнуть во время поиска правильного баланса между инновационностью, оригинальностью и понятностью дизайна. То есть дизайн должен быть не слишком революционным, не как у всех, но при этом запоминающимся и понятным.
  • Выделить главное. Зачастую получается так, что хочется показать всё. Трудности могут возникнуть, когда пытаешься вычленить самое главное и сделать на нем акцент. Без общения с владельцем сайта сделать это не получится.
  • Единый узнаваемый стиль. Показатель неопытности дизайнера заключается в отсутствии навыка выдержать сайт в одном стиле. Это может отпугнуть посетителя тем, что без его ведома ему открыли другой сайт. Это автоматически вызывает желание закрыть страницу.
  • Мониторы и зрение. У большинства пользователей плохие мониторы и плохое зрение. Не зная этого, можно ошибиться с размером и контрастностью объектов. Что-то важное может оказаться незамеченным. Решение данной проблемы: любой текст, который вы можете прочесть, должен быть примерно на 20% крупнее. Иногда достаточно немного прищуриться либо посмотреть издалека.
  • Понятие «красиво» может быть разным в понимании заказчика и дизайнера. Это уже просто недопонимание и непрофессионализм сторон (одной или обеих), из-за которых возникает много сложностей. Проблему решит:

— портфолио: если заказчик видел ваши предыдущие работы, его, скорее всего, устраивает ваше видение «красоты»;

— бриф: чем он подробнее заполнен, тем понятнее пожелания заказчика и цель сайта;

— мудборд: примеры работ, которые нравятся заказчику.

Трудности, с которыми пришлось столкнуться мне:

  • Размеры экранов. При работе на экране с небольшим разрешением мне было трудно учитывать, как сайт будет выглядеть на очень больших мониторах. Иногда из-за этого дизайн был не продуман и выглядел плохо на экранах, которые были больше, чем у меня. Эту проблему можно решить проверкой на больших мониторах.
  • Красивое и настоящее. Настоящая информация выглядит не так красиво, а красивая информация недостаточно информативна. Поэтому всегда приходится балансировать, используя познания в типографике, композиции, русском языке и поведении пользователей.
  • Неправильно поставленная задача. Бывает так, что заказчик неверно представляет себе цель сайта. Это чревато бесконечными исправлениями. Здесь поможет подробный бриф, личное общение с заказчиком и знание тематики его сайта.
  • Работа с текстом. Я сталкивался с тем, что тексты для сайта приходилось продумывать, корректировать и даже писать самому. Казалось бы, это же работа копирайтера. Но на деле владение русским языком у дизайнера должно быть на очень высоком уровне. Дизайн — это визуальная коммуникация. И если ты не можешь точно передать мысль словами, то и сделать дизайн для нее самостоятельно не сможешь.

Артем Бурунов: Одна из основных трудностей, с которыми мы сталкиваемся в своей практике - это правильно определить аудиторию и выбрать верный графический язык, на котором сайт будет “разговаривать” с пользователем в комфортной для него среде потребления контента.

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

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

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

- Ваше мнение как эксперта: стоит ли экономить на дизайне и создании сайта и пользоваться предложенными шаблонами на бесплатных ресурсах? Каковы риски?

Елена Медведева: Экономить точно не стоит. Использовать автоматизированные сервисы по созданию сайтов можно, если нет ресурсов сделать самостоятельно. Рынок готовых шаблонов сегодня очень развит, и за умеренную плату можно получить вполне неплохой сайт с современным дизайном и удобным функционалом. Такой вариант подходит для небольших и локальных компаний. Стоимость шаблонов может варьироваться от 10 до 150 долларов. Заготовку сайта можно получить и без денег. Но хороших бесплатных шаблонов не так много. Большинство из них уже примелькались. Потребуется много времени и сил, чтобы переделать их под себя.

Василий Курпеев: Решение о выборе шаблона базируется на цели, задачах и бюджетах. В рамках своей работы в чешской стартап студии Creative Dock мы предлагали кампаниями, которые хотят запустить MVP (minimum viable project) использовать шаблоны, чтобы зря не вкладываться в разработку ресурсами и временем.

Или другой пример. Существует много готовых темплейтов по мероприятиям, поэтому когда речь идет о создании сайта за несколько дней - это оправданное решение.

Для локальных бизнесов, где разработка индивидуального дизайна - излишняя роскошь, можно поступиться амбициями, сэкономив на скорости и дешевизне. Но “коробочные” решения потребуют от вас немало сил по подготовке контента.

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

Булат Давлетов: По-настоящему нужный и интересный сайт может прожить без дизайна, сделанного специально для него. Поэтому так много сайтов, на которые тяжело смотреть, и которыми всё-таки пользуются люди.

Риски:

  • Непродуманность.
  • Низкое качество.
  • Бесчеловечность.
  • Слабое решение поставленной задачи.
  • Низкая запоминаемость.
  • Плохая гибкость к изменениям.

Артем Бурунов: Если дизайнер держит в уме, что сайт отражает ценности компании, ее прямые бизнес-цели и в основе своей содержит проработанный пользовательский опыт (UX, user experience), то все затраты на его производство окупятся благодаря увеличению показателей эффективности работы. Нельзя экономить на лице компании, которым и является сайт! Ведь за web-дизайном digital-агентств стоит серьезная аналитическая работа, конкурентный и продуктовый анализ.

Шаблон по определению не может быть уникальным, в его основу нельзя заложить позиционирование компании. Людям, чувствительным к визуалу, шаблон всегда скажет только об одном - что вы решили сэкономить. Но на определенных этапах развития бизнеса шаблон станет отправной точкой к расширению каналов продвижения и продаж. Современные условия практически обязывают компанию в том или ином виде присутствовать в сети, а вот выбор этого “вида” уже обоснован конкретными целями и возможностями.

Материал опубликован пользователем. Нажмите кнопку «Написать», чтобы поделиться мнением или рассказать о своём проекте.

Написать
{ "author_name": "Digital Breath", "author_type": "self", "tags": [], "comments": 6, "likes": 3, "favorites": 9, "is_advertisement": false, "subsite_label": "design", "id": 49055, "is_wide": false, "is_ugc": true, "date": "Wed, 24 Oct 2018 16:26:34 +0300" }
{ "id": 49055, "author_id": 173174, "diff_limit": 1000, "urls": {"diff":"\/comments\/49055\/get","add":"\/comments\/49055\/add","edit":"\/comments\/edit","remove":"\/admin\/comments\/remove","pin":"\/admin\/comments\/pin","get4edit":"\/comments\/get4edit","complain":"\/comments\/complain","load_more":"\/comments\/loading\/49055"}, "attach_limit": 2, "max_comment_text_length": 5000, "subsite_id": 199114 }

6 комментариев 6 комм.

Популярные

По порядку

Написать комментарий...
4

Было бы странно услышать от людей работающих в нише, что их труд не имеет смысла и ни на что не влияет... Мое мнение заключается в том, что обыватель настолько далек от понятия хороший дизайн и настолько на нем слабо сфокусирован, что даже не поймет разницы между шаблоном с фореста и индивидуальной дизайнерской работой. А добрая половина скажет, что с фореста им шаблон еще даже больше и нравится. Ну это мое личное мнение.

Ответить
3

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

Ответить
0

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

Ответить
1

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

Ответить
0

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

Ответить
1

я уж думал всем давно уже понятно, что вкладываться надо в выполнение бизнес-задач, достижение бизнес-целей

Ответить
0
{ "page_type": "article" }

Прямой эфир

[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox_method": "createAdaptive", "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fizc" } } }, { "id": 4, "label": "240х200_mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "flbq" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjog" } } }, { "id": 10, "disable": true, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "disable": true, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "bscsh", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "createAdaptive", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-223676-0", "render_to": "inpage_VI-223676-0-1104503429", "adfox_url": "//ads.adfox.ru/228129/getCode?pp=h&ps=bugf&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid10=&puid21=&puid22=&puid31=&puid32=&puid33=&fmt=1&dl={REFERER}&pr=" } }, { "id": 15, "label": "Плашка на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byudx", "p2": "ftjf" } } }, { "id": 16, "label": "Кнопка в шапке мобайл", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byzqf", "p2": "ftwx" } } }, { "id": 17, "label": "Stratum Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvb" } } }, { "id": 18, "label": "Stratum Mobile", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvc" } } }, { "id": 19, "label": "Тизер на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "p1": "cbltd", "p2": "gazs" } } } ]
Хакеры смогли обойти двухфакторную
авторизацию с помощью уговоров
Подписаться на push-уведомления
{ "page_type": "default" }