How to reduce gif animation online. Resizing animation in GIF format

Hello everyone who is reading now. Today I’ll tell you about my several ways to reduce the size (weight) of a picture, screenshot, photograph, GIF animation without losing quality for inserting into a website.

Reducing the size of an image in different ways

Each picture or image, call it what you like ;), has its own size, which consists of several points, these are vertical height, horizontal width (px) and weight - kilobytes (KB), megabytes (MB).

Reducing the size (weight) of the image will have a positive effect on the site loading speed - web performance, and will also help save space on your hosting, computer, or flash drive.

Agree, images taken on professional cameras (DSLRs) can sometimes weigh more than 2 megabytes and be 2500 px in width. If such an image is inserted onto the site without compression, it will significantly increase the loading time, for which today PS apply a filter, especially for Google PS.

The first method is to optimize the image before uploading it to the website in Photoshop.

I must say that this is the most popular method of photo resizing and compression among website owners. It is also suitable for ordinary users Internet. At the same time, the actions performed by this program are minimal, which is also important for novice bloggers.

• 1. Open new file with the help Photoshop programs and then click “Save for Web”.
• 2. A new window opens, where we set the necessary parameters: quality, format and size of the image.

So, it is enough to change the quality from high numbers from 60 to average numbers from 30-50 to significantly reduce weight. The desired quality can serve as a guide. In the preview window, control how much the image changes.

As for the image format, I choose to save as Jpeg if it is color photo, and if you need to preserve the transparency of a layer or a black and white screenshot, then, as a rule, this PNG format so that the text and numbers on it are read more clearly. On the topic of Photoshop, read: using this program.

I change the image size (in pixels) in the same window, which is convenient. I click “Save” and then write the file name in Latin.

The second way to compress images using online services

To be honest, I resort to this method extremely rarely. However, these services help compress several (batch) images at once without losing quality, which affects productivity. These are the well-known services krakin.io, TinyPNG; Compresspng and others.

I’ll tell you about one more - this is Optimizilla, which I tested and I really liked the results. Try it too.

The screenshot shows that the system was loaded JPEG photo, weighing 60 KB. The service automatically compressed it by 39% to 37 KB, but visually the quality was practically not affected.

Using the convenient slider or [+ -] signs, you can play with the image quality; zoom in on the photo and take a closer look at all the details after compression before saving. This is a very relevant photo preview function for sites with a photographer’s portfolio, tourism, women’s resources, online stores where high-quality product images are important.

Resizing the height and width of an image

The process of resizing the width and height of an image, I think today, no longer causes any difficulties for anyone. This can be done both online and in standard graphic editor Paint or the more convenient Paint.NET.

Open a new file in the program, click “Resize”, note that it is in pixels, while maintaining the proportions. OK.

Changing the weight of an image in Gif format online

In this part of the article I will tell you how to quickly compress not only images in JPEG, PNG, SVG, but also Gif formats. Gifs weigh quite a lot, so there are a large number of requests on how to reduce the weight of a GIF image without losing animation and additional effort).

• Let's use the first online service Compressor.io .

Compressor.io is a powerful online tool to dramatically reduce the size of your digital photos and GIF animations. It allows you to maintain high quality images, uses two types of compression, where there is a difference and there is no difference before and after compression. This is how they characterize their service, and home page you can be sure of this.

For an example of Gif animation compression, see the screenshot. You can download the optimized image in a way convenient for you: to your computer, save to Dropbox, Google Drive(drive.google.com).

• Second service Online Image Optimizer.

The name of the service speaks for itself. Online Image Optimizer easily optimizes different formats images, including Gif animation. Just upload the image and click “Optimize”. Additionally Online service Image Optimizer helps you quickly create not only a favicon for a website, but also has many useful online tools in its arsenal.

• The third method is an application program SuperGIF for MacOS and Windows.

You can purchase paid version SuperGIF or download a demo for free, where there are slight restrictions on functionality.

2019-04-04

While visiting various websites, each of you has come across bright, jumping gif pictures that attract the attention of readers.

I used one myself - it attracted attention to my subscription form.

But gif animation weighs too much, so it greatly slows down the loading of the blog on the user’s computer.

The speedpage service kindly reported this problem to me when I was checking the loading speed of my blog. I was advised to change the image itself, and not just reduce its dimensions in html.

I'm fine with regular images, I do them before uploading them to the blog.

You saw a gif image on some website, liked it, and wanted to insert it into the sidebar (widgets):

• just drag the image to your computer into a folder (not into a document). Later you will open it using the Internet and receive the picture code;
• or right-click to open source code page, find the image code and copy it (Ctrl+F, paste a gif into the line that opens).

How to reduce gif size online

Reduce the size of the gif image as usual - in Microsoft Office Picture Manager or Paint did not work, the picture stopped jumping.

