Современные длинные интернет-проекты вынуждают
пользователя постоянно скроллить. А в эпоху информационного бума
текстовая информация зачастую просматривается “вскользь”, что часто
способствует пропусканию важной информации. Векторные иконки для
сайтов и приложений — это небольшие картинки, обозначающие
какое-либо действие или ведущие на определенный раздел. Они
просты, лаконичны, но в одну картинку зачастую можно уложить целое
предложение или фразу. Они привлекают внимание или доносят важную
информацию до посетителя.
Виды значков-иконок по типу отображения
Контурные (очерчен контур одним цветом).
Плоские (цветное изображение в 2
координатах).
Объемные (3D-изображение).
Анимированные для сайта (подвижные).
Где они могут размещаться
Программное обеспечение и оболочки — на экране
пользователя.
Онлайн-сервисы.
Интернет-ресурсы различных видов (инфо, порталы,
лэндинги, интернет-магазины и др.).
Перед ссылкой на сайт в поисковой системе —
фавиконки.
Для идентификации приложений на гаджетах.
Исходя из места размещения пиктограмм, их также можно
разделить на несколько видов.
Для навигации. Они необходимы для того, чтобы человек
мог легко ориентироваться. Например, стрелка указывает направление
движения взгляда по экрану. Также известны и другие символы:
корзинка (тележка) отправляет за покупкой, конвертик — на форму
обратной связи, домик — на главную страницу.
Для получения информации. Пиктограммы не обязательно
будут ссылаться на какой-то другой материал. Они могут рассказать
об услугах, ценностях компании, достижениях. Как правило, значки
сопровождаются кратким пояснением.
Для побуждения к действию. Использовать такие
пиктограммы следует с большой осторожностью, так как человек может
интерпретировать изображение по-своему. Например, жирная стрелка
вниз может указывать как на скачивание, так и на скроллинг вниз. К
таким картинкам советуем добавлять подписи.
Польза применения значков-иконок
Сокращают информацию. Можно вместить целый блок
информации всего в одну картинку.
Привлекают внимание.
Побуждают пользователя сделать клик или скачать что-то
(приложение, материал, открыть интернет-проект в поисковой
системе).
Делают удобной навигацию, а дизайн —
привлекательным.
Чем интереснее значок у приложения — тем чаще его
скачивают. На веб-проект, у которого есть фавиконка, кликают чаще,
чем на тот, у которого ее нет. Если на веб-ресурсе или его
мобильной версии есть пиктограммы — то посетители быстрее и проще
ориентируются, снижается количество отказов, и растет рейтинг
веб-проекта в поисковой системе.
Как правильно разрабатывать иконки
Теперь, когда вы знаете, какие бывают иконки-значки,
давайте поговорим о том, как ими правильно
пользоваться.
Все изображения должны быть в одном стиле. Например,
если используются черно-белые пиктограммы, то они все должны быть
одного типа.
Картинка не должна быть слишком сложной. Ее главная
задача — быстро и просто донести до человека мысль, а не заставлять
его задумываться, что изображение означает.
Много значков на веб-ресурсе портят его, добавляют
пестроту.
Если изображение куда-то ведет — помогите посетителю это
понять. Например, оно может менять цвет при наведении
курсора.
Анимационные изображения привлекают, но утомляют людей.
Поэтому их не должно быть много.
Значок не должен восприниматься двусмысленно. Он должен
явно указывать на действие или понятие, помогать
восприятию.
Где брать иконки
Заказать в дизайн-студии. Создание значков — процесс
очень творческий, так как в одну картину нужно уложить ясно и
понятно текстовый материал.
Например, один из порталов по страхованию заказал
подобную разработку.
Получились очень интересные изображения. Щит на заднем
фоне привлекает внимание и указывает на функцию защиты, символы на
фоне щитов, выполненные в едином стиле, говорят о сфере (тематике)
вышеуказанной защиты (юрлица, ОСАГО, недвижимость,
путешествия и т.д.).