Использование иконок на сайте

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

Для чего они используются

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

Как получить иконки

• Купить, либо же скачать, имейте ввиду что у каждой иконки индивидуальный стиль и бывают моменты, когда тяжело найти подходящую. Примеры магазинов: iconfinder.com, iconza.ru, freeicons.net.ru, iconsearch.ru.
• Оформить личный заказ у профессионала, либо у специализирующейся фирмы, цена зачастую высока или близка к среднему уровню цен, но это существенно вам упростит задачу и сэкономит время.

Закономерности грамотных иконок

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

Рекомендации

• Не стоит прям все иконки создавать эксклюзивными, к примеру иконку «rss» можно оставить стандартную или «рассказать» также стоит оставить с привычной миниатюрой.
• Даже самые малые миниатюрки могут стать очень полезными для вашего сайта, и не забывайте только про корректность и ясность иконки.
• Зачастую иконки размещаются по левую сторону от основного текста, справой же стороны размещают намного реже и выглядит это менее аккуратно.
• Размер самих иконок составляет обычно 48x48, 32x32, 24x24 и для фавикон наименьшие 16x16.
• Формат иконок обычно ico, рng, gif, icо особо популярен.
• Если рассматривать со стороны дизайна, то иконки должны сочетаться с имиджем сайта в целом, а именно в цветовой гамме, размерах и прочее.
• Иногда можно воспользоваться игрой цветов в иконке, поиграть тенями и полутонами, сделать ее в трехмерном изображении, но это не всегда уместно, особенно в иконках малого размера.
• Иконка не может собой заменять содержание текста либо его название, зачастую под саму иконку размещают подпись либо же выводят содержание этой иконки, когда наводят на нее курсор.
• Для создания хорошей иконки можно посмотреть у оппонентов как это сделано у них, распишите слова для определения выделяемого блока.
• В некоторых случаях нужно учесть общественные и государственные нюансы, вот к примеру, для страны, которая не пользуется монетами использовать монету для определения оплаты будет нелогично.
• Создавая малую иконку, не стоит пробовать внедрить в нее всю перспективу, вместить в нее целый элемент, поместится лишь малый кусок.
• Не переборщите с количеством иконок, иначе юзеры потеряются в их изобилии и не смогут воспринять содержимое как нужную информацию.
Можно подчеркнуть то что при выборке иконок думайте в интересах читателей, как воспринимается изображение, какие изображения более привычны для читателя. И не забывайте, что иконка лишь отличное дополнение, но она не способна заменить качественное описание.

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

А у меня новая Windows для атеистов. Windows для атеистов -- никаких иконок! :)

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

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