The fact is that gif animation consists of several images packed into an archive (storyboard). When resizing in Microsoft Office Picture Manager or Paint, some of the images are lost, leaving only one.

Therefore, we go to the service http: // ru.toolson.net/. It allows you to resize gif online and compress gif. There is no separate COMPRESS function, but when you reduce the size, the weight of the image will automatically decrease. There you can crop the image.

Go to the EDIT gif tab.

At first I just tried to change the size of the GIF animation:

SELECTED a file on my computer (a jumping arrow, the size of which the speedpage service was dissatisfied with);

LOADED animation;

CHOOSE a new width and height (smaller);

DOWNLOADED the modified file.

I didn't like it, it turned out sloppy.

Storyboard gif in zip archive

Click the STORYBOARD button and the file will download.

UNPACK zip archive in a separate folder.

Sequentially process EACH image in Paint program. I wrote in detail here.

I remind you:

OPEN the picture in Paint - in top menu select PATTERN - STRETCH/TILT - SET reduction percentage - OK - SAVE.

Why did I use Paint?

Microsoft Office Picture Manager could not get the same resizing. All the pictures were shrunk differently, even the background turned out different – ​​transparent in some places, not transparent in others. Assemble from such different types of elements good gif the animation didn't work.

Then go to the CREATE GIF animation tab.

Click the LOAD button, download all the processed elements one by one (I had ten).

Enter the name of the animation and specify the interval between frames (I have 70). You can try here different meanings. The smaller the interval, the faster the picture will jump. Change the interval, save and see if the picture moves correctly.

You can also specify the desired dimensions, make a nice frame and apply the proposed effects.

Everyone like the preview? CREATE, the gif will download to your computer.

How to rotate gif animation

Sometimes you don't need to resize a gif. You just need to rotate the animation you like. How to do this online?

In the http://inettools.net/ service, select the IMAGE ROTATION tab

SELECT an image on your computer - UPLOAD

SPECIFY the rotation angle 90, 180, 270 degrees or any angle =>

ROTATE gif - DOWNLOAD file.

Don’t be alarmed, the online image will be slightly enlarged and blurred, but it will arrive on your computer in the desired form.

This is how I managed to reduce the size of the gif image and its weight (compress it). I hope my efforts will have a positive impact on the loading speed of the blog. Ability to turn gif animation will be useful in the future.

P.S. Unfortunately, the gif image is displayed correctly only if you are visiting the page for the first time. If you swipe and then return, the browser will give you a cache of the page. AND gif picture it won't be visible there. I haven’t figured out what can be done about this yet.

P.S. For professional use Photoshop fits perfectly. Here's a simple one.

At InVision, we use GIF animations not for pampering - they play important role from a marketing and training perspective. So we even tried using them on our homepage instead of coded animations.

Eventually people started asking us, “How do you create GIF animations?” It's time to reveal the secret.

GIF image design

1. Secret ingredient

Advice: If ScreenFlow or After Effects aren't your thing, create an animation in Keynote and export it as a video. Finally some use of this feature in Keynote.

2. Less colors = more fun

3. Use motion blur if possible

4. Be (somewhat) lazy

Export GIF animations

5. Remove duplicate frames

If that doesn't help, try importing the video again, but this time select the option Limit To Every 2 Frames. This should reduce the file size significantly.

Advice: If your animation consists of more than 150 frames, you will encounter problems when trying to reduce the file size.

6. Fewer colors

7. Change the Lossy* parameter

*"Lossy" - acceptable level of loss graphic information V raster file, allowing to reduce file size images

Nothing has changed! Help!

From the translator. With all your wishes and comments regarding the translation, please contact me in a personal message. Thank you!

Animated gifs are very popular on social networks and can often be found on entertainment websites. Using gifs you can show the most successful moment from a video; gif screenshots clearly demonstrate the stages of work in a program or service. Gif screenshots are also used to show the operation of website elements, for example, a drop-down menu. Before downloading files for installation, the user can get acquainted with their work through GIF animation. You can create and upload your own animated funny pictures, for this you will need an android application

However, GIFs also have a major drawback - large size, in connection with this, the loading speed of the web pages on which they are located significantly slows down. To overcome these shortcomings, I suggest you check out the list of tools that will help you optimize (reduce the size) of GIF animations.

Shrink O'Matic

This is a simple Windows program for optimizing GIF images. It is also capable of simple actions with images, such as rotating, resizing, changing the file name and its location, batch processing. Available formats for processing: GIF, JPEG, PNG.

ImageOptim

This program runs on the Mac platform. It is designed to compress gifs up to 60-80% and higher without losing quality.

FileOptimizer is an advanced tool for compressing GIF animations. The program has a simple interface, so it can be used by both beginners and experienced users.

Other supported formats: JPEG, PNG, SWF, TIFF, BMP, ICO

Works on platforms: Windows, Mac OS, Linux

