24 «привычки» оптимизации изображений

[SerjioValentes]

Почему png, а не avif раз мы говорим об оптимизации?

[AndrewYaremko]

Есть пункт «конвертируй в webp» и avif не сильно от webp отличается в плане оптимизации. А у пнг есть png-8.
В свое время я рассматривал этот формат, но не вспомню почему к нему не пришел. если правильно помню, то выбрал webp из за большей поддержки и развития со стороны Гугла, помня про провал apng

[Metotron0]

У меня почему-то сильно отличается в размерах при одинаковой читаемости для моего глаза (я на 4k).

[nerudo]

Ничего не нашел про качество jpg. Куда бегунок ставить, на 99 или 70 будет достаточно?

[AndrewYaremko]

Эта тема достойна отдельной публикации и в сети вы найдете множество из них. Мое личное мнение — все зависит от того, акцентное изображение или нет, что на нем изображено, какие устройства у трафика и как будет масштабировать браузер изображение (с какой кратностью вы сохраняете его). В большинстве случаев резать качество в угоду скорости можно.
+ разные алгоритмы по разному пережимают.
Тут надо представлять ситуацию, в которой вользователь смотрит на картинку, если это беглое знакомство на сайте/лендинге - режте. Пользователь ведь не дизайнер, он всматриваться в джипег не будет.

[Ayawaskay]

Штош, поглядимс. Я как раз искал что-то подобное.

[AndrewYaremko]

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

[Ayawaskay]

Хех, в основном покачто 16, где ссылка на onlinepngtools.

[volosukalisa017]

Согласна, с SVG надо либо работать правильно, либо не работать с ним вообще

[Metotron0]

текст выноси из изображения и печатай его отдельно текстом

Но тогда придётся подключить инженерный шрифт (в данном случае). Интересно, что займёт больше трафика.

Про 2x-изображения не понял, в чём сложность. srcset в img решает эти проблемы, как и picture с source, в котором srcset. Я написал себе маленькую тулзочку, которая из 2x делает 1x и заодно ещё конвертирует в webp или avif, а можно сделать оба варианта и выбрать лучший.

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