5 советов о том, как разработать иконку для сайта

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

Руководящие принципы

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

1. Необходимо понять проблему разработки иконки

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

После пересмотра концепции, была разработана несколько иная иконка:

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

2. Предпримите комплексный подход

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

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

3. Чем проще, тем лучше

Следуя данному совету, была разработана иконка, где файл просто помещен в треугольник:

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

4. Обратите внимание на контекст

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

5. Семиотика

Семиотика — один из основных факторов в типографии. Например, декоративный шрифт несет в себе оттенок женственности, а комический шрифт может относится к сайту, посвященному детям и нести оттенок игривости.

Таким образом, со значком к сообщению об ошибке доступа к документу (файлу) можно составить список встречающихся иконок, которые оптимально соотносятся с сообщением об ошибке, и которые не так сильно будут пугать пользователя. Для этого была вызвана ошибка в браузере Google Chrome.

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

Источник: http://webdesign.tutsplus.com/