Example from our previous post in the series: PNG works great for images with very few colors or large blocks of solid color. Starting with the format there are two main formats for graphics used on the web: PNG and JPG. So now that we have the right image dimensions, it’s time to save your image using the optimal format and the optimal compression. Just open your image, press “Ctrl + R” and input your desired width and height: It’s a free thing and does the job really well. On Mac, you just need to double-click on an image to open it in the default Preview app, and from there you can enable the toolset > “Adjust Size” > and then input the new width and height. Taking this conclusion even further, attempting to upload any image that’s bigger is just a waste of bandwidth. What this effectively means is that any image that’s bigger than that will be scaled down to fit. So basically, no matter what the dimensions of your image are, they will be scaled down to fit that main content block.įor instance, the blog you’re reading right now limits the content width to 680 pixels. The standard code of conduct when uploading an image to a WordPress blog is to simply take the image from somewhere (or use one of your own pictures), and just drag and drop it directly to the Media Library, without doing anything to the image itself.Ī better starting point is to open your image in a basic image editing tool, and adjust the dimensions of that image (the first step to optimize images in WordPress).Īll WordPress blogs have a certain width associated with the main content block (it’s where your posts are displayed). Here’s how: Start with the right dimensions To say the least, those results are really cool, and not that difficult to achieve. Now imagine what would happen if you could have similar savings on not just one, but all of the images that you use on your WordPress blog… Yep, that’s ~85% savings with just one image. It looks (basically) the same, but now it takes up only 76 kB. Now here’s the image again, the same image, it’s only been optimized: In its current state, it’s exactly 503 kB. I don’t usually like to get into the technical details of all those optimization-related things, but I just want to show you what’s possible, so you can better understand the whole concept. More optimized images = less disk space consumed = less bandwidth consumed = better loading times for your WordPress site = better experience for your visitors. The equation from there is pretty simple: Let me emphasize on this again because it’s key here with image optimization, you can keep your images looking just as great, but reduce the amount of space they take on your server’s disk. The trick with image optimization is that you can reduce that disk size of an image without impacting the visual quality of the image itself. Okay, so images, as you know, have certain disk size – the amount of kilo bytes that they occupy on the disk. What’s up with image optimization in WordPress In other words, optimizing your images is THE no.1 way of reducing your site’s loading times, and thus making the experience smoother for your visitors, as well as Google (it’s always good to stay on Google’s good side). the easiest way of saving even up to 50% of your site’s whole bandwidth consumption. The guide you’re reading right now is all about image optimization in WordPress – aka. How to Optimize Images in WordPress the Quick and Easy Way.Top 3 CDN Services for Your WordPress Blog + How to Set One Up.Introduction to CDN and Image Optimization + Why You Should Care.Just as previously, this is all about the quick wins for your WordPress blog … no coding involved, no hassle. This is part 3 of our 3-part series on speeding up your WordPress site trough the means of Content Delivery Networks (CDN) and image optimization.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |