{"id":22239,"date":"2021-04-01T15:00:06","date_gmt":"2021-04-01T13:00:06","guid":{"rendered":"https:\/\/qodeinteractive.com\/magazine\/?p=22239"},"modified":"2022-02-02T10:29:03","modified_gmt":"2022-02-02T09:29:03","slug":"how-to-optimize-wordpress-images-for-search-engines","status":"publish","type":"post","link":"https:\/\/qodeinteractive.com\/magazine\/how-to-optimize-wordpress-images-for-search-engines\/","title":{"rendered":"How to Optimize WordPress Images for Search Engines"},"content":{"rendered":"<div class=\"wpb-content-wrapper\"><p>[vc_row][vc_column][vc_column_text]<span style=\"font-weight: 400;\">Aside from making websites more memorable and creating a good user experience, images are also an important contributing factor that leads to more traffic, better SERP (Search Engine Results Pages) rankings, and higher conversion rates. But none of that can happen unless your photos are well optimized for search engines. <\/span>[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]SEO image optimization differs from <a href=\"https:\/\/qodeinteractive.com\/magazine\/how-to-optimize-images-for-web\/\" target=\"_blank\" rel=\"noopener\">image optimization for the web<\/a>. The latter is indispensable for ensuring pages load fast, which helps reduce bouncing rates. But search engines also analyze all elements in images, and your site\u2019s visibility and relevance on the web greatly depend on what they will read.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]To help you convince search engines your imagery has got exactly what users need, we will show you how to best optimize WordPress images for search engines. In our useful SEO image guide, we will explain why you should stick to the following advice:[\/vc_column_text][vc_empty_space height=&#8221;22px&#8221;]<ul class=\"qodef-unordered-list-item qodef-toc\">\n    <li>\n\t        <div class=\"qodef-ul-title-holder\">\n            <span class=\"qodef-ul-title-content\"><a href=\"#set-image-name\">Set an Appropriate Image Name<\/a><\/span>        <\/div>\n            <\/li>\n<\/ul>[vc_empty_space height=&#8221;5px&#8221;]<ul class=\"qodef-unordered-list-item qodef-toc\">\n    <li>\n\t        <div class=\"qodef-ul-title-holder\">\n            <span class=\"qodef-ul-title-content\"><a href=\"#write-alt-texts\">Write Information-Rich Alt Texts<\/a><\/span>        <\/div>\n            <\/li>\n<\/ul>[vc_empty_space height=&#8221;5px&#8221;]<ul class=\"qodef-unordered-list-item qodef-toc\">\n    <li>\n\t        <div class=\"qodef-ul-title-holder\">\n            <span class=\"qodef-ul-title-content\"><a href=\"#include-image-captions\">Include Image Captions<\/a><\/span>        <\/div>\n            <\/li>\n<\/ul>[vc_empty_space height=&#8221;5px&#8221;]<ul class=\"qodef-unordered-list-item qodef-toc\">\n    <li>\n\t        <div class=\"qodef-ul-title-holder\">\n            <span class=\"qodef-ul-title-content\"><a href=\"#create-a-logical-url-structure\">Create a Logical URL Structure<\/a><\/span>        <\/div>\n            <\/li>\n<\/ul>[vc_empty_space height=&#8221;5px&#8221;]<ul class=\"qodef-unordered-list-item qodef-toc\">\n    <li>\n\t        <div class=\"qodef-ul-title-holder\">\n            <span class=\"qodef-ul-title-content\"><a href=\"#use-responsive-images\">Use Responsive Images<\/a><\/span>        <\/div>\n            <\/li>\n<\/ul>[vc_empty_space height=&#8221;5px&#8221;]<ul class=\"qodef-unordered-list-item qodef-toc\">\n    <li>\n\t        <div class=\"qodef-ul-title-holder\">\n            <span class=\"qodef-ul-title-content\"><a href=\"#create-image-sitemap\">Create an Image Sitemap<\/a><\/span>        <\/div>\n            <\/li>\n<\/ul>[vc_empty_space height=&#8221;5px&#8221;]<ul class=\"qodef-unordered-list-item qodef-toc\">\n    <li>\n\t        <div class=\"qodef-ul-title-holder\">\n            <span class=\"qodef-ul-title-content\"><a href=\"#disable-attachment-pages\">Disable Attachment Pages<\/a><\/span>        <\/div>\n            <\/li>\n<\/ul>[vc_empty_space height=&#8221;5px&#8221;]<ul class=\"qodef-unordered-list-item qodef-toc\">\n    <li>\n\t        <div class=\"qodef-ul-title-holder\">\n            <span class=\"qodef-ul-title-content\"><a href=\"#add-structured-data-to-images\">Add Structured Data to Images<\/a><\/span>        <\/div>\n            <\/li>\n<\/ul>[vc_empty_space height=&#8221;5px&#8221;]<ul class=\"qodef-unordered-list-item qodef-toc\">\n    <li>\n\t        <div class=\"qodef-ul-title-holder\">\n            <span class=\"qodef-ul-title-content\"><a href=\"#include-opengraph-and-twitter-card-tags\">Include OpenGraph and Twitter Card Tags<\/a><\/span>        <\/div>\n            <\/li>\n<\/ul>[vc_empty_space height=&#8221;5px&#8221;]<ul class=\"qodef-unordered-list-item qodef-toc\">\n    <li>\n\t        <div class=\"qodef-ul-title-holder\">\n            <span class=\"qodef-ul-title-content\"><a href=\"#use-cnd-to-optimize-images\">Use a CDN to Optimize Images<\/a><\/span>        <\/div>\n            <\/li>\n<\/ul>[vc_empty_space height=&#8221;70px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\"><a id=\"set-image-name\"><\/a>Set an Appropriate Image Name<\/h2>\n<p>[\/vc_column_text][vc_column_text]As an important SEO asset, images need to have a name. However, not just any name will do. Generic names such as \u201cIMG_20190914_1843\u201d don\u2019t mean a thing to search engines and they\u2019re not informative for users either. [\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]<strong>The key is to use descriptive, keyword-rich file names<\/strong>. Make sure to separate words with <strong>hyphens<\/strong> (underscores are a big no-no) so that search engines can <strong>recognize each word individually<\/strong>.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]For instance, you may want to upload an image of a tea packaging to your site:[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"700\" height=\"374\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/image-of-a-tea-packaging-white.jpg\" class=\"attachment-full size-full\" alt=\"image of a tea packaging\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/image-of-a-tea-packaging-white.jpg 700w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/image-of-a-tea-packaging-white-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/image-of-a-tea-packaging-white-620x331.jpg 620w\" sizes=\"auto, (max-width: 700px) 100vw, 700px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]To improve the SEO value of your file, you could name it \u201corganic-herbal-tea\u201d.[\/vc_column_text][vc_empty_space height=&#8221;68px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\"><a id=\"write-alt-texts\"><\/a>Write Information-Rich Alt Texts<\/h2>\n<p>[\/vc_column_text][vc_column_text]Alt text or alternative text is an HTML attribute that describes images. <strong>It doesn\u2019t necessarily have to mirror the content of an image, but it should match its meaning<\/strong>. [\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Alt texts are <strong>primarily used for screen readers<\/strong> that <a href=\"https:\/\/qodeinteractive.com\/magazine\/how-to-improve-accessibility-wordpress\/\">improve the accessibility of websites<\/a> and are intended for visually impaired audiences. Those programs include a voice synthesizer that helps users surf the web and informs them about the content on the page they\u2019re browsing.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Alt texts also help search engines <strong>accurately index photographs<\/strong> on a site. Search engines will focus on alt text to understand the subject of an image and determine if it\u2019s a good match for users\u2019 inquiries.<br \/>\n[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Moreover, when photos won\u2019t load for whatever reason, an image box with an alt text will appear. Search engines will rely on alt text to rank a page and visitors will understand what the photo is supposed to be. If there\u2019s no alt text, users will just see an empty space.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]<strong>Alt texts should include targeted keywords, but most of all, they need to be informative and on point<\/strong>. However, be careful not to slip into the keyword stuffing trap. Say you wish to add an image of a chair:[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"700\" height=\"374\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/image-of-a-chair-white.jpg\" class=\"attachment-full size-full\" alt=\"image of a chair\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/image-of-a-chair-white.jpg 700w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/image-of-a-chair-white-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/image-of-a-chair-white-620x331.jpg 620w\" sizes=\"auto, (max-width: 700px) 100vw, 700px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Avoid using this kind of alt text: [\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;][vc_column_text]<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\">&lt;img src=\u201dchair.jpg\u201d alt=\u201dWooden chair furniture handmade living room interior design\u201d\/&gt;<\/pre>\n<p>[\/vc_column_text][vc_empty_space height=&#8221;18px&#8221;][vc_column_text]It contains far <strong>too many keywords, which could cause your website to be marked as spam<\/strong>. Not to mention probable bad user experience. [\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]A good alt text for an image like this could be:[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;][vc_column_text]<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\">&lt;img src=\u201dchair.jpg\u201d alt=\u201dHandmade wooden chair\u201d\/&gt;<\/pre>\n<p>[\/vc_column_text][vc_empty_space height=&#8221;18px&#8221;][vc_column_text]There is no ideal number of characters recommended for alt texts, but it\u2019d be best to aim for 25 or shorter.[\/vc_column_text][vc_empty_space height=&#8221;68px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\"><a id=\"include-image-captions\"><\/a>Include Image Captions<\/h2>\n<p>[\/vc_column_text][vc_column_text]Captions are usually displayed below images. They help users discover more information about elements in photos or learn their background story. [\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]While <strong>they do not have a direct impact on SEO, captions are visible on pages and therefore can influence UX<\/strong>. For instance, if you run a flower shop or simply sell plants online, it wouldn\u2019t make much sense adding flower images without captions. You don\u2019t want to risk high bouncing rates and jeopardize your credibility with search engines just because visitors couldn\u2019t find out the name of a particular flower on your site. Some may be ready to make purchases based on the way flowers look, but the majority of buyers will probably be interested in learning more details about the flower that caught their eye. [\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"700\" height=\"374\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Flower-image-white.jpg\" class=\"attachment-full size-full\" alt=\"Flower image white\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Flower-image-white.jpg 700w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Flower-image-white-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Flower-image-white-620x331.jpg 620w\" sizes=\"auto, (max-width: 700px) 100vw, 700px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;82px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h3 class=\"qodef-h5\">How to Add Image Titles, Alt Texts, and Image Captions in WordPress<\/h3>\n<p>[\/vc_column_text][vc_column_text]To help you add metadata for your images, we have made an easy-to-follow video tutorial.[\/vc_column_text][vc_empty_space height=&#8221;41px&#8221;][vc_column_text]<iframe loading=\"lazy\" title=\"YouTube video player\" src=\"https:\/\/www.youtube.com\/embed\/0WTsSoSI-Mw\" width=\"1280\" height=\"720\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe>[\/vc_column_text][vc_empty_space height=&#8221;40px&#8221;][vc_column_text]Alternatively, you can stick to the following guidelines.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]In <strong>Gutenberg<\/strong>, once the file uploads, you can enter the <a href=\"https:\/\/qodeinteractive.com\/magazine\/wordpress-image-captions\/\">caption under the image<\/a>:[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Write-Image-caprion.jpg\" class=\"attachment-full size-full\" alt=\"Write Image caprion\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Write-Image-caprion.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Write-Image-caprion-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Write-Image-caprion-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Write-Image-caprion-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]As for alt text, you will find the designated field on the right-hand side of the screen, under <em><strong>Image Settings<\/strong><\/em>:[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Image-alt-text.jpg\" class=\"attachment-full size-full\" alt=\"Image alt text\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Image-alt-text.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Image-alt-text-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Image-alt-text-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Image-alt-text-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Regarding the name of the image, WordPress will generate it from the file name. To change it, open your media library &#8211; you can jump to it directly from the block by clicking on the <em>Replace<\/em> button above the image and selecting <em>Open Media Library<\/em>.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Replace-image.jpg\" class=\"attachment-full size-full\" alt=\"Replace image\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Replace-image.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Replace-image-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Replace-image-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Replace-image-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Then, select the photo in question and modify its title within the <em><strong>Attachment Details<\/strong><\/em> panel.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Add-Image-title.jpg\" class=\"attachment-full size-full\" alt=\"Add Image title\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Add-Image-title.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Add-Image-title-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Add-Image-title-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Add-Image-title-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]You can make changes to the caption and alt text within the media library, too.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]If you\u2019re loyal to the <strong>Classic Editor<\/strong>, you can enter metadata for your image by clicking on the pencil icon placed above the file:[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Alt-text-Classic-editor.jpg\" class=\"attachment-full size-full\" alt=\"Alt text Classic editor\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Alt-text-Classic-editor.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Alt-text-Classic-editor-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Alt-text-Classic-editor-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Alt-text-Classic-editor-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]In the newly opened window, you can enter alt text and caption for your file:[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Alt-text-and-caption-for-your-file.jpg\" class=\"attachment-full size-full\" alt=\"Alt text and caption for your file\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Alt-text-and-caption-for-your-file.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Alt-text-and-caption-for-your-file-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Alt-text-and-caption-for-your-file-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Alt-text-and-caption-for-your-file-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]To change the title, you need to open <em>Advanced Options<\/em> at the bottom of the screen:[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Advanced-Options.jpg\" class=\"attachment-full size-full\" alt=\"Advanced Options\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Advanced-Options.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Advanced-Options-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Advanced-Options-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Advanced-Options-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]In <strong>Elementor<\/strong>, you should first click on the image you\u2019ve uploaded. Then, within the menu on the left-hand side of the screen, you have to click on the tiny showcase of your photo for the pencil icon to appear:[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Image-caption-in-Elementor.jpg\" class=\"attachment-full size-full\" alt=\"Image caption in Elementor\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Image-caption-in-Elementor.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Image-caption-in-Elementor-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Image-caption-in-Elementor-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Image-caption-in-Elementor-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]You will then see the same <em>Image Details<\/em> panel as in the Classic Editor, allowing you to enter the title, alt text, and caption for your picture.[\/vc_column_text][vc_empty_space height=&#8221;80px&#8221;][vc_widget_sidebar sidebar_id=&#8221;new-top-picks-banner&#8221;][vc_empty_space height=&#8221;81px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\"><a id=\"create-a-logical-url-structure\"><\/a>Create a Logical URL Structure<\/h2>\n<p>[\/vc_column_text][vc_column_text]Search engines pay attention to URL paths to better understand your file structure, which makes <strong>file paths an important ranking factor<\/strong>.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Because of this, it\u2019s important to ensure your <strong>URLs are sensical and logical<\/strong>, especially if your site is image-rich. For instance, if you run an online store, you should organize and name your content carefully. Take a look at this example from Adidas\u2019 website:[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]<em>https:\/\/www.adidas.com\/us\/women-black-workout-shoes<\/em>[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]From this URL path, it is clear both to users and search engines what kind of photos they\u2019ll find on the page in question. [\/vc_column_text][vc_empty_space height=&#8221;68px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\"><a id=\"use-responsive-images\"><\/a>Use Responsive Images<\/h2>\n<p>[\/vc_column_text][vc_column_text]Ensuring your images look pixel-perfect on all devices, regardless of their resolution and size, is a must. As of WordPress 4.4, the <a href=\"https:\/\/wordpress.org\/support\/plugin\/ricg-responsive-images\/\" target=\"_blank\" rel=\"noopener\">RICG Responsive Images plugin<\/a> has been merged into the platform\u2019s core, so you get responsive images by default.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]When you upload a photo to your Media Library, the platform will create five copies in different sizes, including <strong>full<\/strong> (the original file size), <strong>large<\/strong> (maximum height or width of 1024px), <strong>medium large<\/strong> (maximum height or width of 768px), <strong>medium<\/strong> (maximum height or width of 300px), and <strong>thumbnail<\/strong> (maximum height or width of 150px). You can alter these sizes manually.<br \/>\n[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]<strong>WordPress uses srcset and size attributes to communicate with browsers and tell them which of the five sizes to select<\/strong>. The srcset attribute informs them about the image width and size about the dimensions the image should be scaled to, depending on the device. [\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Regardless of this, it&#8217;s always a good idea to use a fully responsive <a href=\"https:\/\/qodeinteractive.com\/themes-list\/\">WordPress theme<\/a> to make sure every aspect of your site looks great on all devices.[\/vc_column_text][vc_empty_space height=&#8221;68px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\"><a id=\"disable-attachment-pages\"><\/a>Disable Attachment Pages<\/h2>\n<p>[\/vc_column_text][vc_column_text]Whenever you upload an image to your site, WordPress creates a URL for it. <strong>That URL is called an attachment page URL. Users can find attachment pages using search or access them via a direct link.<\/strong> [\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]All attachment pages include just a larger version of the image you added, which could cause bad UX and increase bouncing rates. Hence why it would be better to disable them. The fastest way to go about that is to use the <a href=\"https:\/\/wordpress.org\/plugins\/wordpress-seo\/\" target=\"_blank\" rel=\"noopener\">Yoast plugin<\/a>.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Head over to your dashboard and select <em><strong>SEO &gt; Search Appearance<\/strong><\/em>.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Disable-Attachment-Pages.jpg\" class=\"attachment-full size-full\" alt=\"Disable Attachment Pages\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Disable-Attachment-Pages.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Disable-Attachment-Pages-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Disable-Attachment-Pages-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Disable-Attachment-Pages-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Then, click on the <em><strong>Media<\/strong><\/em> tab and set the <em><strong>Redirect attachment URLs to the attachment itself <\/strong><\/em>option to <strong><em>Yes<\/em>.<\/strong>[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Redirect-attachment-URLs-to-the-attachment-itself.jpg\" class=\"attachment-full size-full\" alt=\"Redirect attachment URLs to the attachment itself\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Redirect-attachment-URLs-to-the-attachment-itself.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Redirect-attachment-URLs-to-the-attachment-itself-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Redirect-attachment-URLs-to-the-attachment-itself-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Redirect-attachment-URLs-to-the-attachment-itself-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]The non-plugin way of preventing users from accessing attachment pages is by adding the following code to your site\u2019s functions.php file:[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;][vc_column_text]<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\">function qode_attachment_redirection() {\r\nif ( is_attachment() ) {\r\nglobal $post;\r\nif ( empty( $post ) ) {\r\n$post = get_queried_object();\r\n}\r\nif ( $post-&gt;post_parent ) {\r\n$redirect_link = get_permalink( $post-&gt;post_parent );\r\n\/\/ Redirect to the parent page\/post, i.e. on which the image was uploaded\r\nwp_safe_redirect( $redirect_link, '301' );\r\nexit();\r\n} else {\r\n\/\/ If the parent page\/post is unavailable, redirect to the homepage\r\nwp_safe_redirect( home_url(), '301' );\r\nexit();\r\n}\r\n}\r\n}\r\nadd_action( 'template_redirect', 'qode_attachment_redirection' );<\/pre>\n<p>[\/vc_column_text][vc_empty_space height=&#8221;18px&#8221;][vc_column_text]Once you add this code to the functions.php file, two outcomes are possible:[\/vc_column_text][vc_empty_space height=&#8221;38px&#8221;]<div class=\"qodef-ordered-list-item \">\n\t        <div class=\"qodef-ol-title-holder\">\n            <span class=\"qodef-ol-title-number\">1.<\/span>\n            <span class=\"qodef-ol-title-content\">In case you\u2019ve uploaded an image to a page or post using an image shortcode, users will be redirected to that page\/post - the so-called parent page\/post<\/span>        <\/div>\n    <\/div><div class=\"qodef-ordered-list-item \">\n\t        <div class=\"qodef-ol-title-holder\">\n            <span class=\"qodef-ol-title-number\">2.<\/span>\n            <span class=\"qodef-ol-title-content\">If you\u2019ve added an image to a page or post directly from the Media Library (i.e. without using shortcodes), users will be redirected to your site\u2019s homepage.<\/span>        <\/div>\n    <\/div>[vc_column_text]Either way, they won\u2019t be able to access the attachment page. However, if you are not a WordPress expert, we don\u2019t recommend making any changes to the functions.php file on your own. [\/vc_column_text][vc_empty_space height=&#8221;68px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\"><a id=\"create-image-sitemap\"><\/a>Create an Image Sitemap<\/h2>\n<p>[\/vc_column_text][vc_column_text]A sitemap or XML Sitemap is a file that contains all URLs on a site as well as information about them. Users cannot see it, but its significance lies in the fact that <strong>it helps search engines find, crawl, understand, and index content<\/strong>. [\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Search engine bots automatically crawl sites, but there is always a chance they may skip some files. <strong>When you make a sitemap, Googlebot and other crawlers will find your entire content but also understand how your pages are organized and connected to each other<\/strong>. [\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]To ensure search engines get all the necessary information about your images and index them, you should create an image sitemap. If you need help to make one, our extensive <a href=\"https:\/\/qodeinteractive.com\/magazine\/wordpress-sitemap\/\">guide on WordPress sitemaps and how to create them<\/a> will be of great help.[\/vc_column_text][vc_empty_space height=&#8221;68px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\"><a id=\"add-structured-data-to-images\"><\/a>Add Structured Data to Images<\/h2>\n<p>[\/vc_column_text][vc_column_text]Structured data a.k.a. schema markup contains organized information about a page and its content. The reason why you should use structured data is to <strong>provide search engines with as much information as possible about your content, help them understand it, and make it eligible to be displayed as a rich result in search<\/strong>. If you mark up your images correctly, it will be easier for users to understand what type of content is related to visuals, decide if it\u2019s relevant for their query, and ultimately increase your site\u2019s traffic. [\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Google Images uses structured data <strong>for products, videos, and recipes<\/strong>. Moreover, it also displays all three categories as well as GIFs with <strong>relevant badges on mobile phones<\/strong>. Badges are visible in the bottom left corner of the photo, telling users what kind of content awaits if they click on the image.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Add-Structured-Data-to-Images.jpg\" class=\"attachment-full size-full\" alt=\"Add Structured Data to Images\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Add-Structured-Data-to-Images.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Add-Structured-Data-to-Images-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Add-Structured-Data-to-Images-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Add-Structured-Data-to-Images-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]If you, for example, run a <a href=\"https:\/\/qodeinteractive.com\/theme-tag\/cooking-blog-wordpress-themes\/\">cooking blog<\/a>, besides images, you could include user ratings, cooking times, as well as nutrition information in your structured data. The more information you give to Google, the easier it will be for it to showcase your recipe in an appealing way, inciting users to visit your page.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Google-Image-example.jpg\" class=\"attachment-full size-full\" alt=\"Google Image example\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Google-Image-example.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Google-Image-example-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Google-Image-example-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Google-Image-example-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]In case you need help with schema markups, Google created a helpful guide on <a href=\"https:\/\/developers.google.com\/search\/docs\/guides\/intro-structured-data\" target=\"_blank\" rel=\"noopener\">understanding how structured data works<\/a>. They also wrote down <a href=\"https:\/\/developers.google.com\/search\/docs\/guides\/intro-structured-data\" target=\"_blank\" rel=\"noopener\">general structured data guidelines<\/a>, which you should follow to increase the chances of having your images displayed as rich results.[\/vc_column_text][vc_empty_space height=&#8221;68px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\"><a id=\"include-opengraph-and-twitter-card-tags\"><\/a>Include OpenGraph and Twitter Card Tags<\/h2>\n<p>[\/vc_column_text][vc_column_text]OpenGraph is a protocol introduced by Facebook to facilitate integration between websites and the said social media giant. <strong>When you integrate OpenGraph meta tags to your HTML, you can control the way your content will look when others share it on Facebook<\/strong>. [\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]The most common OpenGraph meta tags include og:title, og:description, og:url, og:site_name, and og:image. The reason why the image tag matters a lot is because <strong>appealing photos can incite people to visit your page<\/strong>. [\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"700\" height=\"374\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Include-OpenGraph-Tags-stroke.jpg\" class=\"attachment-full size-full\" alt=\"Include OpenGraph Tags\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Include-OpenGraph-Tags-stroke.jpg 700w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Include-OpenGraph-Tags-stroke-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Include-OpenGraph-Tags-stroke-620x331.jpg 620w\" sizes=\"auto, (max-width: 700px) 100vw, 700px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]<strong>Twitter Card tags are the same as OpenGraph meta tags except that they\u2019re intended exclusively for Twitter<\/strong>. Again, their purpose is to make your content look interesting for Twitter users and bring more traffic your way.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"700\" height=\"374\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Include-OpenGraph-and-Twitter-Card-Tags-white.jpg\" class=\"attachment-full size-full\" alt=\"Include OpenGraph and Twitter Card Tags\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Include-OpenGraph-and-Twitter-Card-Tags-white.jpg 700w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Include-OpenGraph-and-Twitter-Card-Tags-white-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Include-OpenGraph-and-Twitter-Card-Tags-white-620x331.jpg 620w\" sizes=\"auto, (max-width: 700px) 100vw, 700px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]The easiest way of <a href=\"https:\/\/qodeinteractive.com\/magazine\/facebook-open-graph-wordpress\/\">adding OpenGraph<\/a> and Twitter Card tags to your WordPress site is by using Yoast or another popular SEO plugin, such as <a href=\"https:\/\/qodeinteractive.com\/magazine\/is-rank-math-best-free-wordpress-seo-plugin\/\">RankMath<\/a>. We will show you how to add them with Yoast.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]For starters, head over to <em><strong>SEO &gt; Social<\/strong><\/em> in the admin dashboard and select the <em><strong>Facebook<\/strong><\/em> tab.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Facebook-tab.jpg\" class=\"attachment-full size-full\" alt=\"Facebook tab\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Facebook-tab.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Facebook-tab-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Facebook-tab-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Facebook-tab-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Enable OpenGraph metadata and then upload an image that will be used as the default for pages without any photos.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]To add Twitter Card tags, click on the <em><strong>Twitter<\/strong><\/em> tab.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Twitter-tab.jpg\" class=\"attachment-full size-full\" alt=\"Twitter tab\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Twitter-tab.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Twitter-tab-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Twitter-tab-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Twitter-tab-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Make sure to enable Twitter Card metadata and to select the default card type that should be used. You can choose between displaying only the summary or a summary with a large image.[\/vc_column_text][vc_empty_space height=&#8221;68px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\"><a id=\"use-cnd-to-optimize-images\"><\/a>Use a CDN to Optimize Images<\/h2>\n<p>[\/vc_column_text][vc_column_text]Content Delivery Network or a CDN is a network of servers that are distributed globally. When a visitor makes a request on the web, <strong>a CDN will use the node geographically closest to the user to minimize delays in loading content and deliver spotless performance<\/strong>. An image CDN not only does that, but it also <strong>recognizes the user\u2019s device and then optimizes images accordingly<\/strong> before delivering them to the user.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Since speed is a major ranking factor, it would be wise to <strong>use Image CDNs to boost the performance of your site and have visuals load with no delays<\/strong>. That way, users will spend more time on your site enjoying the fast-loading content, which could lead to higher conversion rates.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]When it comes to WordPress and image CDNs, the <a href=\"https:\/\/jetpack.com\/\" target=\"_blank\" rel=\"noopener\">Jetpack<\/a>\u2019s Site Accelerator function helps deliver images to people using a global server network. Alternatively, you can try <a href=\"https:\/\/www.keycdn.com\/\" target=\"_blank\" rel=\"noopener\">KeyCDN<\/a>, <a href=\"https:\/\/www.cloudflare.com\/\" target=\"_blank\" rel=\"noopener\">Cloudflare<\/a>, <a href=\"https:\/\/www.stackpath.com\/\" target=\"_blank\" rel=\"noopener\">StackPath<\/a>, or <a href=\"https:\/\/aws.amazon.com\/cloudfront\/\" target=\"_blank\" rel=\"noopener\">Amazon CloudFront<\/a>. And if you wish to learn more about content delivery networks, we encourage you to read our article on <a href=\"https:\/\/qodeinteractive.com\/magazine\/what-is-a-cdn\/\">CDNs and why you need them<\/a>.[\/vc_column_text][vc_empty_space height=&#8221;68px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\">Let\u2019s Wrap It Up!<\/h2>\n<p>[\/vc_column_text][vc_column_text]While this list of SEO advice on how to optimize WordPress images for search engines may seem overwhelming at first, once you pay closer attention to all of the steps, you will realize that they are actually not so hard to follow. You can take care of them all by yourself, even if you don\u2019t know how to code, just by relying on your own organizational skills and installing some practical plugins. Use our table of contents as a to-do-list, and slowly uncheck the boxes one by one.<br \/>\n[\/vc_column_text][\/vc_column][\/vc_row]<\/p>\n<\/div>","protected":false},"excerpt":{"rendered":"<p>Convince search engines your imagery has got exactly what users need and learn how to best optimize WordPress images for search engines with our SEO image guide<\/p>\n","protected":false},"author":4,"featured_media":22248,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[7],"tags":[27,25,4,13],"class_list":["post-22239","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutorials","tag-content","tag-seo","tag-tips","tag-wordpress"],"_links":{"self":[{"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/posts\/22239","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/comments?post=22239"}],"version-history":[{"count":0,"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/posts\/22239\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/media\/22248"}],"wp:attachment":[{"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/media?parent=22239"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/categories?post=22239"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/tags?post=22239"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}