Добавить в корзинуПозвонить
Найти в Дзене
Веб-студия Pliaron

Как сжимать изображения для сайта

Подробный гайд про сжатие изображений без потерь, чтобы ускорить загрузку сайта. Бесплатные WordPress плагины и топ сервисов для сжатия изображений.
Оглавление

Гайд подойдет для всех типов сайтов. Будь то блог на WordPress, лендинг или интернет магазин. Мы рассмотрим топ сервисов для оптимизации и сжатия изображений вручную и топ плагинов WordPress для автоматического сжатия изображений.

Для чего нужно оптимизировать изображения

Размер изображения сильно сказывается на скорости загрузки сайта. Скорость загрузки в свою очередь сказывается на позициях в поисковиках. Обязательно оптимизируйте изображения перед их загрузкой на сайт.

Оптимизация изображений без потери качества

Существует распространенная проблема плохого качества изображения после оптимизации. Это происходит из за большого веса изображения. Если перед загрузкой изображения на сайт, вы редактируйте его в фотошопе, то постарайтесь изначально сохранить его с наименьшим размером. Для этого нажмите сочетание клавиш Ctrl + Alt + Shift + S, и сохраните изображение для веб сайта. Если изображение весит менее 3 мегабайт, то с такой проблемой вы вряд ли столкнетесь. Алгоритмы уже давно научились качественно сжимать изображения так, что человеческий глаз даже не заметит разницу с оригиналом.

Какой формат изображений лучше использовать

Webp - самый лучший на данный момент формат изображений, разрабатываемый Google. Его поддерживают все популярные браузеры: Google Chrome, Яндекс Браузер, Mozilla Firefox, Safari, Microsoft Edge, Opera, Vivaldi и Internet Explorer. Более подробная информация про поддерживающие формат Webp браузеры доступна здесь: https://caniuse.com/webp.

Топ сервисов для сжатия изображений

Optimizilla

Популярный и эффективный оптимизатор изображений. Позволяет сжимать PNG и JPEG с минимальными потерями качества.

-2

За раз можно оптимизировать до 20 изображений. Если просто загрузить их на сервис, то он автоматически оптимизирует изображения с минимальными потерями качества, но отрегулировать степень сжатия самостоятельно тоже можно.

Compressor

Максимальное сохранение качества при уменьшении размера фотографии. Позволяет оптимизировать JPEG, PNG, SVG, GIF и WEBP.

-3

Вес оригинала фотографии составлял 8.09 МБ, благодаря Compressor его удалось уменьшить до 2.13 МБ, без видимых потерь качества. За раз можно оптимизировать до 10 картинок.

Squoosh

Не очень популярный сервис от Google для сжатия изображений.

-4

Чем-то напоминает Compressor. Так же сжимает фото без потерь качества, но с чуть большим размером. Фото весом в 8.09 МБ сжал до 2.6 МБ. За раз можно оптимизировать до 1 изображения.

Топ WordPress плагинов для сжатия изображений

Smush

-5

Самый популярный WordPress плагин для сжатия изображений. Позволяет в один клик оптимизировать до 50 картинок за раз при весе менее 5 МБ каждая. Поддерживает сжатие при загрузке в библиотеку медиафайлов, добавляет поддержку ленивой загрузки изображений на сайт и предоставляет статистику сэкономленного места.

Robin image optimizer

-6

Не менее известный плагин для уменьшения размера картинок. Позволяет сжимать любые изображения весом до 5 МБ. Отлично подойдет если у вас имеется множество не оптимизированных картинок в библиотеке медиафайлов, так как у него нет ограничений на количество снимаемых изображений за раз. Поддержка оптимизации при загрузке тоже присутствует.

Image optimization by Optimole

-7

По функционалу напоминает Smush, но позволяет оптимизировать все виды изображений, в том числе и для экранов с Retina дисплеем. Добавляет поддержку ленивой загрузки изображений на сайт, позволяет оптимизировать до 5000 изображений в месяц для бесплатной версии.

Заключение

Всеми сервисами и WordPress плагинами мы пользовались лично, так что с уверенностью можем назвать лучшие. Лучшим сервисом для сжатия изображений является Optimizilla, а вот с плагинами всё немного сложнее. Если нужно сжатие картинки при загрузке, то Smush. Если нужно оптимизировать за раз огромное колличество фото в библиотеке, то Robin image optimizer.

Оригинал статьи: https://pliaron.com/kak-szhimat-izobrazheniya-dlya-sajta/

Наши услуги: https://pliaron.com/uslugi/