Иконки для сайта, поиск и создание - Online

[WiZXaK]

Иконки для сайта - "мелкая" деталь дизайна сайта которая меняет все!
Основная задача иконок - упрощения процесса восприятия и обработки информации пользователем сайта.
Считаю, что создание иконок должно производиться совместно с общим дизайном сайта (создаваться вами в графическом редакторе ), но в случаях острой необходимости (а скорее особой лени и экономии) необходимо найти готовые иконки для сайта.

Генераторы иконок:
Для просмотра ссылки Войди или Зарегистрируйся - Отличный генератор иконок.
Для просмотра ссылки Войди или Зарегистрируйся - Резайз изображений до иконки.
Для просмотра ссылки Войди или Зарегистрируйся - Оптимизатор изображений.
Для просмотра ссылки Войди или Зарегистрируйся - Конвертер иконок.
Для просмотра ссылки Войди или Зарегистрируйся - Интересный сервис текстовых иконок.
Для просмотра ссылки Войди или Зарегистрируйся - Генератор Лого (иконок).
Для просмотра ссылки Войди или Зарегистрируйся - Поиск и подбор иконок.
Для просмотра ссылки Войди или Зарегистрируйся - Настройка и формирования GIF индикатора процесса. (Загрузка...)

Поиск иконок:
Для просмотра ссылки Войди или Зарегистрируйся
Для просмотра ссылки Войди или Зарегистрируйся
Для просмотра ссылки Войди или Зарегистрируйся
Для просмотра ссылки Войди или Зарегистрируйся
Для просмотра ссылки Войди или Зарегистрируйся
Для просмотра ссылки Войди или Зарегистрируйся
Для просмотра ссылки Войди или Зарегистрируйся
Для просмотра ссылки Войди или Зарегистрируйся

Наборы иконок:
Для просмотра ссылки Войди или Зарегистрируйся - Архив иконок.
Для просмотра ссылки Войди или Зарегистрируйся - Большой набор иконок.
Для просмотра ссылки Войди или Зарегистрируйся - Жесты.
Для просмотра ссылки Войди или Зарегистрируйся - Набор монохромных иконок.
Для просмотра ссылки Войди или Зарегистрируйся - Заглушки изображений и иконки.
Для просмотра ссылки Войди или Зарегистрируйся - Набор чернобелых иконок.
Для просмотра ссылки Войди или Зарегистрируйся - Иконки "Символы" Юникод.
Для просмотра ссылки Войди или Зарегистрируйся - Коллекция мнемографики.
Для просмотра ссылки Войди или Зарегистрируйся - Архив бесплатных иконок.
Для просмотра ссылки Войди или Зарегистрируйся - Набор иконок по категориям.

Бонус:
Для просмотра ссылки Войди или Зарегистрируйся - Онлайн генератор изображений 3D коробки

Основные ошибки при создании иконок​

1) недостаточная различимость иконок (плохое качество)
2) слишком много элементов в одной иконке (загруженность иконки)
3) лишние элементы (иконка должна легко «читаться»)
4) отсутствие единого стиля иконок (непохожие по размеру, цвету, типу графики и т.д. - это ужасно).
5) ненужная перспектива и тени в мелких иконках (тень как клякса)
6) слишком оригинальные метафоры (wtf кракозябры)
7) нет учета национальных и социальных особенностей (непонимание картинок некоторыми людьми)
8) не используйте изображения элементов интерфейса в иконках
9) внимательней относитесь к тексту внутри иконок (это скорее замечание)
10) мимо пикселей (размытые границы маленькой версии иконки).
11) Использование готовых иконок из сети =)
12) Стиль иконок должен соответствовать стилю всего сайта.
13) Использования иконок не к месту - (иконки должны грамотно информировать или для удобства заменять текстовый смысл информации, для пользователя - это их основная задача).

P.S: хорошая статья на тему: Для просмотра ссылки Войди или Зарегистрируйся

 

[RST]

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

 

[tdk25]

Для просмотра ссылки Войди или Зарегистрируйся — бренды в векторе, отлично подходят для создания иконок.

 

[arsen]

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

Открой свою иконку в adobe photoshop
1 Продублируй слой
2 нижний слой отключи( значок глаза на панели слоев(ориентировочно правый угол)- ты получил прозрачный фон
3 выдели верхний как рабочий(кликни по нему) и удали белое(или дурой фоновый цвет) стиркой или быстрым выделением
4 сохраняй в формате PNG или GIF