- Немного технических моментов
- Зачем использовать GIF-изображение?
- Рекомендация: Wondershare Filmora
- Animizer
- Photoscape
- Online-Conventering
- Gifted Motion
- Online Image Editor — множество действий с анимированными gif
- ILoveIMG
- SSuite Gif Animator
- Compressor.io
- Inettools.net — бесплатный сервис для обработки гиф-анимации
- Picasion
- Inettools
- Алгоритм сокращения цветов
- Обрезка анимации
- ToolSon
- Анимайзер
- Save for Web (Сохранить для Web)
- Количество цветов
- Уменьшение размера изображения
- Итоги
Немного технических моментов
Подумать об объемах gif на сайте нужно еще на этапе создания анимации. Объем файла зависит от размеров самого изображения, числа кадров, длительности анимации, а также качество картинки.
- Размеры.
Нужно максимально уменьшить размеры самого изображения. Наиболее приемлемым считается размер стороны не более 640 пикселей.
- Число кадров.
Количество кадров, воспроизводимых в секунду, также влияет на конечный объем файла. По сути, во сколько раз вы сократите число кадров, во столько раз уменьшится размер gif.
При этом рекомендуется сокращать кадры пропорционально, чтобы не повредить качеству изображения. Например, если в анимации 40 кадров, нужно уменьшать из ряда те кадры, которые смогут поделить это число. Для 40 – это 1, 2, 4, 5, 8, 10 и т.д.
- Длительность видео.
Очевидно, что чем дольше длится анимация, тем она объемнее. Вырезайте ненужные сцены и сокращайте время воспроизведения максимально.
- Качество.
Сервисы, которые будут описаны нами ниже, предлагают сжать gif с потерей или без потери качества. В первом случае размер файла сократится.
Зачем использовать GIF-изображение?
GIF редактор может выразить все: от эмоций до коммерческих и маркетинговых идей. GIF-изображения бросаются в глаза потенциальных клиентов при просмотре сайта.
С помощью GIF-изображения можно выразить свой стиль. А также использовать для создания бренда компании, сервиса или продуктов. В интернете доступно множество ресурсов, которые помогут создать GIF.
Рекомендация: Wondershare Filmora
Первая программа в списке – это Wondershare Filmora. Она считается одной из лучших программ для создания видео и GIF-изображений. Она удобна в использовании и предоставляет много функций и более чем 100 визуальных эффектов. А также полный контроль над аудио и видео настройками.
- Проста в использовании;
- Позволяет создавать GIF из статических изображений;
- Позволяет создавать GIF из видео любого формата, например, AVI, MPEG, WAV, DAT, EVO, MKV, MP4, WMV и т.д.;
- Позволяет редактировать GIF с помощью таких команд, как обрезка, комбинирование, поворот, ускорение, замедление, коррекция цвета;
- Позволяет редактировать GIF с помощью замечательных эффектов, текста и субтитров.
Animizer
Animizer — более простой онлайн-сервис, в функциональность которого входит не так много опций. Однако из-за этого он может показаться более удобным для юзеров, которые и не нуждаются в огромном количестве разных инструментов.
- Откройте главную страницу Animizer, где щелкните по кнопке «Выбрать».
- В Проводнике отыщите необходимый для редактирования GIF-элемент.
- Кликните на кнопку «Перейти к редактору», которая стала активной сразу же после выбора картинки.
- Разберем основные возможности этого онлайн-сервиса, начав с «Добавить кадры»: нажмите по кнопке «Загрузить», если хотите соединить несколько GIF или прикрепить к текущей анимации еще несколько кадров.
- Остальные основные функции не требуют развернутого описания. Благодаря переключению маркеров вы можете отключить передачу цветов, настроить прозрачный фон, задать цвет переднего плана, цвет фона, установить скорость анимации и вручную изменить размер холста.
- Откройте «Доп.настройки», чтобы перейти к редактированию каждого кадра, настроить соблюдение пропорций, инвертирование цветов, обратную анимацию и количество проигрываний.
- При редактировании отдельного кадра доступно его отключение и установка времени воспроизведения.
- По завершении настройки GIF щелкните по кнопке «Создать анимацию», применив тем самым изменения.
- Поднимитесь выше и начните скачивание файла.
- Обязательно проверьте его перед публикацией куда-либо, чтобы убедиться в корректности воспроизведения.
Photoscape
С помощью Photoscape можно сделать множество интересных эффектов в своих видео. Редактор GIF включает в себя такие инструменты и функции:
- Редактор;
- Просмотр;
- Анимированные GIF;
- Выбор цвета;
- Кадрирование;
- Фильтры.
Плюсы: проста в использовании.
Минусы: немного медленная.
Online-Conventering
Еще один сайт на русском языке. Сразу предлагается загрузить файл и выбрать процент качества, передвинув бегунок.
К сожалению, ресурс не показывает результаты онлайн. Нужно загрузить оптимизированный файл и проверить качество сжатия самостоятельно.
Gifted Motion
Использует Java и может работать во всех операционных системах. Установка не требуется.
- Позволяет редактировать изображения;
- Поддерживает PNG, JPEG, BMP, GIF
- Лицензия не требуется.
Плюсы: программа проста в использовании.
Минусы: загрузка изображений большого размера занимает некоторое время.
Online Image Editor — множество действий с анимированными gif
Популярен и онлайн сервис Online Image Editor.
- Выберите нужный файл и нажмите “загрузить” или download (в зависимости от того, перевел вам браузер сайт на русский язык или нет).
- Затем нажмите кнопку crop (в строке над изображением).
- В меню под фотографией будут указаны исходные ширина, высота и вес картинки.
- Вы можете подобрать нужную область обрезки при помощи курсора либо ввести необходимые значения в поля слева от изображения.

