You're likely always looking for ways to <a href="https:\/\/pagely.com\/blog\/2015\/06\/speed-optimization-wordpress-plugins-need\/">speed up your WordPress site<\/a>. With benefits like <a href="https:\/\/blogs.akamai.com\/2015\/06\/performance-matters-more-than-ever.html" target="_blank" rel="noopener">improved user experience<\/a>, more <a href="http:\/\/conferences.oreilly.com\/velocity\/velocityny2013\/public\/schedule\/detail\/30146" target="_blank" rel="noopener">conversions<\/a>, and maybe even <a href="https:\/\/webmasters.googleblog.com\/2010\/04\/using-site-speed-in-web-search-ranking.html" target="_blank" rel="noopener">better search rankings<\/a>, faster page load times are always a good thing.\r\n\r\nThere are a number of ways to speed up WordPress (many of which <a href="https:\/\/pagely.com\/tech\/">Pagely has implemented<\/a>). But given that <a href="https:\/\/blogs.akamai.com\/2015\/06\/performance-matters-more-than-ever.html" target="_blank" rel="noopener">63% of an average web page's file size<\/a> is images, improving your approach to WordPress image optimization offers a stellar return on investment when it comes to page load times.\r\n\r\nWordPress image optimization basically involves slimming down your images' file sizes without affecting user experience by implementing a couple of basic strategies.\r\n\r\nIn this post, we'll go over those strategies, as well as how you can implement them for your own WordPress site using either plugins or a manual method.\r\n<h2>What Goes Into WordPress Image Optimization?<\/h2>\r\nWordPress image optimization generally breaks down into two core categories:\r\n<ul>\r\n \t<li>Resizing image dimensions to avoid wasted pixels<\/li>\r\n \t<li>Compressing images to reduce their file size<\/li>\r\n<\/ul>\r\nWhile there are other smaller considerations like file formats, generally you'll need to "work with what's available" so to speak.\r\n\r\nLet's break down those two factors and parse out why each is important.\r\n<h3>Resize WordPress Image Dimensions So You Don't Waste Space<\/h3>\r\nAccording to the latest data from Statcounter, the most <a href="http:\/\/gs.statcounter.com\/screen-resolution-stats\/desktop\/worldwide" target="_blank" rel="noopener">common desktop screen resolution<\/a>, by far, is <strong>1366x768<\/strong>. The massive growth of mobile puts the <a href="http:\/\/gs.statcounter.com\/screen-resolution-stats" target="_blank" rel="noopener">overall most common screen resolution<\/a> at just <strong>360x640<\/strong>.\r\n\r\nWhy are those stats important? Because they show that uploading a 4000x2000 px image isn't necessarily going to offer your visitors any better quality.\r\n\r\nWhen you combine those screen resolutions with the fact that most WordPress sites have at least one sidebar, the average WordPress site has a viewable content area that's probably somewhere in the range of 800px for most users.\r\n\r\nBeyond a small buffer to give you some flexibility if you change themes in the future, every pixel over the max display dimensions of your theme just inflates your images' sizes unnecessarily. Side note: using <a href="https:\/\/pagely.com\/blog\/wordpress-photo-gallery\/">photo galleries in WordPress<\/a> can help you further restrain these dimensions, when used properly.\r\n<h3>Compress WordPress Images To Save Even More Space<\/h3>\r\nOnce you resize your images' dimensions, you can still shave off more file size by performing something called <strong>compression<\/strong>. Compression shrinks images further <em>without making any changes to the dimensions<\/em>.\r\n\r\nCompression comes in two forms:\r\n<ul>\r\n \t<li><strong>Lossless <\/strong>- a moderate type of compression that reduces file size <strong>without affecting quality.<\/strong><\/li>\r\n \t<li><strong><strong>Lossy<\/strong> - <\/strong>a more aggressive type of compression that greatly reduces file size at the expense of a reduction in quality.<\/li>\r\n<\/ul>\r\nWhich is better? That depends entirely on your goals. If your images are a focal point of your WordPress content, going with lossless compression is a good idea to preserve quality. But if your images are less important, you might want to go with lossy compression to maximize file size savings.\r\n<h2>3 Helpful Image Optimization Plugins Compared<\/h2>\r\nWordPress image optimization plugins can help you automatically resize and compress the images that you upload to WordPress.\r\n\r\nWhile there are more than 3 image optimization plugins, here's a dirty little secret:\r\n\r\nMost of them use the same image compression algorithms.\r\n\r\n<strong>For that reason, most of them offer the exact same file size savings.<\/strong>\r\n\r\nWith that being said, there are some functionality and pricing differences that make it worthwhile to look at a few different options.\r\n\r\nTo get an idea of how effective each plugin is, I'll compress the same test image both <strong>losslessly <\/strong>(<em>minimum compression level offered)<\/em> and, if available, <strong>lossily <\/strong>(<em>maximum compression level offered)<\/em> to see how well each plugin works.\r\n\r\nFor reference, the test image has a starting file size of <strong>194 KB<\/strong>.\r\n<h3>1. Imagify<\/h3>\r\n<img class="aligncenter size-full wp-image-10016" src="https:\/\/pagely.com\/wp-content\/uploads\/2017\/08\/wordpress-image-optimization-1.png" alt="imagify wordpress image optimization plugin" width="800" height="529" \/>\r\n\r\n<a href="https:\/\/wordpress.org\/plugins\/imagify\/" target="_blank" rel="noopener">Imagify<\/a> is an image optimization plugin from the same team behind WP Rocket, a popular <a href="https:\/\/pagely.com\/blog\/2015\/01\/caching-work\/">WordPress caching<\/a> plugin.\r\n\r\nThe plugin offers up 3 levels of compression:\r\n<ul>\r\n \t<li><strong><strong>Normal <\/strong>- <\/strong>lossless compression<\/li>\r\n \t<li><strong>Aggressive <\/strong>- somewhat lossy compression<\/li>\r\n \t<li><strong>Ultra <\/strong>- very lossy compression<\/li>\r\n<\/ul>\r\nBeyond that, the selling points of Imagify are:\r\n<ul>\r\n \t<li>User friendly, pleasant interface<\/li>\r\n \t<li>Automatic image dimension resizing<\/li>\r\n \t<li>Ability to only optimize certain thumbnail sizes<\/li>\r\n \t<li>Option to restore original image versions with one click<\/li>\r\n<\/ul>\r\nImagify has a free plan that lets you optimize 25MB of images per month. After that, you'll need to pay, starting at $4.99 for 1GB.\r\n<h4>How Much Does Imagify Compress Images?<\/h4>\r\nWhen running under <strong>Normal <\/strong>(lossless) compression, Imagify compressed the original <strong>194KB <\/strong>image to <strong>176KB<\/strong> for a savings of <strong>8.9%<\/strong>.\r\n\r\n<img class="aligncenter size-full wp-image-10017" src="https:\/\/pagely.com\/wp-content\/uploads\/2017\/08\/wordpress-image-optimization-2.png" alt="imagify test results" width="800" height="211" \/>\r\n\r\nAfter switching to <strong>Ultra <\/strong>(maximum lossy compression), Imagify shrank the file to <strong>98.56KB<\/strong> for a savings of <strong>49.15%<\/strong>. As you might expect, those savings came with a noticeable drop in image quality.\r\n<h3>2. EWWW Image Optimizer<\/h3>\r\n<img class="aligncenter size-full wp-image-10018" src="https:\/\/pagely.com\/wp-content\/uploads\/2017\/08\/wordpress-image-optimization-3.png" alt="" width="800" height="522" \/>\r\n\r\n<a href="https:\/\/wordpress.org\/plugins\/ewww-image-optimizer\/" target="_blank" rel="noopener">EWWW Image Optimizer<\/a> is a popular free plugin that offers a key difference from most other image optimization plugins.\r\n\r\nWhereas most image compression plugins send the image out to the plugin's server for compression via an API, <a href="https:\/\/support.pagely.com\/hc\/en-us\/articles\/227525827-EWWW-Image-Optimizer-Plugin">EWWW Image Optimizer<\/a> lets you keep everything on your server. That means if your server can handle the workload, you can compress unlimited images using a limited set image compression algorithms <strong>without needing to spend a penny<\/strong>.\r\n\r\nOn the other hand, if you <em>do<\/em> prefer to offload the image compression work to someone else's server, EWWW Image Optimizer also offers an API plan that starts as low as $0.003 per image.\r\n\r\n<strong>Additionally, you'll need an API key if you want access to the full library of compression algorithms<\/strong>. For example, the free version only allows lossless compression for JPGs.\r\n\r\n<em>That said, for security reasons, we recommend using API or cloud-based plugins where all the image processing happens on remote servers, and doesn't require any local executables to be installed.<\/em>\r\n\r\nBeyond compression, EWWW Image Optimizer can also help you automatically resize your images' dimensions.\r\n<h4>How Much Does EWWW Image Optimizer Compress Images?<\/h4>\r\nBecause EWWW Image Optimizer only allows lossless compression, there's only one test result here.\r\n\r\nWhen compressing the test image <strong>losslessly<\/strong>, EWWW Image Optimizer reduced its size to <strong>176KB <\/strong>for a savings of <strong>8.9%<\/strong>.\r\n\r\n<img class="aligncenter size-full wp-image-10019" src="https:\/\/pagely.com\/wp-content\/uploads\/2017\/08\/wordpress-image-optimization-4.png" alt="" width="800" height="400" \/>\r\n\r\nYou did indeed read that right - <strong>it's identical to the lossless compression offered by Imagify.<\/strong>\r\n<h3>3. Smush<\/h3>\r\n<img class="aligncenter size-full wp-image-10020" src="https:\/\/pagely.com\/wp-content\/uploads\/2017\/08\/wordpress-image-optimization-5.png" alt="" width="800" height="419" \/>\r\n\r\n<a href="https:\/\/pagely.com\/blog\/wordpress-image-optimization-plugin\/" target="_blank" rel="noopener">Smush<\/a> is another popular image compression plugin from the folks at WPMU DEV.\r\n\r\nLike Imagify, Smush offers a well-designed interface, as well as helpful options that let you automatically resize your images' dimensions and compress specific thumbnail sizes.\r\n\r\n<strong>The main difference between Smush and Imagify is pricing.<\/strong>\r\n\r\n<strong>Smush is 100% free for images under 1MB, but only offers lossless compression.<\/strong> For larger images, more aggressive compression, and the ability to save your original images, you'll need the WPMU DEV Membership starting at $49 per month.\r\n\r\nThere's a good chance that works out to be more expensive than Imagify, though you do get access to all of WPMU DEV's other plugins which is a big benefit.\r\n<h4>How Much Does Smush Compress Images?<\/h4>\r\nLike EWWW Image Optimizer, the free Smush plugin only offers lossless compression.\r\n\r\nAfter compressing the test image, Smush was able to losslessly reduce its size to <strong>176KB<\/strong> for a savings of <strong>8.9%<\/strong>.\r\n\r\n<img class="aligncenter size-full wp-image-10021" src="https:\/\/pagely.com\/wp-content\/uploads\/2017\/08\/wordpress-image-optimization-6.png" alt="" width="800" height="405" \/>\r\n\r\nAgain, <strong>identical <\/strong>to the two other plugins.\r\n<h3>What Does Testing Show About Image Optimization Plugins?<\/h3>\r\nAs you can see from testing, there aren't major differences in the level of actual compression between popular plugins. For that reason, you're better off choosing plugins <strong>based on their interface, features, and pricing<\/strong>.\r\n<h2>How to Manually Optimize WordPress Images Before Uploading<\/h2>\r\nAs a freelance contributor to a variety of sites, I feel confident in saying that I've mastered the art of bulk optimizing images <em>before<\/em> I ever upload them to WordPress. While the previous plugins offer a more automatic approach, the manual method is helpful if:\r\n<ul>\r\n \t<li>You don't want to pay for a plugin<\/li>\r\n \t<li>You don't have admin access to the site you're uploading images to<\/li>\r\n<\/ul>\r\nTo manually optimize your images for free, you can start off by bulk resizing your images using a tool <a href="http:\/\/birme.net\/" target="_blank" rel="noopener">called BIRME<\/a>.\r\n\r\nIn addition to resizing images, the tool can also help you automatically crop images. If you're just looking to resize without cropping, though, <strong>make sure to choose the Auto-height option:<\/strong>\r\n\r\n<img class="aligncenter size-full wp-image-10022" src="https:\/\/pagely.com\/wp-content\/uploads\/2017\/08\/wordpress-image-optimization-7.png" alt="bulk resize images with BIRME" width="800" height="550" \/>\r\n\r\nOnce you've resized your images' dimensions, you can compress them either <strong>Losslessly <\/strong>or <strong>Lossily<\/strong> by using the free <a href="https:\/\/kraken.io\/web-interface" target="_blank" rel="noopener">Kraken web interface<\/a>:\r\n\r\n<img class="aligncenter size-full wp-image-10023" src="https:\/\/pagely.com\/wp-content\/uploads\/2017\/08\/wordpress-image-optimization-8.png" alt="bulk compress images with Kraken" width="800" height="456" \/>\r\n\r\nBoth tools only take a few seconds to use. And once you're finished, you can upload your already-optimized images straight to WordPress.\r\n<h2>Dynamically Scale and Serve Image Assets with PressThumb<\/h2>\r\n<img class="alignleft wp-image-12157 size-medium" src="https:\/\/pagely.com\/wp-content\/uploads\/2014\/07\/email@example.com" alt="" width="400" height="103" \/>\r\n\r\nPagely customers have access to <strong>flexible, on-demand image management.<\/strong>\r\n<p class="text-muted">Press<strong>Thumb<\/strong> is a simple drop-in service that can be enabled on your WordPress site to offload image optimization and thumbnail creation in real-time, saving on bandwidth, storage, and page size.<\/p>\r\n<p class="text-muted">Learn more about it <a href="https:\/\/pagely.com\/blog\/pressthumb\/">here<\/a>.<\/p>\r\n\r\n<h2>There's More to Speed Than Optimized Images<\/h2>\r\nOptimizing your WordPress images is a great way to speed up your WordPress site. But it's also only part of the battle. You also need a <a href="https:\/\/pagely.com\/">managed WordPress host<\/a> that gives you the proper technological <a href="https:\/\/pagely.com\/blog\/fast-wordpress-hosting\/">foundation to run a blazing fast WordPress site<\/a>.