Image optimization for web

Image optimization for search engines.

Image optimization is a key element for a well-optimized page/content that an image represents. In this guide, we will introduce you to how to optimize images for a website. What you need to pay attention to and what tools you can use to help yourself.

Like web pages, images are displayed on the Google results page. Because they are tied to the page itself and are critical to the user experience, they are also crucial to optimizing the page. As a general rule, professional photos and images give a better and more professional look to the website itself. As a result, the user experience is so much better. After all, images dictate the nature and atmosphere of the content or help to understand it.

Search engine optimization.

The most useful image formats online

Image Optimization – When talking about image optimization, there is no correct image format. It all depends on what the image is and why we use it.

Play Video

To introduce you to the formats in which you can save images and what they are used for:

  • JPEG (Joint Photographic Experts Group) – is the most widely used image format, due to its ability to display high-resolution images and relatively small file sizes. It is a raster image format that does not allow for transparency.
    The use of this format is suitable for: photos of products, events, backgrounds, covers, carousels, etc.
  • PNG (Portable Network Graphics) – Images in .png format can (due to the large amount of information they store) be significantly larger than images in .jpeg format. It is a new form of raster image format that provides a transparent background.
    The use of this format is suitable for: various graphics, buttons, logos, and similar elements where transparency is important.
  • GIF (Graphics Interchange Format) – is a moving image, which is widely used as an animated button, graphics, etc. Like the previous two, the .gif is a raster image format that allows for transparency.
  • WEBP – is a new image format for the web, which offers high resolutions and small file sizes that are adapted for the web.
  • SVG (Scalable Vector Graphics) – is one of the most widely used vector formats, which can be arbitrarily edited and manipulated on the web page via CSS or javascript.


We recommend the .svg format for logos, icons, buttons, and other small elements on the website.

Potrebujete pomoč ali posvet?

Z veseljem vam bomo odgovorili na vsa vprašanja. Pustite nam sporočilo ali pa nas pokličite in vam bomo z veseljem pomagali .

Image sizes

When optimizing images for search engines, size is one of the key stops. We need to make sure that the images that will be online are compressed so that they have the smallest size. For the optimal size-quality ratio, you will need to play around a bit.

It is recommended that you post high-quality images, as more and more devices are using retinas and similar high-resolution screens.

Image sizes for diferent devices.

The recommended file size itself is between 30 and 150 kb.
Of course, it depends on the nature of your content, because in some places it is not possible compensate for quality.

Hint:
we recommend compression.

On-side image optimization

Google and similar search engines in 2019 can already distinguish text
in the picture and the nature of the photograph. But it all depends on her context, therefore
make sure you give the image as much information as possible.

Of course, to successfully optimize an image, it is crucial to insert the primary keyword into the image. We do this in the beginning by naming the file name with the selected keyword. Later, it is also included in the alt tag. When we have multiple images, we have the opportunity to add variations and synonyms of that keyword to others in the same way.

Pro tip: Attention! Try to name the names of the pictures as uniquely as possible. Names are written in lower case and no special characters are used for naming. Spaces are written as minus (-).

Our advice:

Image Caption – is the text that accompanies the image. These are the inscriptions that describe its content and events as in a book or newspaper. These addresses are also important to users as they give them context and describe them in more detail.
Alternate text (ALT attributes) – is the text that is displayed when the image cannot be displayed. So it replaces the image. And search engines also use it as a substitute for an image (because they can’t read an image) and that’s why it’s so crucial to search engines. Some audio-readable programs read the image as alternate text.
Title tag – this text is displayed as a support bubble describing the content or giving instructions. A bubble appears when you hover your mouse over the image. For SEO image optimization, it has proven to be irrelevant.

Image optimization is important for just optimizing your website and content, so optimize them carefully and the results will be visible quickly.

To know how to optimize titles and what H- tags are, read the  HTML H tags post.

Should you need any assistance or have any questions, we will be more than happy to receive your call or email at info@indistant.com.

V kolikor vam je bila vsebina všeč, nam lahko pustite oceno.
Hvala za podporo!!! :)