В завершение операции обязательно нажмите apply и затем save, чтобы сохранить изображение в папку “Загрузки”, загрузить в Facebook или открыть в Picasa. Если вам не понравилась ваша работа на каком-либо из этапов, в строке над фотографией предусмотрена кнопка Undo. Нажимая на которую, можно вернуться к первоначальному изображению и произвести все действия заново.
ILoveIMG
Невероятно удобный и бесплатный онлайн-сервис ILoveIMG позволяет совершать множество самых разнообразных действий с графическими данными, в том числе и сжимать их. Относится это и к GIF-анимации. Осуществляется эта процедура следующим образом:
- Перейдите на сайт ILoveIMG по ссылке выше и выберите раздел «Сжать Изображение».
- Приступайте к загрузке файла из любого доступного ресурса.
- Если для добавления вы используете локальное хранилище, например, жесткий диск или флешку, просто выделите изображение левой кнопкой мыши и щелкните на «Открыть».
- Вы можете добавить еще несколько гифок, если хотите обработать их одновременно. Кликните на кнопку в виде плюса, чтобы раскрыть всплывающее меню.
- Каждый загруженный объект доступен к удалению или повороту на определенное количество градусов.
- По завершении всех манипуляций приступайте к запуску сжатия.
- Скачать все сжатые файлы или выгрузить их в онлайн-хранилище можно, нажав на соответствующую кнопку. Кроме этого начнется автоматическая загрузка архива, если изначально было добавлено несколько изображений.
Теперь вы видите, что в уменьшении размера GIF-анимации нет ничего сложного, весь процесс выполняется буквально в пару кликов и не требует от вас огромных усилий или определенных знаний, достаточно загрузить гифку и запустить обработку.
SSuite Gif Animator
Редактор GIF файлов совместимо со всеми редакциями Windows, включая 32 и 64-битные версии. Это одна из немногих программ, разработанных с использованием зеленых информационных технологий (Green Software) .
Создавайте фильмы, слайд-шоу, анимированные GIF и многое другое.
Плюсы: потребляет мало мощностей устройства, проста в использовании.
Минусы: неполный контроль процесса редактирования.
Compressor.io
И снова англоязычный сервис. На главной странице кликаем Try it!
Попробуем сжать более объемный гиф-файл. Ресурс ограничивает объем загружаемых гифок до 10 Мб. Выберем среднюю – объемом 4.32 Мб.
Compression.io уменьшил наш файл на 61% – до 1.69 Мб! При этом каких-то существенных потерь в качестве мы не заметили.
Интересная возможность – сравнивать исходный файл с полученным «в реальном времени». Можно передвигать курсор по изображению – с оригинального к сжатому, и видеть при этом изменения. Также предлагается загрузить файл на компьютер, Google Drive или Dropbox.
Inettools.net — бесплатный сервис для обработки гиф-анимации
- Перетащите онлайн свою гифку на сайт Inettools.net
- При помощи сетки выберите нужную область.
- Под фотографией будут изменяться значения ее высоты и ширины.
- В этом сервисе вы можете выбрать разрешение равной пропорции, поставив галочку в квадратике под фото, и обрезанное изображение будет иметь равные стороны.
- Нажмите Cut (“Обрезать”), и на следующей странице вы увидите результат проделанной работы.
Данный сервис предоставляет возможность сделать несколько обрезок фото, загрузив результат одним архивом.
Picasion
Picasion позволяет импортировать фотографии или видео из Picasa, Flickr или любой другой галереи. Данный сервис доступен на нескольких языках, включая английский, испанский, португальский и русский. Можно настроить размер изображений, создать и добавить собственный аватар.
Плюсы: простой в использовании бесплатный GIF редактор, поддерживает многие форматы.
Минусы: демонстрирует большое количество рекламы.
Inettools
Некоторые из них позволяют выполнять только базовые операции – это очень удобно, когда большего и не требуется. Другие, как например Movavi Видеоредактор, дают возможность собрать из исходных картинок баннеры, анимационные изображения для презентаций и даже целые видеоролики. Попробуйте на практике эти сервисы и программы, чтобы понять, что вам подойдет лучше всего.
Алгоритм сокращения цветов
- Perceptual (Перцепционный) предназначен для создания пользовательской таблицы цветов, отдавая предпочтение тем тонам, которые чётко распознаёт глаз человека.
- Selective (Селективный) создаёт таблицу цветов, аналогичную Перцепционной таблице, но созданную на ключевых оттенках изображения. В этом алгоритме предпочтение отдаётся web-цветам. В Photoshop он установлен по умолчанию.
- Adaptive (Адаптивный) предназначен для создания пользовательской таблицы цветов спектра, преобладающих в изображении. К примеру, для изображения, в котором больше всего преобладает синих и зелёных цветов, будет создана таблица из синих и зелёных оттенков. Большинство оттенков изображения собирается в определённой области спектра.
- Restrictive (Ограниченный) применяет стандартную палитру, состоящую из 216 безопасных web-цветов. Этот параметр гарантирует, что ни один браузер не применит дизеринг к цветам изображения с 8 битовой глубиной цвета. Если изображение имеет менее чем 216 цветов, то неиспользуемые цвета удалятся из таблицы.
- Custom (Заказная) палитра цветов выбранных пользователем.
Обрезка анимации
Для начала откройте видео-файл в Photoshop. Большая часть видео для всей последовательности GIF анимации нам не нужна, поэтому можете обрезать её, прибегнув к помощи панели Timeline (Временная шкала). Просмотрите видео и найдите подходящий фрагмент, а остальное удалите.
ToolSon
ToolSon – ресурс бесплатных онлайн-приложений, позволяющий всячески взаимодействовать с файлами разных форматов и редактировать их под свои нужды. Работать здесь можно и с GIF-анимацией. Весь процесс выглядит так:
Перейти на сайт ToolSon
- Откройте соответствующую страницу редактора, перейдя по ссылке выше, и нажмите на кнопку «Открыть GIF».
- Теперь следует загрузить файл, для этого кликните на специальную кнопку.
- Выделите требуемое изображение и нажмите на «Открыть».
- Переход к редактированию осуществляется после клика на «Загрузить».
- Дождитесь завершения обработки, опуститесь немного вниз по вкладке и переходите к кадрированию.
- Выделите необходимую область, трансформируя отображаемый квадрат, а когда размер вас будет устраивать, просто нажмите на «Применить».
- Ниже вы можете настроить также ширину и высоту изображения с или без сохранения пропорций. Если это не требуется, оставьте поле пустым.
- Третьим шагом будет применение настроек.
- Ожидайте завершения обработки, а затем кликните на «Скачать».
Анимайзер
Save for Web (Сохранить для Web)
Что я люблю в этом процессе, так это то, что вам не нужно делать каких-либо преобразований на панели Timeline (Временная шкала) для сохранения покадровой анимации, так как диалоговое окно Save for Web (Сохранить для Web) сделает всю работу за вас, как только при выходе вы выберите формат GIF. Посмотрите, в правом нижнем углу диалогового окна появились параметры анимации. Если вы захотите уменьшить размер изображения, то сделать это можно в данном окне.
Количество цветов
Наиболее важной опцией для оптимизации размера файла формата GIF является количество цветов, которые используются в таблице цветов. Максимальное их число 256 и ограничены они 8-битной глубиной. Вообще говоря, количество цветов вы можете уменьшить до 64 или менее. Здесь всё зависит от исходного видео, возможно, вам придётся увеличить их количество для получения лучшего результата.
Уменьшение размера изображения
Вы можете уменьшить размер изображения с помощью меню Image (Изображение), либо сделать это чуть позже в диалоговом окне Save for Web (Сохранить для Web). Лично я предпочитаю уменьшать изображение в начале работы в диалоговом окне Image Size (Размер изображение), потому как вы сэкономите время, нежели будете делать это в конце при сохранении. При изменении размера изображения, видео-слой необходимо преобразовать в смарт-объект, но не стоит беспокоиться, это никак не повлияет на рабочий процесс.
Итоги
Лишним будет рассматривать стороннее ПО при наличие такого разнообразия онлайн-сервисов.Все сервисы предлагают примерно одинаковые инструменты. Единственно отличается, где можно выбрать метод сжатия (уменьшение числа кадров, количества цветов и т.д.).
Из всех рассмотренных нам лично больше всего понравился Compressor.io:
- несложный интерфейс;
- визуальность (возможность просмотреть результаты сжатия);
- большой процент сжатия;
- небольшие потери по качеству.
GIF Compressor подойдет для тех, кому нужно оптимизировать крупные gif-анимации. К тому же он показывает хорошие результаты, аналогичные Compressor.io. Сервис IloveIMG хорош тем, что не уменьшает качество получаемых сжатых изображений. А на ресурсе Online-Conventering можно выбрать процент потери качества – от 1 до 100.
- https://public-pc.com/kak-szhat-gif-animatsiyu-obzor-onlayn-servisov/
- https://www.internet-technologies.ru/articles/10-luchshih-besplatnyh-programm-dlya-sozdaniya-gif.html
- https://lumpics.ru/how-to-edit-gif-online/
- https://RusAdmin.biz/soveti/kak-obrezat-gifku-onlajn/
- https://lumpics.ru/how-to-compress-gif-online/
- https://www.movavi.ru/learning-portal/gif-croppers.html
- https://pskurs.ru/animation/10-sposobov-optimizacii-gif.html
- https://lumpics.ru/how-to-cut-gif-online/