I was working on a little side documentary project when I hit the wall with the images, they are slow to load and blurry on some big screen devices, then I found about
sizes but there was another issue
how to know the proper dimensions for different image versions?
Enter scaled images. A scaled image is an image that has been sized to fit the exact dimensions you’re using it for. Unlike cropping, which may ultimately alter the proportions of an image, scaling preserves the dimensions.
If you’re reading this post on a full-size screen, then the body of this post has a width of 600px. Since we’re all about optimization here at WPMU DEV, when I create images for blog posts I make them exactly 600px wide. That is the exact size I need so the browser doesn’t have to do any additional work and so you don’t have to use more data.
why they use px on that article when I had heard before that px unit is dead and no one should use it? in fact I use % or VW with text block so should I go inspector and get the dimensions of text block on px then use it to optimize my images?