Image SEO Series:
Hello everyone, Vikram from viksolve.com and this is the second article of the Image SEO series. In today’s article, we will talk in detail about Image Optimization, Image Caching, and Image CDN. What is the difference between these three, what is the benefit, and which one to use? And how to use, all the things will be discussed in today’s article. Group members are requested to share the article and the screenshot in the group and if you like our special this article should remain here sometimes.
There should be heart-to-heart talks, so this article is live, you can go and read it. Now let’s not waste time in talking here and there because the article can be a little long, so let’s come straight to the work, so usually we are in this Image Caching, Image CDN and Image Automation, the plugins of these three types mix up these three words and it is not your fault, many of the functions are very common among these three and there is no such There is no strict categorization, that is why there is confusion, that is why I try to explain a rough difference between them. Before you start working on these three, the right concept will be clear first, then after that we will move on to the process.
Image optimization plugins will come to compress the images of your website, reduce their size, convert JPG to web page or AIF so that the images of your website can load quickly and your website can become fast. Example of this type of plugin. There are many other plugins of the same type, these are the images of your website, they will compress them, they will actually reduce their size and after this, your website automatically becomes fast, so these are the image optimization plugins. Image Caching Plugin:
These save a copy of the images of your website on the device of the visitors of your website. The expiry time is also set for some time so that when they visit again, they do not have to download the images again. Now, when a user comes to your website for the first time, he will not get any benefit from this type of plugin, nor will your server get any benefit.
The user will have to download the images and your server will have to provide the images, but when the same user comes to your website for the second time, Another time or the same user will visit another page of your website, then the Image Caching plugin becomes beneficial because this time the website will show the images saved from the user’s device and the same image will be shown to your server as well.
You will not have to transfer it from other sources, both of them will be saved because if the user goes from one page to another, then the common images will be like the footer image, there will be an image on the header, your logo will be on the background, so it will be like this. The user does not have to download the small images again because the image caching plugin has already saved them on his device. Both of these are saved. Apart from this, the plugin also does some other work like lazy loading of images.
Also Read:
Image SEO Series | Part 1 – Resolution and Format | January 2024 | Learn Image SEO Like A Pro
SEO Last Month January 2024 | Latest Updates From Google Search, Google Ads | Viksolve
Lazy loading of ATF images. If you are confusing these two concepts, lazy load and the exception of lazy loading of ATF images, then wait for a day or two. In the next article, we are going to talk about this topic, so Image Caching Plugin. What is the example of WP Rocket w3 Total Cache Flying Press? Usually the caching plugins also provide the option of image caching.
I am saying the word image caching separately so that this concept becomes clear to you. After this, last The name of Image CDN comes in Image CDN i.e. such content delivery network CDN content delivery network which also pays special attention to images. Now what does CDN mean? Content Delivery Network is a network of computers, a network of servers which provides the user with access to your website.
The content is delivered from a server close to the device. Let me quickly explain the difference between hosting and CDN. Hosting will be a server of your website. It will be written at one place. From there, the data of your website goes to the user’s device. Now Users of your website can be anywhere in the world. Let’s say that the server of your website is in Mumbai, but if someone from the US wants to visit your website, then the data of your website will come to the US from India and then Later, the request will come back here, it will take time in between. Now what CDNs do is that their servers are located in different places all over the world.
They pick up the data from your hosting and send each copy to the servers spread all over the world. After this, whenever any visitor requests your website from anywhere, that data does not reach him from your hosting but from one of the servers of this CDN content delivery network, which is nearest to him. This is the benefit of CDN, so similarly, Image CDNs are also very useful because Image CDNs also deliver the images of your website quickly from the server nearest to the user’s location. Now if you think carefully, you You will find that the images are the most heavy part of any website.
Your CSS and ATML get loaded and if the heavy images are not being removed from your server again and again, then your hosting plan is also less. There is a saving in the usage as well. I am not talking about shared hosting here. Those who have good servers can save in this matter, so this Image CDS takes the images of your website from JPEG and converts them into VPI. Can convert AVI to IF and because it is the Image CDN plugin that is going to show the image on your website it can decide which browser supports AIF so it will show the AIF image if any browser. Does not support AIF, can support WPI, then will show WPI there apart from that, if there is a very old browser where both AV, IF, or WPI do not work, then it can show JPG or PDF there.
So this kind of dynamic work is done by Image CDN automatically, so you do not need an Image Optimization plugin on your website today. What you need is an Image CDN and an Image Caching plugin, so Image CDN plugins. Your website’s images will be taken to different servers, formatted, cropped, and resized and the image caching plugin which optimizes these highly optimized images coming from different servers will also save them on the user’s device. So if the user is repeatedly visiting the pages of your website, visiting different pages, and doing many sessions, then these images that are coming from the CDN will also not be transferred again and again.
You will save there too, so now in the next article, we will not look at the Image Optimization plugin because Image Optimization plugin, you should not use it on your date, all the optimization is done on your server even if conversion is to be done. Even if you have to recite, it will be on your server.
The load on your hosting increases. More space is spent on your hosting, so we removed the Image Automation plugin from here. Along with the explanation, we will focus on the Image Caching plugin. And now on Image CDN, here comes a question Image CDN in itself is not free, you get a premium version, or you get some small plan for free but if there is more than a limit of images on your website or If the traffic is high and the bandwidth is getting low, then you have to pay a little bit, I will tell you a plugin which you can use for free, you can start using it for free.
The conversion is around 25000 images. It happens that you will get them for free, if you want to use more than that, you will have to pay, but the payment is also in very small quantity, so there will be talk about Image CDA, a little later, two minutes before that. We can see the plugins for image caching, we see some free plugins and some paid plugins, let us understand the process of all of them one by one, more and fewer options are available in all, and there are two or four in the paid plugins.
There will be more options but there is no need to lose heart, free plugins also give you good results, so let’s come to the computer screen and see these plugins one by one, this is our dummy website and we are the first ones here. We will see two to three plugins of image caching and in these, you will see how you can access and use the settings of the image. So first of all we are in a free plugin named WP Optimize. After installation, when you come to its settings section, here you get the option of images.
First of all, you will come to the option of images and here the first option you see is Automatic Compress Newly Added Images. Now if you click on Image If you are not going to use CDN then you can turn on this option so that the compression work will be done by this plugin on your server only but I do not recommend it. I recommend that you use Image CDN but just in case, you have a test website or you are working on a client’s website and he does not want to use CDA at all, then you can turn on this option here, after this, Show Compression is visible here. Meta Box for Images Dashboard on Media Page So basically it will show whatever data related to your media on your dashboard, so you can leave it on, it will give any benefit or loss to the user who is visiting your website. This is not going to happen, after this you are seeing compression options, here you are seeing three options:
Project Maximum Compression Maximum Compression means the size of the images on your website will be reduced greatly, the quality may be slightly reduced. The second option here is that the priority is retention of details, that is, the quality of the images of your website will not be downgraded, but still as much savings as possible will be allowed while maintaining the quality. Here, if your website is very Is it big or do you use a lot of images on your website? For example, if it is a new site then here you can tick this first option. Otherwise you should usually leave this option ticked.
Now if you are very brave. If you are feeling comfortable or you can handle some technical problems, then my suggestion is that you click on the custom button and here, bring this slider to the middle and leave it i.e. somewhere between 40-50. The details will remain and the size will also be reduced, so you will not suffer any loss here, but still, just in case, once you use this option, after saving, go and visit your website once and see that it is very It doesn’t look much wrong. If it looks wrong, then you can make a notch up a little bit.
But usually, third here, here this third, you can see an arrow, a tick is visible, if you bring this option. Even if you save it, the quality of your images remains the same, there is no problem, after this, you can also click on the option ‘Create web version of images’, with this your images will start converting into the web. Again if we are going to use Image CDN, which we will talk about in two minutes, then you do not need to turn on this option, your CDA will automatically do the conversion of VAP, so otherwise you can leave this option ticked. And after this, all the other things here are ticked safely here. For example, there is an option to backup original images, that is when your images are compressed and when work is done on them, then your original image will be saved. One copy will be saved, which you should have, the second is automatic delete backup images after 50 days right, that is, here in the second option, the images that are being backed up, whether to delete them after 50 days or not. You can turn off this option if you do not want your original images to be deleted, but if images are uploaded repeatedly on your website or too many images are uploaded, then your hosting should not be such that there is a shortage of space on it.
If you go, you can tick this option, after this there is only one option – Preserve Exif Data. Exif data is basically the meta data of the image. For example, with which camera was the image taken, on which day was the image taken, at what time was the image taken? At that time, what was the constellation of constellation, all that details are saved here and the image is saved in the image and the meta data that is of the meta data is not of your use, the users of the website are not useful There is nothing to do with the data, so keep this option off if you want to save all this data, if you have a photography website on which you do not want all this data to fly, then you will turn on this option If you allow it to stay off with other wise, then this plugin will automatically delete this entire meta data and your image size will be reduced and the right will be reduced after this, after this you have the option which is the option here, you set all the options here by yourself.
All the work has been given to you, your automatic saved has been saved, in this, the button of the sev is not visible here, this option is being saved automatically, so it is only to do it and the images of your website are optimized. Will start doing it, so you just have to do so and the images that you have here started optimizing.
There is a small plugin, after that there is a cashing option here, you will turn it on, then you will turn it on, then your website’s images After they are automatically optimized, the visitors of your website will start to be saved on the device of the cashing, after this, the second free plugin we are going to see the name of the name of W3 Total Cash is very old plugin. The only favorite plugin is that I did not have the status of using the WP rocket, did not do so many good clients and used to use WP rocket till then I used to use W3 Total Cash a lot, it has been a long time it has been a long time.
Once we come on the W3 Total Cash and see it too, we have come here on the W3 Total Cash, I will not teach all this how to activate this plugin. Seeing that they get this basic process allredi, we have come on General Settings of W3 Total Cash and here you see a media related to the media which is on the section of Web P Converter Vepi Converter Only one check box is visible, you will click on it and the web P conversion automatic option will be enabled, here you can see that a small notification is visible to you that if you are using free version So you can use conversion of up to 100 hours in just one month and only 1000 hours in the whole month.
This is a small limit, but you have to face the option of advance setting here, besides they have to face the option of advanced settings here. It is being that I clicked very quickly, click on the sev setting on this button and then come back after this, click on Vapi Conversion and once on advance settings.
Type of Again Compression is being asked, Lossi or Lossy Lace Right Just a while ago, the second plugin which we saw was being asked for compression types in the WP optimize and you were repeatedly different You can be asked in places and you will always see three words Los Loss Les and Gloss here, you are not visible, but that option is also visible many times, so once we first appear between the first loss gloss and loss lace. Understand the difference, turn back the camera and then start it, so here you are looking at three words again and again, Lossi Gloss and Loss Les Now understand what is the difference between these three so that you understand it once Whatever three these words are seen on the plugins, even if you see these three options on your image CDN tool tomorrow, if you see three words, then you can automatically dissect what is the difference between these three.
What is the meaning of Lossi is the method of Lossi Compression in which the data that is from your image which is not able to see the human eye normal and this thing is the algorithic details of these plugins, what is such a detail that is inside your image which is inside your image Human Eye will not be able to see that there is very small details, which is deleted, if the data is deleted from your image, then the image size will be lightened, the image will be lightened to you Percent will be the quality down of the image here, it depends on how much percentage conversion metrics you use, but you want to understand the theory, if you want to understand the theory, the data is removed from your image in the compression of the loss format, it is deleted. And the size of your image decreases.
Now what is the benefit of this, the size of your image is very low and what is the disadvantage that if you want now, you can not gain that data back, that is the quality of the image, the quality of the image is complete permanently. Goes back, it cannot be gained back. Now the second word comes. Los lace los lace means that the data is not deleted from the image that is not deleted, it is compressed, it reduced its size.
Goes to zip, but the data is not deleted from the image of your image, so if you want, then tomorrow, using this image, using another plugin, using another algorithm, and using another algorithm, it is normal Quality can also be improved. Now the third word comes. Gloss Gloss Gloss is a word between both lacqui and lace. Some details are deleted permanently in the gloss method, which is 100% sher The absorption is removed, but some details are saved and kept, which reduces its size, so if we see here what is the best method of compression in it. You get the lowest size, but the quality of the image is reduced permanently in itself.
The quality of the image in Los Lis is not permanent down, but the savings in it are very low and gloss is very low and gloss in There is an option between the two, there are some benefits Lossy and there are some benefits Lossy laces, so you see all the time to check that once you check the images of your website, once you verify them and see any of any of the losses and gloss If you choose an option, then you will be benefited by Lacy Les.
It should not be very much. It does not contain too much gains and there is no big loss to use los format. It is kept, if you are deleting the image from your computer, then it is a different thing, you have to select an option from loss or gloss whenever you get an option in a plugin here, so here you In the middle of the two plugins, select the loss option if you have a backup of your image, after this you are seeing the option of auto convert. After uploading the image back every time, click the button here, it does not seem good visibility is set to allways. Number one convert all and number two reviews, as soon as you click on Convert all, all the images on your website will be converted all.
As soon as you enable the page cash in this caching plugin, the images of your website will start getting saved on the user’s device, so it was W3 Total Cash’s image related settings. After this we come back to the general setting option. And here the page cache which is the option to enable it to keep the method on disk anales and as soon as you enable the page cache after that the images of your website are automatically automatically You will start getting saved and the website that you have a little fast appearance will start to be started, so these were two free plugins W3 optimize and W3 Total Cash Now we come above the paid plugin which is our first flying press on the tree plugin Extra option provides us, so you will click on the fly press button to see the option of the flying press, so the fly press is currently my Recomed Plugin, yet I used to recommend the WPP rocket. Remain allredi, you have kept all -grade subscription, so you can use but you can use But Flying Press is more better. In today’s date WP rockets If this situation is changed ahead, then we will change our recommendation here I have come to the dashboard and I have to click on the image button.
We will talk about Legi Loading and ATF etc., but what is the option of your work here at the moment, what is the first ad missing and height option, so that if your image is in your CSS with your image There is no size of the image at anywhere, inside the CSS, it will be mentioned there, so that the size of your image will not have to be gassed to the browser and the layout shift that is shifted on your website is less in itself. After this, the second option is the host graviter images, ie the graviter images will be saved on your website and it will be benefited from your website.
We also tick and the option of preload critical images is all -taken tick, save it here, image related options have all been saved, if you have installed this plugin, then the cashing has become all -taken and your website The images that are the user’s device will start getting saved on the image of the image, it has become all -handed enabled, if we go to the WP rocket, then there is also similar options there are similar options.
I see because many people are using WP rockets Alredi, now we have come here in the dashboard of WP rocket, we have to go here. After coming to media settings in media settings You are allowing it to be on it, I will explain it, the next article is the second option in the next article. You Right now from the top of my head I do not remember that there is any free plugin that optimize background images IF You have to let this option be ticking, the enable for eye frame and articles.
It also has to let it be tired. In Replace YouTube1, you also showed this bean option by this name. Ad Missing with and Height and Jab when we come in the WP rocket Here is the same bean option visible here, both options are beans under the name missing image dimensions and both of them have to be allowed to stay in the plug in, after this, click on the Sev Change button and your image caching image optimization of optimization.
The part that was done from here, it gets done from here, so here you have seen two free plugins and have seen two paid plugins. Now we come for image CDN, for image CDN, I will show you two plugins for image CDN.
You come in the option, you will find some features in free version and if you are handling a very large website, the images are very high on your website, then you will also have to take paid plan, so we see their setup one by one. First of all go to optimal and after that we will come to cloudine, we come to image optimization service by optimal plugin This is the name of this plugin, I am activating it and after activating it, first you have to give your email ID here first so that A free account for your website can be created here.
This process is quite seamless, I show it in front of you, I enter one of my email ID and click on Create and Connect account which is this button.
This process will start immediately and you can see the progress on this small dashboard, let it complete, whatever animation is visible will be completed once it is completed, after this your website which is automatically connected somewhere. There is no need to take any API etc. Users are coming to see good images and to read the content.
They can come up to 5000 in a month. If it is above 5000 then the service of Optimal will not work. Now this plugin will help your website. It also optimizes the images, converts them and then displays them directly on your website. Here, if you look at the side, a small domain of the images is visible, it means that this is your Image is the total URL of the CDN, so we leave this dashboard like this for once and come to the Settings button. After coming to the Settings button, you are seeing some options.
It is important to understand these options, first of all enable them. Optimal Image Handling i.e. Optimal Plugin Start handling the images of your website Optimize it Serve it Show it everywhere Do everything This option is turned on by default here, if you turn it off then it is a mistake With this, Optimum will not work on your website, so you have to leave it on. The second option is already enabled here, that is, Optimum will do the work of scaling the images on your website and will automatically reduce the images. Will shrink and serve in smaller size only. Okay, so this work is enabled here.
Already lazy loading has also been enabled. Both these options have to be left on. After this, the last option is what you are seeing here. This Enable Optimal Badge: If you have a small blog on which you do not want to spend extra, you do not want to use a paid plugin, you want to continue getting more benefits of Optimal, then you can turn on this Enable Optimal Badge.
You can do this, if you turn it on, then the name of Optimal will be visible on your website, branding will be visible but you will also get more visits, you will get 20000 extra visits, so 25000 users can come to your website. I think this is a very good option if If you have a small business website, you will not have to suffer much loss due to this branding or if you have a small blog then you can take extra benefit by turning on this option. Here in the advanced section, it is the first option visible.
That is, automatic best image format selection. When you turn on this option, the users of your website will automatically select the best image format based on whatever device they are coming from and whatever browser they are using. Be it AV IF or Web P or JPG or PNG and it will serve the image in the same format, all this work will be done by just ticking one button. Apart from this, there is network based optimization if any user is on a slow network. If yes, then the images on your website will be further optimized and served.
You have to turn on this option also. Apart from this, there are two-three more options here for example. Send CSS and JS also through Optimal. If you want If you are not using any other CDN other than Image CDN, do not use any other CDN for the remaining files of the website. For example, if you are not using Cloud Flare, then you can also enable this option and your website The CSS and JS files will also go through Optimal and the speed of your website will become even better. GF to article Conversion, you can turn it on but no one is going to benefit much from it after this.
Here comes the option of smart cropping, that is, if your designer has uploaded images on your website in very large sizes but you are cropping them through CSS, then by enabling the option of smart cropping, you can save your There are images on the website, you can crop them. This plugin will automatically crop them.
Retina Quality: If a lot of users visit your website on i or iOS devices, then you can check this retina quality so that the images of your website remain the same. For iOS users, better quality images will be served. After this, there is an option to limit image sizes, that is, if the designer or developer on your website has uploaded images in very large sizes, then you can directly download them from the camera.
If you have selected and uploaded an image of 4000 pixels, its size will automatically be reduced here to 1920 by 1080, that is, only Full HD size images will appear here. After this, we will come to some more options, for example this strip meta. The data option which was available in the format of EXIF is the same option of the plugin which we have seen earlier, here you are getting the name Strip Meta Data, whatever is the meta data of your image i.e. when was it taken, with which camera.
Which lens was A, which Rahu, Ketu, etc., what was the trick of everyone, all these things which are saved as details of your camera, all that data will be removed in the image because it is not useful. After this, another era of AI ML. You have to enable the option of Auto Quality Powered by ML. You can leave it enabled. We have not seen any harm from it till now. After this, the third option related to the image that comes here is the Lazy Load Edge I Said. I will explain lazy load later, but you can leave it enabled wherever you find it in any plugin, it will not cause any harm, after this there is the option of exclusion, if you want that there is a particular image which should not be optimized, then it is optimal.
You can add the details of this type of images here. Do not optimize images. If you will add the file name of the image here and it is your particular image whose file name you are giving here, it will not automatically be optimized. And you are getting the same option for lazy load also, after this there is the option of cloud library, you can leave it set like this, there is no need to change anything in it and the last option you are getting is for image storage i.e. Where should the images of your website be stored? On your website and on Optimal or only on Optimal. So I do not recommend that you trust Optimal so much.
You should leave the first option tick and after this, all these settings are All the image related things of Optimal have been set, the optimization of the images of your website will also be done, scaling will also be done, they will also be loaded lazily and they will reach everywhere through Optimal’s servers through CDN, so this How to use tha Optimal: After this we come to another plugin whose name is Cloud Nari. Cloud Nari is also a very good plugin which gives you a lot of functions. Let’s look at Cloud Nari once. So we have come to Cloud Nari.
The way to setup Cloud Nari in the dashboard is very easy once we see the entire process of its setup, so we first install the Cloud Nari plugin and then activate it and after activating it You will have to link it with your website. The process of linking is quite automated, there is just a little complication at one or two places, so I will show you the process here. We will click on this button named Cloud Nari in the side bar.
You will see and a small sign up button is visible here. Usually in this type of plugins, you have to sign up in their dashboard in some way or the other. An API has to be provided for verification. Here, Cloud Nari.
This process is a little bit complicated, here we will click on the sign up button and you will be taken to another page, here we sign up with our email, I am not a robot, I promise and then I will click. On get started now, you will have to do verification here, once I verify this email ID, after this we proceed with this process, so once the email verification is done, you will come to a window like this, here I I just give one foot of my data for their survey.
Marketing and Creative. We have come to the Done window and here you basically come to a window in the cloud, here you have to click on your account. We have clicked on this second. Above the option Programmable Media and in Programmable Media, you have to come to this dashboard button and after coming to the dashboard button, you will see this button named Environment Variable API Environment Variable, click on it, you have to click on the Copy button. And this is the entire string which has been automatically copied here.
After copying, you will come here and you will have to click on the Next button and whatever string you have just copied, paste it here as it is. Yes and then, after this it will do verification, then give time of second. Connected and then, after this click on Next button and this cloud nari is connected with your website. Setup is also going on. Give time of two minutes. Plugin. But now you have come automatically, after this there are some more settings here, let’s see them once, so here your setup is done and after setup, we come to the General Settings option. In the General Settings, you will see many options. By default, as soon as you log in to this plugin and verify your account, all the options are already set by default.
You do not need to change much, but I will still explain some of the options to you. So, first of all the general setting is coming here, here you can see the option of storage, it is the same way, just now I was showing that I was getting the option to save on Optimal and WordPress or only on Optimal. The same option is visible here with a different name – Cloud Nari & WordPress, Cloud Nari & WordPress Low Resolution Cloud Nari Only, you have to leave it on Cloud Nari & WordPress only, do not change it, after this there is an option for image setting.
Once we come to the image setting option, the first option visible here is Image Delivery, this has to be kept on, it means that only the cloud will deliver your images and show them on the website, so you have to keep this option on. After this Optimize images on my site, that is, Clary will automatically optimize all the images on your website.
Here the image format is set to auto, leave it auto PNG Web P GIF, you have to leave this option set to auto so that the cloud The user can decide according to his own device, what type of image is to be shown, what format of image is to be shown depending on the user’s device, user’s network and the user’s browser, so here it is auto preset, after this there is the option of image quality. Leave it on auto, you have not selected anything, Cloud Nari is very smart in this matter and after this there is no need to make any further changes here, you click on Save Changes, all these options which are format related options which There is an option related to size, that cloud can automatically make all the decisions for you.
After this, there is an option related to article setting, on which we will not focus right now because right now we are focusing only on image SEO. Months of article SEO In this article we will focus on SEO, so here I have come to the next option, Response Images. After coming to the Response Images section, you will enable Response Images. Leave it to remain as it is. All the default options that are enabled here, keep them enabled as is.
There is no need to change anything. Now you have to click on the Save Changes button. Now the lazy loading option is being saved. As I said, I will explain in the next article, because lazy loading the other way becomes very confusing. Lazy Loading ATF: What is ATF Image Exclusion? We will talk about this in the next article which will come in a day or two. So till now, you have seen Cloud Nari, Optimal, w3 Total Cache, and Lap Rocket. Have you seen Flying Press? You can use all the free plugins or paid plugins to serve the images of your website in the best possible way or there are some paid options too and you can use them all your You can serve the images of the website in a better way. In the next article, we will come over lazy loading so that apart from all these optimizations, how can you optimize the images of your website in a better way, so this was Image Caching Image CDN.
And the difference between image optimization plugin, how to use these three, which method you will use, no matter the method you use, but the Atlest on your website since today, the images on your website will be more fast loaded in better quality. The user will have delivery and will also look good, it is more important for the image to have a good image, if you have saved too much and after that your image is not visible good.
Quality is down, it is down, then it is blurred, then it is blur There is no use, in the process of taking the marks of cleaning, they do not leave their copy empty, so they have to optimize the images, but they are also very important to look good in the next article, the image is found in the next article and some topic of the image and the image to the image SEO along with some topics of optimization. In the month of January, you have to keep the image automation in the month of this January, you get to do it in the next article, in the next article, you have to practice for the next article, thank you so much for reading this article my name is Vikram. You next time take care.
