The web is full of sites that usually contain hundreds of pages of text. Fewer and fewer people have the time or desire to read nowadays - visual content, such as video or images, works much better - as you know, an image expresses more than a thousand words. This statement can be further confirmed by the popularity of sites that collect, for example, memes.

However, it's not enough to mindlessly post as many photos or images as possible, as this can do more harm than good. To avoid the black scenario, you should follow a few tips below and optimize your graphics before uploading them to your blog or website.

File type and format

Digital graphics can be divided into two types: raster and vector.

Raster files - are classic images consisting of hundreds of thousands (or even millions) of pixels, creating, for example, a high-quality photo. The advantage of raster images is high detail, but at the expense of a large file size, even up to several megabytes. That's why they need to be compressed before being published on the Internet. Too much compression makes a raster file lightweight but completely unreadable for the viewer.

Vector graphics consists only of geometric shapes. It's hard to imagine a realistic sunset, for example, but vectors are perfect for icons, logos, or other simple graphics. A big advantage of vector images is that they can be freely scaled (enlarged and reduced) without losing quality. In addition, even the most complex vector images do not take up much disk or server space.

There are also several file formats to choose from, in which you can save images - .jpg, .png, or .gif.

The most common images on the Internet are so-called jotpegs, or files with the .jpg extension. This is a lossy format, which means that some information in a photo or graphic will be irretrievably lost during conversion. As we have already mentioned, such a file will weigh less (not several megabytes, but a few tens of kilobytes at most), but the higher the conversion rate, the more unreadable the image becomes. It's best to store photos with a lot of detail in .jpg format, such as product photos.

.png files offer lossless conversion, which allows you to preserve all the important details of the image - at the cost of increased file weight. This format works best for graphics containing text or logos.

If we want to include a moving animation on a page instead of a movie, a .gif file can be a good idea, but pay attention to its size. Complex animations can take up a lot of space, and the loading time can put users off.

Graphic dimensions

It is important for the positioning and usability of a website to ensure that the size (and proportions) of the photos published on the website are correct. For personal computers, the best solution is to use a 16:9 aspect ratio, which is, for example, 1280×720 pixels - this will allow you to display larger graphics on the screen. On mobile devices, you should use a 1:1 aspect ratio, which means a size of, for example, 1080×1080 pixels. Square photos or images fill the space of small phone displays much better.

File name

A common mistake is to leave the default image files and publish them on the page without changes. As a result, search engines cannot "read" what is actually on the photo. Therefore, instead of IMG_1234.jpg, you should rename the image, for example, positioning-graphic.jpg, which will make it much more visible to Google crawlers.

In addition, when publishing photos, you can enter a so-called alternative description that will be displayed when the graphic is not loading on the site for some reason. This is a great help for users, who will be able to guess what the picture is about thanks to the alternative description.

Reduce the weight of the image file

As we have already mentioned, the smaller the image file, the better it is for our website, its position in the search engine and for visitors. You can change the file weight in several ways, for example, by reducing its size (a photo copied directly from the camera at maximum resolution takes up too much space), saving it in a different format (.jpg files are much lighter than .png), or by additional compression.

The latter method is especially recommended because it is fast and allows you to really reduce large graphics, without necessarily losing quality. There are many online tools available to facilitate graphic compression (e.g., tinyJPG.com - according to the developers, the file weight can be reduced by up to 70%!), you can also use free plugins for CMS systems that can automatically reduce the size of files sent to the server.

Keep these tips in mind the next time you upload another photo to your website. While this will certainly make other content more attractive, let's also try not to slow down the loading time of the site. Internet users are very impatient nowadays and even a delay of a few seconds can make visitors forget to continue browsing our website.