Images in WordPress: Resolution, DPI, and Speed Explained
Images in WordPress play a significant role in how professional and trustworthy your website appears. They’re also one of the most common causes of a slow WordPress website, especially on mobile. Incorrect resolutions, excessively high DPI, or uncompressed files cause pages to load slower and lower their Google rankings.
In the questions below, we explain step-by-step how to best prepare, edit, and save images for WordPress. This way, you’ll know exactly which settings to use, why they’re important, and how to ensure sharp images and a fast website.
Everything you need to know about images in WordPress
What is image resolution?
Image resolution refers to the size of an image in pixels.
Pixels are the tiny dots that make up an image.
For example:
1200 × 900 pixels means 1200 pixels wide and 900 pixels high.
The more pixels, the sharper the image can be.
However, too many pixels make an image unnecessarily heavy.
Why is this important?
If you upload an image that is much larger than necessary, the browser must:
- Download more data
- Use more computing power
- Longer loading times on mobile
This results in a poor user experience and lower scores in Google.
What resolution to use in WordPress?
WordPress automatically scales images, but the source image must be correct.
Recommended resolutions
Featured image: 1200 × 900 pixels
Why: Large enough for blogs and social sharing, but not too heavy.
Images in text: 800 to 1200 pixels wide
Why: These are usually not displayed full screen.
Headers or banners: 1920 × 1080 pixels
Why: These often span the entire width of the screen.
What is DPI (and why it matters online)?
DPI stands for Dots Per Inch and indicates how many dots there are in one inch. Many people think: “DPI doesn’t matter online.” That’s partly incorrect.
What is correct?
- Screens show pixels, not DPI
- A screen doesn’t see the difference between 72 and 300 DPI
What is important?
- 300 DPI makes files much heavier
- Larger files load slower
- This is especially on mobile a big problem
300 DPI is intended for print, not websites.
Best DPI setting for websites
72 DPI → ideal for WordPress and websites
96 DPI → also fine (for modern screens)
300 DPI → for print only, never for online
Why 72 DPI is better:
- Faster loading time
- Less data usage for mobile visitors
- Better Core Web Vitals
- Positive influence on SEO
File type: JPG or PNG?
JPG (recommended)
- Smaller files
- Perfect for photos
- Faster loading
PNG (only when needed)
- Larger files
- Suitable for transparency or logos
Only use PNG if you really need transparency.
File Size: How Small is Good?
Even with the correct resolution and DPI, an image can still be too heavy.
Guidelines:
- Maximum 200–300 KB per image
- For banners preferably under 400 KB
Why?
- Google likes fast pages
- Visitors drop off at slow sites
- Mobile internet is often slower
Pre-edit and compress images
Always edit your images beforehand in a program like Photoshop, GIMP, or even Paint. There you can resize and compress the image before uploading it to WordPress.
Why this is important:
- You have full control over quality and file size
- Images become lighter and load faster
- Your website loads fast on mobile
- Less dependent on plugins
Save images as JPG, set the quality to around 70–80% and use 72 DPI.
Why not just rely on compression plugins?
Compression plugins can help, but:
- They only edit after uploading
- They give less control over quality
- They can place additional tax on your website
Pre-processing + smart saving is always the best basis.
Why this is important for SEO
Google looks at:
- Loading speed
- Mobile performance
- User experience
Too heavy images:
- Lower your position in Google
- Cause higher bounce rates
Well-optimized images:
- Load faster
- Improve your SEO
- Ensures satisfied visitors
Additional WordPress Tips
- Give images a clear filename
(e.g., woocommerce-webshop-image.jpg) - Always fill in the alt text of the images
- Pre-edit and compress images
- Never upload images directly from a camera
In short
- First edit images in Photoshop, GIMP or Paint
- Set correct dimensions
- Save with compression (JPG, 72 DPI)
- Then upload to WordPress
This way your WordPress website remains fast, professional and easy to find.
Frequently Asked Questions about Images in WordPress
What is the best resolution for images in WordPress?
The best resolution for WordPress is usually between 800 and 1200 pixels wide. For banners or headers, 1920 × 1080 pixels is suitable.
What DPI should I use for images on a website?
For websites, use 72 DPI. Higher DPI values, such as 300 DPI, make images unnecessarily large and result in slower loading times.
Why is 300 DPI bad for websites?
300 DPI is intended for print. Online, it results in larger file sizes, poorer mobile performance, and a negative impact on SEO.
Does DPI affect the sharpness of images online?
No, online, the number of pixels determines sharpness. DPI primarily affects file size, not how sharp an image appears on a screen.
What is the difference between resolution and DPI?
Resolution determines the size of an image in pixels. DPI determines how many dots are used per inch and primarily affects the file size.
Do I need to edit images before uploading them to WordPress?
Yes, it’s highly recommended to pre-edit images in programs like Photoshop, GIMP, or Paint. This gives you control over the size and quality.
Why is pre-compression better than just using a plugin?
Pre-compression results in smaller files and better quality. Plugins only work after uploading and offer less control over the final result.
What file size is ideal for WordPress images?
An image should ideally be under 200 to 300 KB. This way, your website will load faster and perform better on mobile devices.
Which file format is best for WordPress: JPG or PNG?
JPG is best for photos because of its smaller file size. PNG is only used when transparency is needed, such as with logos.
Do images affect SEO and loading speed?
Yes, large images slow down your website and harm your SEO. Optimized images improve loading speed, user experience, and Google rankings.