The web is full of sites, which usually contain hundreds of pages of text. Nowadays, fewer and fewer people have the time or desire to read – 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 is not enough to thoughtlessly post as many photos or images as possible, as this can do more harm than good. To avoid a black script, follow a few tips below and optimize your graphics properly 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 (and even millions) of pixels, creating, for example, a high-quality photo. The advantage of bitmaps is high detail, but due to the large file size, even up to several megabytes. Therefore, they must be compressed before publishing on the Internet. Too much compression makes the raster file light but completely unreadable to the viewer.
Vector graphics consists only of geometric shapes. It’s hard to imagine, for example, a realistic sunset, but vectors are perfect for icons, logos or other simple graphics. The great 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 space or server.
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 the so-called “jot pegs” – that is, files with the extension .jpg. This is a lossy format, which means that some information in a photo or graphic will be permanently lost during conversion. As mentioned earlier, such a file will weigh less (not a few megabytes, but a maximum of several tens of kilobytes), but the higher the conversion rate, the more unreadable the image. It’s best to save photos with many details in .jpg format, such as product photos.
.PNG files offer lossless conversion, which allows you to save all the most important details of the image – at the cost of increasing the weight of the file. Graphics that contain text or logos work best in this format.
If we want to include a moving animation on the page instead of a movie, a .gif file may be a good idea, but pay attention to its size. Complex animations can take up a lot of space, and download times can repel users.
Graphic dimensions
It is important from the point of view of positioning and ease of use of the website to ensure the correct size (as well as proportions) of the photos published on the website. 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. In the case of mobile devices, you should use a 1: 1 aspect ratio, is a size of, for example, 1080×1080 pixels. Square photos or images fill the space with small phone displays much better.
File names
A common mistake is to leave the image file names by default and publish them on the page unchanged. As a result, search engines cannot “read” what is actually in 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 robots.
In addition, when publishing photos, you can enter a so-called alternative description, which will be displayed when for some reason the graphics are not loaded on the site. This is a great help for users who, thanks to an alternative description, will be able to guess what the picture was supposed to show.
Reduce the weight of the image file
As already mentioned – the smaller the image file, the better for our site, its position in the search engine and for visitors. You can change the weight of a file in several ways, such as reducing its size (a photo copied directly from the camera at maximum resolution takes up too much space), saving it in another format (.jpg files are much lighter than .png), or by compressing it.
The latter method is especially recommended because it is fast and allows you to really reduce large graphics, not necessarily with a loss of quality. There are many online tools available online that make it easier to compress graphics (for example, 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 file size. Sent to the server.
Follow these tips the next time you upload another photo to your website. While this will definitely make other content more attractive, let’s also try not to slow down the loading time of the site. Currently, Internet users are very impatient, and even a delay of a few seconds can make visitors forget to continue browsing our website.
