Показатель отказов: от чего он зависит?

Показатель отказов – важный параметр работы сайта. Он показывает, насколько ресурс интересен и полезен для пользователей. Соответственно, чем ниже процент отказов, тем вы...

Копия сайта и необходимость ее создания

Несмотря на то, что сайт – это не вещь, его тоже можно потерять. Серьезные проблемы с интернет-порталом могут быть результатом:Посягательств со стороны злоумышленников. П...

Грамматические ошибки на сайте: накажут ли за них поисковики?

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

Как правильно выбрать иконки?

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

Универсальный символизм и фигуры

Например, в программе Mondrian.io для обозначения инструмента «Текст» часто используется значок печатной машинки. В первую очередь, ваши иконки должны быть легко и быстро узнаваемы. Не делайте их слишком замудренными.

Порой, встретившийся красочный набор иконок может вас очаровать, но когда вы начнете интегрировать его в дизайн сайта, то может выясниться, что он не вписывается в задуманную концепцию. А иногда, вам может захотеться быть очень оригинальным в выборе иконок. «А почему бы не поставить значок ракеты для кнопки отправки сообщения?» - рассуждаете вы. Основное правило: если у вас есть сомнение в правильности выбора, значит вы с большой долей вероятности приняли неверное решение.

Mondrian.io - это векторное приложение для интернет-браузера с открытым исходным кодом, которое выглядит очень многообещающе, и, в то же время, оно прекрасно иллюстрирует дилемму выбора подходящего набора иконок. Текущая (на момент написания статьи) версия Mondrian использует иконку печатной машинки для инструмента «Текст». На первый взгляд, такой выбор может показаться вполне резонным. В конце концов, печатная машинка является реальным печатным инструментом, верно?

Однако спросите себя:

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

Сможет ли школьник средних классов легко понять назначение иконки?

Где еще, кроме кино, вы последний раз видели настоящую печатную машинку?

Печатная машинка, как символ письма, технологических достижений и современных офисов, утратила свое значение 30 лет назад. Еще с начала 80-х годов прошлого века сложилась традиция изображать значки текстовых инструментов в виде заглавной буквы «T» или «A». Любой человек, от секретаря, использующего MS Word, до архитектора, работающего в Autocad и с серьезными 3D-пакетами, легко поймет смысл этого символа.

Запомните: если у вас есть возможность использовать проверенный временем способ, то не будьте слишком гордыми – используйте его.

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

Если вы не уверены в своем выборе, не бойтесь его опробовать: поспрашивайте своих друзей и семью, что они об этом думают.

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

Выбор размера и расположения

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

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

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

Цвет и согласованность

Как дизайнеры, мы хорошо осведомлены, насколько важен подбор цветов.

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

Также, имейте в виду, что иконки служат иной цели, нежели изображения или диаграммы — они являются «визуальной рукой помощи» и служат для облегчения взаимодействия, а не вспомогательными картинками или декоративными элементами. Это значит, что приоритетом для вас является не детальность и не цвета. Серьезный вопрос заключается в том, как много цветов вам нужно, чтобы достигнуть поставленных целей, и нужны ли вам цвета вообще. Хороший значок это по своей сути визуальное примечание, а не картина маслом.

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

Источник