Для того, что выиграть конкуренцию за внимание и доверие покупателя, сайт должен быть безупречным в мелочах. Многие предприниматели этого не понимают, а потом удивляются, почему продажи падают. Мы написали эту статью, чтобы раскрыть значимость этих мелочей.
А речь в статье пойдет об иконках. Да, этих маленьких изображениях, которые кажутся третьестепенной составляющей любого сайта. Мы назовем причины, по которым такое отношение следует пересмотреть.
Задачи и виды использования иконок
Мы в Маркетинг Ап относимся к сайту как к бизнес-инструменту. Поэтому разговор о любом веб-элементе мы начинаем с задач, которые он решает. У иконок на любом сайте всего три основные задачи:
1) Ускорять восприятие информации;
2) Привлекать внимание;
3) Помогать сориентироваться в интерфейсе.
Иконки настолько хороши, насколько содействуют достижению этих целей. Правда, кроме задач следует учитывать и среду их решения.
Для выполнения первой и второй задачи иконки традиционно используются в таких разделах сайта, как:
- преимущества;
- схема работы;
- виды оказываемых услуг.
Классический пример решения третьей задачи — размещение изображения покупательской корзины в правом верхнем углу большинства интернет-магазинов.
Иконки чаще всего сопровождают преимущества компании. Это один из самых главных разделов сайта. Именно здесь потребитель принимает решение, стоит обращаться к вам или нет. Поэтому сплоховать здесь ну никак нельзя.
Ключевая особенность иконок в преимуществах — максимальная понятность, моментальная считываемость смысла. Иконка должна визуально выражать преимущества, облегчать их восприятие, а не осложнять. Иногда даже лучше пожертвовать красотой и оригинальностью в угоду практичности.
Те же принципы применимы к иконкам в разделе услуг. Например, так мы отразили строительное направление на площадке для организации тендеров:
Иконки разбивают текст. Интернет-пользователи не склонны особо вчитываться. Иконки же позволяют визуально облегчить чтение, внести иерархию.
Иконки — зеркало дизайна сайта
Иконки позволяют выразить индивидуальность и качество подхода дизайнера. Причем как на уровне замысла, так и в плане технического исполнения.
Говоря о формате. Мы на многих сайтах используем SVG иконки. Они отрисованы в векторе, то есть по сути представляют собой математические формулы, а не обычные изображения. Такая оцифрованность позволяет им увеличиваться до любых размеров, сохраняя исходное качество. Иконка в SVG одинаково будет выглядеть как на бюджетном смартфоне, так и на плазменном экране во всю стену.
Например, так при многократном увеличении выглядит одна из иконок на разработанной нами тендерной площадке группы компаний «Гарез и Партнеры»:
Касаемо замысла. Оригинальные иконки необходимы не в любой ситуации. Однако, нестандартные иконки приковывают взгляд, особенно если замысел интересный. Такие иконки под силу разработать только профессиональным дизайнерам.
Иногда такие авторские иконки настолько оригинальны, что становятся своеобразной «фишкой» в оформлении сайта. В качестве примера можем привести иконки, отрисованные нашим дизайнером для сайта клуба путешествий «Кот в сапогах».
Сначала каждую иконку нарисовали карандашом:
Потом обвели черной ручкой, перевели в электронный формат:
Затем разместили на сайте:
Тут подводный камень — не заиграться. Все таки нужно понимать, что иконка должна повышать вероятность конверсионных действий на сайте, а не служить чисто декоративным элементом.
Главное, помнить: иконки выражают эстетику компании. Как, впрочем и другие визуальные элементы. Так, иконки на сайте производителя промышленного оборудования могут быть помассивнее, поувесистей. А вот иконки на лендинге средства для похудения напротив, должны быть легкими, воздушными, как перышко в руках юной балерины.
Каких ошибок следует избежать при работе с иконками
1) Отрисовка иконок не должна стать самоцелью. Мы считаем неправильным использовать абстрактные отрисованные графические иконки там, где нужны реалистичные изображения. Например, на этом сайте производителя многопрофильного лабораторного оборудования:
2) Цвет и стилистика и иконок не должны быть случайными. Они должны быть согласованы с фирменным стилем.
3) Иконки не должны быть слишком детализированными. То есть, в них в принципе не должно быть много слишком мелких деталей. Ведь иконки сами по себе отличаются небольшим размером.
4) Не следует злоупотреблять эффектами. Далеко не всегда стоит добавлять блики и тени. Часто вместо ожидаемого эффекта это создает лишь визуальный шум, перегруженность и даже «грязь» при некоторых разрешениях.
5) Не стоит использовать иконки одинаковой формы. Если иконки, относящиеся к совершенно разным явлениям, похожи по форме друг на друга, мозг пользователя тщетно начинает искать взаимосвязь между ними.
6) Не перегружайте. Лучше проще, больше крупных деталей. Пожалуй, принцип минимализма в веб-разработке находит максимальное выражение именно в иконках.
7) Не включайте в иконку текст. Во-первых, на многих устройствах он будет совсем уж мелким и нечитабельным. Во-вторых, это убивает саму идею иконки.
«Мелочи» в комплексе решают все
Как видите, есть множество нюансов, которые следует учесть при выборе иконок для сайта. А ведь мы даже не разбирали актуальных тенденций оформления иконок, не углублялись в их классификацию. Полноценный разбор подразумевал бы целый цикл статей.
Также мы не поднимались на уровень оформления какого-либо раздела сайта целиком. Мы всего лишь разобрали один маленький веб-элемент. Он занимает всего несколько десятков пикселей на экране устройства пользователя. Однако даже для него на практике выработан целый ряд рекомендаций. А ведь существуют еще и исключения из правил. Допустимость таких исключений в конкретной ситуации способен определить только настоящий профессионал, излагать логику их допущения здесь мы не будем.
Современная веб-разработка это очень широкая область знания. Разбираться в ней необходимо годами. Причем все-равно останетесь специалистом в узкой области и только любителем в смежных сферах.
Впечатление же пользователя в значительной степени определяется дизайном сайта. Как говорится, «встречают по одежке». А это впечатление зависит от множества мелочей, одной из которых остаются иконки.
Суть нашего предложения заключается в том, что вы делегируете задачу формирования необходимого впечатления профессионалам, а сами сосредоточитесь на операционных вопросах своего бизнеса. В конце концов, разделение труда — проверенный временем принцип. Наши дизайнеры получали специализированное образование, нарабатывали опыт годами, оттачивали навыки на многочисленных тренингах и мастер-классах с лидерами отрасли.
Заказывая разработку сайта в нашем агентстве вы можете быть уверены, что даже самые малозначимые на первый взгляд элементы будут содействовать повышению ваших продаж. Это особенность нашего подхода, основанного на жесткой системности и внимании к мелочам. Выберите рекламного подрядчика, которому вы доверяете и получите веб-ресурс, на котором нет ни одной лишней детали!
Комментарии