Came across a neat WP-based article today about [restoration of a salt-pond](https://reasonstobecheerful.world/south-bay-salt-pond-restoration-project-progress/), and as I have been doing lately because I am in the process of moving my blogs from my widget-site to a WP-site and am interested in learning about WP, I clicked F12 and poked around to see what I could learn. Reason principally due to my present ongoing curiosity about image sizes. More specifically, whether there’s a **right** size for images.
So I’ve been trying to keep blog images constrained to 1024×768 and <100KB but I am finding plenty of sites where this isn’t what’s going on. Moreover, these sites seem to load plenty fast (and yes, lazy-loading is common). I am suspecting they’re using CDN. If so, kindly allow me a brief birdwalk, but how do you pay for this?
So here’s my real question; within this article there’s [a lovely image](https://reasonstobecheerful.world/wp-content/uploads/2024/04/4zDSC_8384-Construction-Credit-Ivan-Parr.jpg-scaled.jpg) and when I inspect, I see within the name of the image something I’ve never noticed, an express mention of *scaling*. This is the file name itself at the end of the above link . . .
*4zDSC_8384-Construction-Credit-Ivan-Parr.jpg-scaled.jpg*
. . . and while I have no clue what the **4z** is about, the **DSC_8384** is likely the camera’s file name, and then the author named it, included a photo-credit, and then it got interesting. What caught my eye is the **.jpg** was appended with **-scaled.jpg**
So here’s the thing, and I am totally baffled by this mention of scaling and welcome tutelage, or simply pointing me to where I can learn more, please. And as I may have mentioned, the site loaded quickly both on my laptop (middling DSL) and phone, both. Yet the image is 1800×200 and 454KB, so fairly heavy.
Folks, I am desperate to learn more about images. Not about the benefits of webp vs jpg, but about dimensions and weights when used for a WP blog article.
Like, if I’m using a template I purchased on Themeforest, or something made using a page-builder like Elementor or Bricks, or if I delve into using the twenty-twenty-four theme . . . where do I find the image size the designer has in mind for the image? How do I make the scaled images? Or to this last, are these created on the fly by the blog software?
Please guide me to the proper resources to learn more. And thank you in advance for your time and patience!
[ad_2]
WordPress scales your images for you on upload, based on settings under Settings > Media. These can also be expanded or overridden by your Theme’s functions or with a plugin.
The appending of ‘scaled’ to the filename was probably done by whoever edited the image. WP when it scales your media for you will do similar, but the naming conventions are different.
> where do I find the image size the designer has in mind for the image?
Purchased themes should come with a few placeholder images which you can use as a guide.
Images should be resized and compressed before uploading. Images should be sized to how big they need to be on the website, in desktop mode.
Eg if an image is shown on your webpage at 600×600, then that’s how big it should be resized to prior to uploading.
-scaled means that the image was bigger than 2560px and WordPress scaled it down automatically. There’s rarely any reason to upload anything bigger than 2000px.