{"id":527,"date":"2021-06-22T14:42:28","date_gmt":"2021-06-22T14:42:28","guid":{"rendered":"https:\/\/imagify.io\/documentation\/?p=527"},"modified":"2024-09-22T08:12:46","modified_gmt":"2024-09-22T08:12:46","slug":"recommended-imagify-settings","status":"publish","type":"post","link":"https:\/\/imagify.io\/documentation\/recommended-imagify-settings\/","title":{"rendered":"Our Recommended Imagify Settings"},"content":{"rendered":"\n<div style=\"height:49px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Optimization Level<\/h3>\n\n\n\n<p>Imagify offers two main optimization levels to choose from:<\/p>\n\n\n\n<p><strong>Smart Compression (Default)<\/strong>:<br>This mode compresses your images at their best without impacting quality. Imagify will automatically find the best balance between quality and performance, so there\u2019s no need to adjust anything. This level is perfect for ensuring your images are optimized for both quality and loading speed.<\/p>\n\n\n\n<p><strong>Lossless Compression<\/strong>:<br>This mode compresses images without any visible change. However, the file size reduction will be less than what you get with Smart Compression. While this is ideal if you want to maintain pixel-perfect quality, it won\u2019t provide the maximum performance benefits.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1145\" height=\"556\" src=\"https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/Screenshot-2022-12-13-at-16.57.16.png\" alt=\"\" class=\"wp-image-912\" srcset=\"https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/Screenshot-2022-12-13-at-16.57.16.png 1145w, https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/Screenshot-2022-12-13-at-16.57.16-300x146.png 300w, https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/Screenshot-2022-12-13-at-16.57.16-768x373.png 768w, https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/Screenshot-2022-12-13-at-16.57.16-1024x497.png 1024w\" sizes=\"auto, (max-width: 1145px) 100vw, 1145px\" \/><\/figure>\n\n\n\n<p>If you need to switch a few images to Lossless, you can do so from the <strong>Media Library (List View)<\/strong>. To apply Lossless to all images, go to <strong>Imagify Settings<\/strong>, select <strong>Lossless Compression<\/strong>, and click <strong>Save<\/strong>. Then head to <strong>Media &gt; Bulk Optimization<\/strong> and re-optimize all your images to Lossless.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Auto-Optimize Images on Upload<\/h3>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"415\" height=\"64\" src=\"https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/settings-auto-optimize-images.png\" alt=\"\" class=\"wp-image-531\" srcset=\"https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/settings-auto-optimize-images.png 415w, https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/settings-auto-optimize-images-300x46.png 300w\" sizes=\"auto, (max-width: 415px) 100vw, 415px\" \/><\/figure>\n\n\n\n<p>In most cases, we would recommend enabling this option as a convenience so whenever you upload new images to your Media Library, they automatically get optimized. With that said, if there are only certain images that you want optimized and you&#8217;d prefer to manually choose which images to optimize, then you could disable this option.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Backup Original Images<\/h3>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"477\" height=\"66\" src=\"https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/settings-backup-original-images.png\" alt=\"\" class=\"wp-image-539\" srcset=\"https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/settings-backup-original-images.png 477w, https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/settings-backup-original-images-300x42.png 300w\" sizes=\"auto, (max-width: 477px) 100vw, 477px\" \/><\/figure>\n\n\n\n<p>We strongly recommend enabling the option to back up your original images. This is important because the original images are needed to:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Generate new thumbnail sizes (for instance, if you change your theme or install a plugin).<\/li>\n\n\n\n<li>Re-optimize images to another compression level.<\/li>\n\n\n\n<li>Restore images to their original version if needed.<\/li>\n\n\n\n<li>Generate Next-Gen formats like WebP or AVIF.<\/li>\n<\/ul>\n\n\n<div class=\"message-panel blue\"><i class=\"fa fa-info-circle\"><\/i><span class=\"message-panel__title\">Note<\/span><span class=\"message-panel__message\">There is no real impact on image size when removing EXIF data, so it is kept by default.<\/span><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Next-Gen Image Creation &amp; Display<\/h3>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1180\" height=\"445\" src=\"https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2024\/04\/Next-Gen-filter.png\" alt=\"\" class=\"wp-image-1025\" srcset=\"https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2024\/04\/Next-Gen-filter.png 1180w, https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2024\/04\/Next-Gen-filter-300x113.png 300w, https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2024\/04\/Next-Gen-filter-1024x386.png 1024w, https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2024\/04\/Next-Gen-filter-768x290.png 768w\" sizes=\"auto, (max-width: 1180px) 100vw, 1180px\" \/><\/figure>\n\n\n\n<p>Imagify allows you to choose whether to create <strong><a href=\"https:\/\/imagify.io\/documentation\/enable-webp-images-works\/\">WebP<\/a><\/strong> or <strong><a href=\"https:\/\/imagify.io\/documentation\/how-avif-works-and-how-it-can-be-enabled\/\">AVIF<\/a><\/strong> versions of your images, or you can disable Next-Gen formats entirely. Both formats help reduce image size while maintaining quality.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>WebP<\/strong> has <strong>wider browser compatibility<\/strong>, making it a solid choice for most websites.<\/li>\n\n\n\n<li><strong>AVIF<\/strong> can <strong>offer slightly better compression<\/strong> (smaller file sizes) but is supported by fewer browsers.<\/li>\n<\/ul>\n\n\n\n<p>When serving Next-Gen images, Imagify ensures a <a href=\"https:\/\/imagify.io\/documentation\/webp-feature-work-not-supported-browsers\/\">fallback mechanism<\/a>, meaning that if a browser doesn\u2019t support WebP or AVIF, the optimized image format (JPG\/PNG) will be served automatically.<\/p>\n\n\n\n<p>There are two methods for displaying Next-Gen formats:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li><strong>Use Rewrite Rules (recommended)<\/strong>: This method doesn\u2019t alter your site&#8217;s HTML and works seamlessly for most setups, except when using Cloudflare or a CDN.<\/li>\n\n\n\n<li><strong>Use <code>&lt;picture&gt;<\/code> Tags<\/strong>: This method replaces the <code>&lt;img&gt;<\/code> tags with <code>&lt;picture&gt;<\/code> tags for better compatibility with Next-Gen formats. However, if you experience layout issues, please refer to <a href=\"https:\/\/imagify.io\/documentation\/my-images-are-broken\/\">this documentation<\/a>.<\/li>\n<\/ol>\n\n\n\n<h3 class=\"wp-block-heading\">Resize Larger Images<\/h3>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"492\" height=\"137\" src=\"https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/settings-resize-larger-images.png\" alt=\"\" class=\"wp-image-553\" srcset=\"https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/settings-resize-larger-images.png 492w, https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/settings-resize-larger-images-300x84.png 300w\" sizes=\"auto, (max-width: 492px) 100vw, 492px\" \/><\/figure>\n\n\n\n<p>Reducing the display size of your images can provide a large reduction in their file size, so we recommend having this option enabled in most cases. You can set the maximum width value to what is appropriate for your site based on the maximum size at which your images might need to be displayed. This value can only be set a low as your largest registered thumbnail size.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Files Optimization<\/h3>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"499\" height=\"380\" src=\"https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/settings-files-optimization.png\" alt=\"\" class=\"wp-image-554\" srcset=\"https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/settings-files-optimization.png 499w, https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/settings-files-optimization-300x228.png 300w\" sizes=\"auto, (max-width: 499px) 100vw, 499px\" \/><\/figure>\n\n\n\n\n\n\n\n<p>This section lists all the thumbnail image sizes registered with your site to be created by WordPress when you upload an image to your Media Library. Imagify will optimize and create Next-Gen versions for each thumbnail size that is checked. We recommend that you keep each of these sizes that are used on your site enabled, but you can disable any of the sizes that are not used.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Custom Folders<\/h3>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"491\" height=\"277\" src=\"https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/settings-custom-folders.png\" alt=\"\" class=\"wp-image-556\" srcset=\"https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/settings-custom-folders.png 491w, https:\/\/imagify.io\/documentation\/wp-content\/uploads\/2021\/06\/settings-custom-folders-300x169.png 300w\" sizes=\"auto, (max-width: 491px) 100vw, 491px\" \/><\/figure>\n\n\n\n\n\n\n\n<p>Imagify optimizes images in your Media Library by default, but if you have images stored in other folder locations on your server, you may wish to add those here. There&#8217;s an option to add your theme&#8217;s images to optimization as well.<\/p>\n\n\n\n<p>We recommend adding any folders containing images that are displayed on your site so they&#8217;re all optimized. Once the folders are added and you run the Bulk Optimizer, you&#8217;ll be able to find these custom folder images in <b>Media &gt; Other Media<\/b>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Optimization Level Imagify offers two main optimization levels to choose from: Smart Compression (Default):This mode compresses your images at their best without impacting quality. Imagify will automatically find the best balance between quality and performance, so there\u2019s no need to adjust anything. This level is perfect for ensuring your images are optimized for both quality [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,4,5],"tags":[],"class_list":["post-527","post","type-post","status-publish","format-standard","hentry","category-image-optimization","category-webp","category-wordpress-plugin"],"_links":{"self":[{"href":"https:\/\/imagify.io\/documentation\/wp-json\/wp\/v2\/posts\/527","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/imagify.io\/documentation\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/imagify.io\/documentation\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/imagify.io\/documentation\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/imagify.io\/documentation\/wp-json\/wp\/v2\/comments?post=527"}],"version-history":[{"count":32,"href":"https:\/\/imagify.io\/documentation\/wp-json\/wp\/v2\/posts\/527\/revisions"}],"predecessor-version":[{"id":1102,"href":"https:\/\/imagify.io\/documentation\/wp-json\/wp\/v2\/posts\/527\/revisions\/1102"}],"wp:attachment":[{"href":"https:\/\/imagify.io\/documentation\/wp-json\/wp\/v2\/media?parent=527"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/imagify.io\/documentation\/wp-json\/wp\/v2\/categories?post=527"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/imagify.io\/documentation\/wp-json\/wp\/v2\/tags?post=527"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}