Оптимизируйте изображения | PageSpeed Insights | Google


Работая сегодня над оптимизацией сайта после тестирования скорости загрузки и отображению на мобильных через Google PageSpeed Insights, уделил время оптимизации изображений. Не стал скачивать оптимизированные картинки, вернее я их скачал, но сервис по не понятной для меня причине сам изменил размеры сторон исходных изображений, причем не пропорционально. Поэтому решил каждую картинку в ручную пересохранить через Photoshop. Сразу сделаю акцент на том, что в данном примере работал с полноценными фотографиями объектов, предметов и пр.

Для этого использовал функцию "Save for Web". Для небольших изображений, размер которых не превышал 500х500 рх, использовал минимальное качество для формата jpg. Для парочки фото в слайдере оставил качество medium, т.к. слайдер был расположен на всю ширину экрана и артефакты на фото были все-таки заметны при низшем качестве.

При первом тесте, скорость загрузки для десктопов была 29 из 100, для мобильных была 28 из 100. Плохой показатель. Сделав оптимизацию только лишь одних изображений, получил результат 65 из 100, и 48 из 100 соответственно. Причем общий вес изображений уменьшился в три раза. Не плохо я считаю.

После данного небольшого эксперимента, наглядно увидел, что сохранять все изображения (полноценные фотографии) в Photoshop следует только через функцию “Save for Web” и не стоит для изображений с небольшим соотношением сторон ставить hight-качество. @DenisBuryi

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.

Responses
The author has chosen not to show responses on this story. You can still respond by clicking the response bubble.