Некоторые типы иконок, которые используются в современном веб-дизайне:
- Информационные. 1 Передают какое-то сообщение пользователю. 1 Например, иконка звёздочки может означать, что поле обязательно для заполнения, а иконка восклицательного знака — что есть предупреждение или ошибка. 1
- Навигационные. 1 Помогают пользователю перемещаться по сайту или приложению. 1 Например, иконка гамбургера может открывать меню навигации, а иконка стрелки — возвращать на предыдущую страницу или экран. 1
- Интерактивные. 1 Запускают какое-то действие или функцию при нажатии или наведении. 1 Например, иконка корзины может добавлять товар в список покупок, а иконка сердечка — ставить лайк или добавлять в избранное. 1
- Брендовые. 1 Представляют какой-то бренд, компанию или продукт. 1 Они могут быть частью логотипа или фирменного знака. 1 Например, иконка яблока — это символ компании Apple. 1
- Иллюстративные. 1 Изображают какой-то объект, сцену или персонажа. 1 Они могут быть детализированными или стилизованными. 1 Например, иконка домика может иллюстрировать раздел о недвижимости, а иконка смайлика — раздел о настроении. 1
- Метафорические. 1 Используют какую-то метафору или ассоциацию для передачи смысла или эмоции. 1 Они могут быть абстрактными или символическими. 1 Например, иконка лампочки может означать идею или творчество, а иконка сердца — любовь или здоровье. 1
- Декоративные. 1 Не несут в себе какого-то смысла или функции, а просто украшают дизайн или подчёркивают стиль. 1 Например, рекламный баннер может быть украшен иконками цветка, но на них не акцентируется внимание, они просто украшают фон. 1
Также в зависимости от типа графики иконки делятся на векторные (формат SVG), растровые (формат PNG) и символьные (форматы шрифтов). 4