Optimizing your website’s images is a must for improving its loading speed. This process involves resizing images to the correct dimensions, compressing them, and using modern formats like WebP.
If you’re a WordPress user, there are several plugins and manual options to fix this issue and get an optimal result. In this post, we’ll discuss how to properly size images in WordPress using both plugin and manual approaches.
Because using explicit height and width of an image and fixing the proper size only enhances performance but also prevents unintended layout shifts on your website. As a result, it ensures a better browsing experience for users across different devices.
Here I’ll show you 2 best and effective methods for how you can properly size images in WordPress. So, let’s take a look.
Method 1: Properly size the image: By Plugin in WordPress
There are three plugins you can use to size images, such as: properly
Let’s scan through them one by one.
1. Smush
It is one of the major used plugins for sizing images in WordPress properly. The plugin is available in both free and pro versions.
It has rich features that contribute to faster page loading for WordPress sites. The plugin reduces the initial page loading time by preventing loading the images that are off the screen.
Also, it saves bandwidth for users who don’t fully scroll a page with images. Upon installation, it automatically detects the images and gives a lossless optimization. It does bulk tasks as well.
Here are the installation notes:
2. Optimole
The Optimole WordPress plugin does advanced image optimization tasks. It transforms image URLs into cloud-based links.
It makes images load quickly and optimally on all devices based on their specifications. Optimole provides WebP images for faster loading without compromising quality.
It automatically adjusts image size, quality, and format based on visitors’ browsers and devices, while keeping your local image library untouched.
With Optimole, Images load faster with a smooth transition. The installation procedures are the same for all the plugins in WordPress.
3. ShortPixel
Lastly, another popular plugin to properly optimize images in WordPress. The working style of this plugin is cloud-based. Since it has an installation process it doesn’t concede CPU and RAM.
To optimize your images using the ShortPixel WordPress plugin, you can follow a straightforward process. First, upload your images to your WordPress Media Library as you normally would.
The ShortPixel plugin automatically sends these images to ShortPixel’s cloud servers. It works the same during individual uploads or through bulk optimization.
These cloud servers process the images according to the optimization settings configured. You can change it in the plugin’s settings panel.
Once the optimization is complete, the plugin replaces the original images in your WordPress Media Library with the newly optimized versions.
Altogether, the streamlined approach helps enhance your site’s performance without requiring extensive manual intervention.
Method 2: Properly size image: Without a Plugin in WordPress
Media Library
WordPress has a feature called media library which offers an option for image editing. To use it for sizing images properly, here are the steps to follow:
Media Settings
From the WordPress dashboard sidebar go to Settings> Media. You’ll see a prompt box called Media Settings.
There Are different properties of the image in individual sections based on the size. Such as Thumbnail size, medium size, and large size.
From there select the max image size there for your images. After that, it will automatically resize images for you when you upload them.
Image Editing Tools
If any of those options don’t become a right fit there’s another alternative. You can use any image editing tools available both in free and premium versions.
The most popular one among the tools in the market is Adobe Photoshop. It requires some expertise to operate the tool for image editing but the result could be top-notch and well optimized.
Why Should I Properly Size Images on My WordPress Website?
Properly sizing images on WordPress comes with a lot of benefits that together help to provide a better user experience. Let’s see what other reasons are there:
Ever been frustrated by a website that takes forever to load? Well, one big reason for that is oversized images.
When images are too big in file size, they can put the brakes on your website’s loading speed.
By resizing and optimizing those images, you can shrink their file size without sacrificing how they look. The result? Your web pages load faster, and your site performs better.
If your images aren’t sized properly, they might not fit well on all these different screens. It makes your site look sluggish.
Think about those users with mobile data plans or slower internet connections. Big, unoptimized images can eat up a lot of their precious bandwidth and leave them staring at loading screens forever.
What’s the best image size for a WordPress website?
The ideal size of image for wordpress sites would be 1920 x 1080 but there are some other considerations to know.
First, the size you need can vary because different WordPress themes have different layouts. So, the best size for one theme might not be the same for another.
Second, it also depends on where you’re sharing your images, like on social media. Since, social media sites have their preferences for image sizes, and sometimes they don’t resize your images correctly but rather compress them.
When you choose an image size, try to focus on the middle of the image and leave some space around it. That way, even if it gets cropped, the important part will still be visible.
How to Determine the Right Image Sizes for Your Website?
Sometimes, the recommended image sizes may not fit your website’s specific design. If you’re unsure about the correct image dimensions, here are two simple ways to help you figure it out.
These methods will help you determine the right image sizes for your website. Also, it’ll ensure your images look sharp and fit perfectly in your design.
Method 1: Using the Image Size Info Extension (for Chrome):
Method 2: Using the Inspector Tool (for Chrome):
Simply SEO Optimize Your Properly Sized Images for WordPress
Once you are done editing your image and ready to publish your image there’s one more thing to do.
Along with your better user experience your image must perform better on search results for better visibility. To do so, just follow this way:
The key thing is Alt Text. Alt Text is like a short description you can add to the image to explain what it shows.
For instance, let’s say you have an article about painters with a featured image of two people painting on a canvas.
In this case, you’d want the Alt Text to say something like, “Two painters painting on a canvas.” This Alt Text accurately describes the image and includes the important keyword, “painting on a canvas.”
Clear descriptions like this not only help search engines but also assist visitors. Sometimes, when the internet is slow, especially on mobile devices.
At this point, images may not load, but the Alt Text will still show up. This can be helpful because visitors can at least understand what the image was supposed to be about.
FAQ How to Properly Size Images in WordPress
What Image size should you upload to your site?
According to the most WordPress Image size guides:
•Blog post image size (1200 x 630 pixels)
•Header image size (banner size 1048 x 250 pixels)
•Featured image size (landscape 1200 x 900 pixels)
•Featured image size (portrait 900 x 1200 pixels)
•WordPress background image size (1920 x 1080 pixels)
•Logo image size (200 x 100 pixels)
•Thumbnail image size (150 x 150 pixels)
Can I automate image resizing in WordPress?
Yes, you can automate the process of image resizing in WordPress by using plugins like “Smush” or “Optimole” These plugins offer features that automatically resize and optimize images as you upload them to your media library.
How can I ensure responsive images in WordPress?
To ensure that your images are responsive in WordPress, you should utilize the “srcset” attribute when inserting images into your content. This attribute allows WordPress to serve different image sizes based on the user’s device and screen size.
Final Thought
So, resizing images in WordPress is easy and can make your site look better and work smoother. Just pick the method that fits your needs and goals. Whether it’s the built-in editor or a plugin. Your choice will make a big difference in how your site looks and works for the users.
About Author
Hi, I’m Abdullah – a WordPress performance, core web vitals expert dedicated to making sites fast. After 3 years of optimizing 150+ sites, I’ve cut page load times 50%+ and scored 90+ on PageSpeed.My passion is optimizing your WordPress site for lightning speed and an excellent user experience. With proven expertise in making sites blazing fast, I share tips to boost your site’s performance. Ask me anything! I’m here to help the WordPress community succeed online.