Оптимизация изображений для сайта online. Как онлайн сжать картинки и фото

Опубликовано: 14.03.2016

В данной статье – пошаговой инструкции мы хотим познакомить читателя с возможностью сжимать изображения для сайта, оптимизируя их для публикации в Интернете.

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

Сервис, о котором пойдет речь ниже, позволяет выполнить быстрое сжатие большого числа изображений, картинок, фотографий и прочей графики форматов PNG или JPEG, JPG.

С другими расширениями файлов, к сожалению, данный сервис оптимизации картинок онлайн не работает. Хотя и этого уже достаточно, чтобы сжать изображение и уменьшить его размер для размещения на сайте.

Зачем нужна оптимизация изображений для сайта online

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

Результат такой работы – оптимизированные изображения, реальный вес которых снижается примерно на 10-80%, в зависимости от содержания картинки. Что это реально дает?

  1. Ускорение загрузки картинок на компьютер пользователя.
  2. Меньшая загрузка ресурсов сервера хостинга.
  3. Ускорение работы сайта.
  4. Минимизация занятости канала интернет-соединения, что актуально при ограниченном мобильном трафике.

Получается, что оптимизированное изображение выглядит почти как оригинал, а мелкая разница в условиях сайта просто незаметна. Зато такая картинка или фотография уже может занимать раза в 2 меньше дискового пространства, чем раньше. Именно поэтому процесс оптимизации изображений онлайн также зовется сжатием.

Кстати, приставка «онлайн» означает, что инструмент работает в режиме реального времени. То есть, сервис доступен по прямой ссылке, открывается в вашем браузере в любое время дня и ночи.

При этом для работы с инструментом вам не придется ничего скачивать, ничего устанавливать на свой компьютер или ноутбук!

Как оптимизировать уже размещенные на сайте картинки

Этот вопрос стоит рассмотреть отдельно, да и справиться с ним могут лишь опытные вебмастера. Если вы понимаете, где на вашем сайте хранятся записи новостей, где сохраняются изображения к статьям, можете браться за их оптимизацию.

Если все это для вас загадка – уж лучше не рискуйте или сначала разберитесь в структуре файлов собственного проекта.

Так вот, любой движок создает для новых статей и публикаций отдельные директории, заносит текстовую часть в базу данных. Из созданных движком папок в любой момент можно просмотреть все изображения, принадлежащие статьям, опубликованным на сайте ранее.

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

Далее можно поочередно сливать картинки и графику на компьютер, пропускать это дело через сервис оптимизации изображений и уже оптимизированные файлы снова возвращать в исходные папки сервера вашего сайта.

Результат этой работы – оптимизация всех картинок и фото на вашем ресурсе, что однозначно ускорит загрузку страничек вашего сайта. Главное – не напутать с картинками!

Похожим образом можно оптимизировать и сжать системные и шаблонные изображения, из которых складывается дизайн вашего проекта. Это еще более ускорит работу системы.

Но хватит о смыслах и целях сжатия изображений онлайн, приступим к практическим экспериментам и знакомству со специальным сервисом — TinyPNG…

Оптимизация изображений для сайта online: пошаговая инструкция

Шаг №1

Переходим прямиком к сервису сжатия картинок по ссылочке ниже:

https://tinypng.com/

1451170884_onlayn-optimizaciya-kartinok-1

Шаг №2

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

Выбирать можно сразу много изображений, несмотря на то, что рекомендуемое количество – 20 штук. Чтобы начать загрузку – выделим изображения и нажмем кнопку «Открыть».

1451170857_onlayn-optimizaciya-kartinok-2

Шаг №3

Сразу же происходит сжатие картинок, и система активизирует ссылки для их скачивания обратно на компьютер. Дополнительная информация сообщает об эффективности процентного сжатия.

Чтобы скачать оптимизированные фото, картинки, графику, жмем ссылки «DOWNLOAD», появившиеся около файлов.

1451170882_onlayn-optimizaciya-kartinok-3

Загрузка обновленных картинок выполняется в ту же папку вашего ПК, куда браузер закачивает и все прочие файлы. Думаем, вы без труда найдете оптимизированные картинки.

Ну, и остается лишь сравнить качество работы этого автоматизированного онлайн сжатия!

Оригинал 288,7 Кб:

1451170824_onlayn-optimizaciya-kartinok-4

После сжатия 75,0 Кб (оптимизация – 74%):

1451170911_onlayn-optimizaciya-kartinok-5

Оригинал 337,0 Кб:

1451170847_onlayn-optimizaciya-kartinok-6

После сжатия 75,2 Кб (оптимизация -78%):

1451170835_onlayn-optimizaciya-kartinok-7



1 0