Какой оптимальный размер иконок и стоит ли использовать SVG?

Question

[Александр]

Почему иконки в основном размерами 32, 48, 64 и т.д. пикселей? Стараетесь ли использовать иконки с размерами дробными 2? Чем навеяно: использую иконки с icons8.com, там размеры 50 пикс., 100 пикс. Сжимаю до 48 пикс. - так в качестве теряется, понятно. Имеет ли смысл вообще сжимать или так и использовать 50 пикс. иконки? Для мобайла планирую просто в 2 раза уменьшать их, тем самым и четкость на ретинах будет, если png.
Скажете, использовать SVG? На icons8 мне не купят svg-иконки, рисовать их тоже некому и долго. Иконочные шрифты - нет нужных иконок в FontAwesome, у других бесплатных еще меньше набор. Либо может есть где бесплатно много svg иконок?

Answer 1

[Vlad Feninets]

если вы имеете ввиду viewbox для SVG, то лучше дробные 2м - иначе могут плоховато рендериться.
сжимать можно при помощи SVGO, удалит ненужные теги из svg.

тут https://thenounproject.com очень много иконок в svg, можно бесплатно качать - будет снизу текст, но он легко удаляется в редакторе.

Answer 2

[alvvi]

"у других бесплатных еще меньше набор", ну, вы недооцениваете другие наборы.

У Material Design довольно приличная коллекция, а количество более мелких коллекций, которые можно использовать на небольших-средних проектах, слишком велико, чтобы перечислить их в одном посте, кое-кто этому целую статью посвятил.

Много почти бесплатных svg-иконок можно найти на flaticon .
Почему почти? Их использования предполагает упоминание автора. Избежать этого можно купив подписку, но цена смешная, меньше 8$ в месяц при годовой подписке, по сравнению с 20$ icons8 вполне себе неплохо.

Еще есть iconfinder, подписка тут дороже, зато есть полностью бесплатные икноки (правда, они обычно довольно низкого качества, имхо) и в целом иконок в 3-4 раза больше.

Answer 3

[Максим Тимофеев]

и стоит ли использовать SVG?

Очень caniuse.com/#search=svg Это даже не будущее, это настоящее

Почему иконки в основном размерами 32, 48, 64 и т.д. пикселей

Соответственно частоте использования

Сжимаю до 48 пикс. - так в качестве теряется, понятно

Не понятно. Смотря что, чем и как сжимать.

может есть где бесплатно много svg иконок?

А в чем проблема если есть png иконка, например, сделать из нее svg? Есть онлайн сервисы для этого и есть великолепное ПО - inkscape.paint-net.ru/?id=1

Comments

[Александр]

Сжимаю иконку шириной в 50 пикселей, скачанной с icons8, до 48 пикс., сразу линии, которые были в ней по 2 пикс. становятся размытыми, естесственно.

[Максим Тимофеев]

Александр: сжимайте не 50, а 100, но я бы советовал их переводить в вектор с помощью ПО (inkscape) или онлайн сервисов https://convertio.co/ru/png-svg/