WordPress Image Sizes: All You Need to Know
Images you use on your website often make your content more attractive and often have the power to give an entirely different perspective to the topic they are referring to. But, they are a lot more than a way to keep your user’s attention – they play a very important role in your website’s SEO, SERP rankings and finally can affect your conversion rates.
In order to enjoy all the benefits images can provide you generally need to ensure their size is adequate. In this article, you’ll learn all you need to know about WordPress image sizes and how it affects your website.
When you upload an image to your WP media library, WordPress automatically generates three additional versions of that image and stores them separately. You will see four image options – the thumbnail, medium, large and full-size options. The first three options are the default WordPress image sizes and the full-size option is actually the image you uploaded in its original size.
The reason why WordPress creates these options is that the optimal size of an image depends on its location on your website. For example, the image resolution in the slider may be different than the image resolution used in the thumbnail. Since different sizes are automatically created, you don’t have to adjust the image size manually if you want to use the same image in different places across your site.
The 4 different image sizes in pixels:
- 150 x 150 pixels- Thumbnail size
- maximum 300 x 300 pixels – Medium size
- maximum 1024 x 1024 pixels – Large size
- Full size – the original size of the image
As usually in WordPress, the solution is simple. Here is what you need to do to upload custom images sizes.
First, go to your WP Admin Panel. Second, click on Settings > Media. Then simply adjust the default image settings in the Media Settings and click Save when you finish.
If for any reason you find it useful to know exactly when you uploaded each image, you can check the Organize my uploads into month and year-based folders box that shows up after all the other options, and all the images you upload will be organized chronologically.
Surely there’s no universal image size that can cover every need, but there are rules that ensure your images will look good on different screen sizes. So, these are the ideal sizes depending on the location of the image on your website:
- 1200 x 630 pixels – blog post image size
- 1048 x 250 pixels – banner size
- 1200 x 900 pixels – landscape
- 900 x 1200 pixels – portrait
- 1920 x 1080 pixels – WordPress background image size
- 200 x 100 pixels – logo image size
- 150 x 150 pixels – thumbnail image size
As you already know well, your site’s speed and performance are at the core of quality user experience. Anything that jeopardizes speed and performance sooner or later takes a toll on many different aspects of your site’s success. Every image with a large file size affects the speed of your site, and not in a positive manner. That means you need to be absolutely practical – it makes no sense to have your images any bigger than they have to be. Except for large photos – WordPress image sizes shouldn’t be bigger than 150kb. But there’s also no need to make them any smaller than they need to be, bear in mind too much customization can affect the quality of the photo.
An easy way to improve your website performance quickly that doesn’t require any special skill or knowledge from your side is compressing images. Image compression boosts your site’s performance without affecting the quality of your images in any way.
There are a variety of online compression tools that make compressing images incredibly simple. It is highly recommendable you compress every image you upload to your website.
WordPress automatically detects the size of the image you upload and categorizes it as small, medium, or large. And as we described earlier, WordPress also automatically resizes the image, providing you with three default image sizes for different locations on your site. When it comes to responsiveness, the process is also automatized. WordPress also provides responsive image compatibility that lets web browsers choose the optimal size image depending on the user’s device by default.
There are five different types of image files you can upload to WordPress:
- .jpg
- .jpeg
- .png
- .gif
- .ico
Uploading any of these image types allows inserting the files directly to WP text areas using the Add Media button. Some other popular formats like .svg, .bmp or .tiff files. are not supported officially.
In case you try to upload an unsupported file type, you’ll get a notification saying “Sorry, this file type is not permitted for security reasons.”
Generally, JPEG is the best choice for photos and PNG is the first choice for graphics. We’ll briefly describe the main characteristics of the three most commonly used file types:
JPEG – stands for Joint photographic experts group offers support for 16 million colors. It is also the smallest file size for photos and therefore ensures the image loads fast and appears more vivid.
PNG – stands for Portable Network Graphic and is the default choice for graphics, logos and similar website elements. It doesn’t offer as many colors support, but allows for image transparency.
GIF – stands for Graphics Interchange Format and its distinctive feature is that it allows animations. It also supports 256 colors and transparency.
SVG – the mostly used for icons, favicons and logos. It’s very lightweight and flexible and therefore ideal for smaller website elements.
Choosing the right format for your images is an important aspect of image SEO that you can surely cover all by yourself. PNG is recommendable for images that demand high quality and larger file sizes, JPG is ideal for smaller images as it uses both lossy and lossless optimization and can be compressed to smaller sizes whereas GIF is based on lossless compression and is the best option for animated images.
Another thing you can do is use precise and descriptive title tags for your images as they help search engines understand what your image is about.
One of the most practical ways to ensure image optimization is to use some of the best WordPress image optimization plugins that allow you to adjust all the aspects related to image quality and ensure optimal website performance.
You may have noticed that replacing featured images in WordPress or any other is not a simple and straightforward procedure. WordPress requires that you make a change on every page that contains the image, and that may eat up a significant amount of your time. Since you usually need this kind of task done quickly, we recommend using a plugin for replacing images in WordPress as the fastest and easiest way to get this kind of task done without jeopardizing your website performance.
Images are one of the most common causes of the slow website loading speed. The best solution is to resize the images whenever that is necessary or decrease their file size by compressing them. There are plenty of tools like EWWW Image optimiser that help you compress images easily, or you can resize images in Photoshop.
You’ll often have the need to polish your images before uploading. There are many things that you can do in WordPress to edit images all by yourself.
The best way to ensure image quality if you’re not a professional photographer yourself is to take advantage of free and premium photo stock websites.
Final Word
There really aren’t too many excuses for not having quality images on your website. Now that you know all the technical essentials about WordPress image sizes, it will be much easier to ensure optimal website performance and speed. If you have any questions regarding this topic, feel free to reach out to us in the comment section.
We hope this article was helpful. If you liked it, feel free to check out some of these articles as well!