Готовим изображения правильно до последнего байта
Полина Гуртовая и Рита Клубочкина опубликовали в блоге Злых Марсиан большую статью про использование изображений в вебе — "Images done right: Web graphics, good to the last byte".
В начале статьи рассказывается про то, как CSS-пиксели матчатся на экраны устройств, и почему физический размер пикселей отличается у мониторов и смартфонов. Есть разделы, посвящённые SVG и самым популярным форматам растровых изображений. Для меня самое полезное — сравнение результатов работы разных инструментов для разных форматов. Например, для сжатия PNG лучше всего подходит ImageOptim, а JPEG лучше всего жмут Squoosh и Imagemin. Есть бенчмарки с WebP, которые показывают его эффективность по сравнению с PNG и JPEG. Для анимациий не рекомендуют использовать GIF, вместо него рекомендуется использовать mp4 или webm. В самом начале статьи есть cheat-sheet, который может помочь с выбором наиболее подходящего формата.
Статья очень хорошая. Рекомендую почитать всем без исключения.