В этой статье рассмотрим очень нужный онлайн сервис с помощью которого можно уменьшить размер картинок в среднем на 90%, а так же плагины для WordPress и его API. Пригодится это всем веб-разработчикам, особенно для верстки макетов.
Сжимать изображения можно прямо на сайте TinyPNG бесплатно и без регистрации. Нужно всего лишь перетащить файлы в формате .png или .jpg в поле Drop your .png or .jpg files here! и дальше сервис все сделает сам. Вам лишь останется загрузить уже обработанные изображения.
В примере ниже удалось сжать фоновое изображение для верстки с 859.2 KB до 43.6 KB. Это 95%! При чем видимое качество нисколько не потерялось.
Скачать можно по ссылке download, а если вы загрузили несколько изображений, то их можно скачать архивом по кнопке Download all.
Плагин для WordPress
Compress JPEG & PNG images от TinyPNG — плагин для WordPress с помощью которого можно оптимизировать все изображения на сайте, как при новой загрузке, так и уже загруженные до его установки.
После установки плагина необходимо получить API key. Сделать это можно на сайте TinyPNG в разделе Developer API:
Подборка бесплатных IT-курсов и вебинаров от Skillbox.
Бесплатные IT-курсы, нужно только пройти онлайн-тест здесь
После получения API ключа, его нужно добавить в настройка плагина Настройки → Медиафайлы → Your Tiny PNG Key.
Вот и все, теперь все вновь загруженные изображения будут сжиматься автоматически. А чтобы оптимизировать старые, необходимо в библиотеке файлов: Медиафайлы → Библиотека отметить все изображения и выбрать Bulk Compress PNG в меню действия. Разработка корпоративного сайта Или оптимизировать по одному, если изображений не много в колонке PNG Compression → Compress now.
TinyPNG API
У сервиса есть свой API и документация по нему для различных языков. Ниже рассмотрим небольшой пример для языка PHP. Полная документация находится здесь.
Для начала необходимо скачать библиотеки TinyPNG через composer или по ссылке в документации. И подключить их свой проект:
У сервиса есть плагин для Photoshop, но он платный. На данный момент его стоимость 65$. Скачать его можно на том же сайте в разделе Photoshop. После установки в программе появится новое меню, через которое можно будет производить те же операции, что и через онлайн сервис.
Если вам понравилась статья, вы можете отблагодарить автора любой суммой, какую сочтете для себя приемлемой:
Поделиться:
Остались вопросы по статье? Задайте их прямо сейчас!
Хочу рассказать об очень классном хостинге, которым я начал пользоваться примерно год назад - это beget.ru. До этого мне приходилось иметь дело с разными хостинг-компаниями и все, что я расскажу основано на моем личном многолетнем опыте. Долгое время я пользовался Читать далее
Git - это бесплатная система контроля версий с открытым исходным кодом. Это звучит невероятно скучно до тех пор, пока вам не понадобится вернуться к предыдущей версии кода, и сделать это удачно. Это программное обеспечение, которое управляет вашим исходным кодом, снимая Читать далее
Подборка бесплатных IT-курсов и вебинаров от Skillbox.
Бесплатные IT-курсы, нужно только пройти онлайн-тест здесь
Если у вас есть насыщенный информацией веб-сайт или приложение, вы можете визуализировать свои данные, чтобы пользователи могли лучше понять их. Хотя таблицы могут быть весьма полезны в некоторых случаях, таких как таблицы сравнения цен и характеристик, другие виды информации легче Читать далее
К сожалению в Instagram нет стандартного функционала для вывода виджета на сайт, такого как например Вконтакте и Facebook. Но есть несколько способов создать подобный виджет. Первый это написать такой самому, второй воспользоваться готовым кодом конструктора. По сути конструктор это тоже Читать далее
freepic - это бесплатный фотосток, поддерживающий русский язык, на котором можно совершенно бесплатно и без регистрации скачать векторы, PSD, иконки и фотографии. И конечно же легально использовать их на своих ресурсах. Сайт: ru.freepik.com У сервиса есть удобный поиск с фильтром Читать далее
Довольно распространённая проблема, когда после добавления ссылки на внешнюю страницу в соц. сеть, её данные, в том числе и изображение, кэшируются, и при последующем изменении остаются прежними. В этой статье вы узнаете, как можно очистить кэш расшариваемых внешних страниц сайта Читать далее
Wappalyzer - это кроссплатформенная утилита, которая определяет технологии, используемые на веб-сайтах. Она обнаруживает системы управления контентом, платформы электронной коммерции, веб-фреймворки, серверное программное обеспечение, аналитические инструменты и многое другое. Установить Weppalyzer можно как плагин для браузеров Google Chrome и Firefox, а Читать далее
Один комментарий на «Как сжать изображение онлайн без потери качества»
Спасибо пригодилось!