FILEminimizer Pictures

Image compression reaches 98% and higher as a result of proprietary optimization technologies. There are 4 levels of compression for gif files. In addition, the program allows you to upload pictures directly to Facebook.

Formats: JPG, BMP, TIFF, PNG, EMF | Platform : Windows

RIOT

I liked this program more than others. You can control the compression of GIFs, the program shows the size of the source and output files, there is a preview, thanks to which you can visually assess the loss of quality. Disadvantage: An animated gif turns into a regular static image.

GIF Optimizer

A simple program for optimizing GIF animation. The program has only three buttons - open - open a file, optimize - optimize and Save as - save as. You can control compression through the Setting menu.

Pictures in GIF format can be easily opened in the Photoshop graphic editor; if you can use it, then it will not be difficult to change the size. And for those who cannot use this editor, it will not be difficult to figure it out; in the menu there is a section Image -> Image Size.

The easiest way to change the size is with free program InfranView. It is simple, intuitive, and you can work not only with gif animation, but also with any pictures.

You can try using Paint Shop Pro, it is more complicated, you will have to go through a whole manual - the user manual.

To begin with, it would be nice to know what size you want to change in the gif animation? Image size (that is, aspect ratio, width or height of the picture, etc.), or file size (sometimes they also say the weight or volume of the file) in bytes - megabytes, like - reduce the amount of information contained in graphic file gif animations, when minimal loss image quality? In other words, optimize the gif file...

To change actual size pictures (width and height) in an animated file of .gif format, special problems does not exist.

I'll start from the very beginning simple way, for those who do not want to install on their computer additional programs. This is a way to use the services of specialized online services, of which there are plenty on the Internet. Here are some links to similar sites:

Creating and editing GIF animation - Toolson.net.GifResizer

Creation and retouching animated GIFs images online - Reduction-image.gif-anime

Create or edit GIF animation online - Picasion.com.resize-gif

Similar sites where you can create and partially edit gif animation, there are many, but the range of services and functionality provided there, on all sites, is very small and almost the same. It’s not at all difficult to work there - you upload your own GIF animation and consistently perform a series of completely simple actions. How and what to do - everything is described step by step. Make no mistake.

The second way to change the size (aspect ratio) of a GIF animation is to use the simplest programs that are created specifically for this purpose, for example:

Free program GiF Resizer- the name speaks for itself. The only purpose of this very small utility is to resize animated pictures in .gif format. This program is on English, but understanding its possibilities is very simple.

Another program, also free - Beneton Movie GIF. In this program for a couple simple steps You can resize the GIF animation. Also in this editor you can perform some additional actions to change animated GIFs.

More complex procedures for editing GIF animations will require the use of more advanced programs that will help perform both simple resizing of the image and its cropping, as well as optimization of the GIF file, that is, reducing its volume while preserving high quality the picture itself when viewing.

There are also a lot of such programs, for example:

GIF Movie Gear- a simple but quite powerful GIF animation editor.

Falco GIF Animator - free editor GIF animations, but with very decent capabilities, no worse than similar licensed analogues.

Easy GIF Animator- an easy-to-use animated GIF editor with decent features.

EximiousSoft GIF Creator- a very good animated graphics editor, with almost professional capabilities.

GIF Construction Set Professional- one of best programs for creating and editing animated GIF images. Professional program. But it's not at all difficult to use. E is quite difficult to find on the Internet, especially in latest version, especially with a localization, so in addition to the link to the official website I will give two more links - for downloading from torrent tracker NNM-CLUB(here is the version without plugins), and for downloading more full version, with many necessary additions - GIF Construction Set Pro v3.0a (Patch 40).

The links listed above lead to the developers’ websites, where you can also purchase these programs... or you can take advantage of the capabilities of the Russian Internet, where you can still find and download any of these programs without much difficulty with the possibility of free activation :)))

At all - gif animation optimization- this is a separate topic. Automatic optimization usually does not produce noticeable results, and the image quality may be greatly reduced.

Perform high-quality optimization of GIFs perhaps only in one program, which is definitely worth mentioning in this question - almost any manipulation with GIF images, from their creation to complete editing, can be done in the best graphics editor of all times - in the program Adobe Photoshop . In this program you can do anything you can think of with GIFs...

In general, something like this, in my opinion :)))

Good luck...

The GIF animation size can be changed using special program Toolson.net.GifResizer.

With the help of the program you can change, increase, decrease the size of GIF.

You can view the program and download it here.

Now gif files are quite popular and widespread, so many programs have the ability to process them, including changing the file size of this format, playback speed, and trimming. One of these programs is the well-known Photoshop; it can easily help you edit a GIF.

The size of an image in GIF format can be changed using special online and regular programs that need to be installed, as well as using Photoshop. The image needs to be opened in Photoshop, and then reduced in size in the Image Size dialog box by opening the Image menu.