When "big_images" are automatically scaled, communicate with a UI message

[webtrainingwheels]

The new big_image handling is done behind the scenes automagically which has a couple of downsides:

1. If a user actually wants a huge image for some reason, they’re going to be confused about what’s happening.

2. By fixing the issue for them with no communication, we’re missing out on the opportunity to better inform people about why they shouldn’t be uploading massive images to begin with.

Proposal: Add a UI message to communicate “hey, we fixed this huge image for you. Here’s why [insert link to helpful article]”

I would be happy to help contribute to such a document.

The addition of the Alt text message in the UI is a great model for how such communication can help educate and inform site owners.

[kirasong]

Thanks for the report! This is an interesting question/issue.

For (1) I agree! This could be confusing to users who intend the "full" size to be exactly a high resolution original. The original does still get left for use, but it's not clear to the user where to find it. @azaozz @joemcgill Do you have any thoughts on this?

For (2), I don't think it's bad that folks upload large images, because it gives them a quality master to start with for quality resizes -- one that can remain for the future for WordPress to use again if they change themes or need even larger sizes as devices (and the internet) evolve. Ideally, I think users should never have to worry about what they upload to WordPress -- it should "just work" (See: ​Design for the Majority).

Besides it being possible that an upload will fail, what are the reasons you think folks shouldn't be uploading large images?

[webtrainingwheels]

Thanks for your response!

what are the reasons you think folks shouldn't be uploading large images?

Isn't this whole feature predicated on the fact that's it's bad to upload large images? ;)

But here are some additional reasons. I'm sure the list isn't exhaustive!

1. The big image threshold is still really large - 2560px. In many cases users are uploading massive images which will ultimately only be used in a small space.

So in some cases that 2560px image is going to be loaded at its full size onto the page and the browser will be forced to scale it to its necessary size which could be significantly smaller. This is really inefficient for performance.

2. Even if you are also using an image optimization plugin, optimizing a 5000px, 3MB image is still going to leave you with a big image, probably bigger than needed, compared to if you just uploaded the 500px image you ultimately need.

3. It's a waste of digital space which users could be paying for. Some hosts have storage restrictions and overly large images fill it up for no good reason

4. Environmentally-speaking, the carbon footprint of uploading and processing huge images is more than for small ones.

5. Users could be purchasing stock images at full size, which they're paying unnecessarily for.

Indeed some of these are not "WordPressy" reasons but they would improve users' lives if we could educate them a little about it.

Just for context, the above scenarios are based on actual use cases that I see multiple times per day in the support queue of my day job (support for a caching plugin). These are real issues that many users currently have no clue about and I believe WordPress can make a huge impact with a tiny UI communication on this :)

[kirasong]

Replying to webtrainingwheels:

Thanks for your response!

Sure; thank you!

Isn't this whole feature predicated on the fact that's it's bad to upload large images? ;)

I think it's predicated on that WordPress wasn't doing a good job handling large images that users upload, and WordPress should handle them better!

But here are some additional reasons. I'm sure the list isn't exhaustive!

1. The big image threshold is still really large - 2560px. In many cases users are uploading massive images which will ultimately only be used in a small space.

So in some cases that 2560px image is going to be loaded at its full size onto the page and the browser will be forced to scale it to its necessary size which could be significantly smaller. This is really inefficient for performance.

Indeed, part of the point of this feature is to make it so the yet larger originals aren't served.

Apologies if you're already aware -- just want to make sure it's clear -- WordPress automatically generates smaller sizes, and includes all of them in srcset automatically. The browser then chooses the best size from those for the user's device and situation.

In this release, a couple of extra "intermediate sizes" are also added to WordPress, giving browsers more choice to reduce the chances of a large image getting loaded when it shouldn't be. If you've been seeing cases where the browser isn't choosing appropriate ones, I'd love to hear more details so we can either fix things on the WordPress side, or chat with browser teams about it!

2. Even if you are also using an image optimization plugin, optimizing a 5000px, 3MB image is still going to leave you with a big image, probably bigger than needed, compared to if you just uploaded the 500px image you ultimately need.

I'd love to know a little more about this! I'm wondering where the ideal place for this sort of user hinting would be, since the recommended size will be different depending on the specifics of where an image is going.

In this specific case, 500 is between the default medium and large sizes, so it's indeed possible the large 1024 one would be loaded instead. Do you think we need another size between those two, or that is likely to be taken care of by a user's theme?

3. It's a waste of digital space which users could be paying for. Some hosts have storage restrictions and overly large images fill it up for no good reason

This is an interesting one. In the past, storage was a big problem, but what I'm hearing from most folks nowadays is that storage and filecounts aren't being used as much, and aren't common host concerns either. What hosts is this usually an issue with?

4. Environmentally-speaking, the carbon footprint of uploading and processing huge images is more than for small ones.

As far as WordPress in concerned, the processing time should be focused only in the initial upload, then the image(s) cached for later use. I imagine more CPU cycles are used for decoding larger images by end-user devices, but I don't have any data about how much more power is used per MP. If you have any information about that, I'd love to know!

I think this is a great argument for finding the right balance of image sizes, and making sure that the proper images get generated and sent to users. It's a tough problem :(

5. Users could be purchasing stock images at full size, which they're paying unnecessarily for.

I agree, there's a certain threshold for which folks don't need to purchase images of higher quality. Where that is is hard to define because it'll be different depending on where the image is used, and devices keep raising their resolution/DPI.

Is this a common issue? Do you have any ideas on how to find/recommend the best resolution for users to purchase?

Indeed some of these are not "WordPressy" reasons but they would improve users' lives if we could educate them a little about it.

I definitely think education is great! I also think that any amount WordPress can be changed so that users don't need to learn about the details (and have it "just work" for them) is even better! Balance here is sometimes hard to find -- thank you for the details!

Just for context, the above scenarios are based on actual use cases that I see multiple times per day in the support queue of my day job (support for a caching plugin). These are real issues that many users currently have no clue about and I believe WordPress can make a huge impact with a tiny UI communication on this :)

That's great, and I really appreciate the information and conversation -- thanks!

To loop back to your initial recommendation of a link to an informational page in the error -- I'll bring this ticket up in the media channel (#core-media) in Slack for visibility and to get some more opinions on it!

[vanyukov]

It looks like the majority of concerns about this feature are that either:
a) users are not able to understand where the full sized image is and how to use it on the front-end
b) users not able to understand why the space is eaten up by original images and how to disable those

In my opinion, the first issue (a) is easily resolvable with some UI adjustments:

1. a dismissible notice in the media library regarding the new feature for all new installs/upgrades
2. a general notice (either in media library or the Settings - Media page), maybe with some link to wp.org?

The second issue (b) is more complex. At the moment, it's not really clear how this feature will be used later on. If this is just a way to optimise uploaded images - users should have an easy option to opt-out from keeping the originals. But because this is hidden away in a filter, it seems that there are bigger plans for the use of this feature by WordPress core at some point later on. Will removing the original have some side effects for the users in the future? I'm guessing this is an interesting topic for all the developers of image optimization plugins out there

[audrasjb]

Hi,
About the last comment, I don’t think there is anything planned in 5.3 about displaying messages in the media library (we are on hard string freeze now, and we can't add any string in WP 5.3, unless it's totally critical).

Then, adding that kind of message in next release doesn’t make a lot of sense in my opinion.

[webtrainingwheels]

@audrasjb I'm not sure I understand why adding a message in the future doesn't make sense? The communication is relevant as long as the feature exists. It's an evergreen communication, it's not tied to this single moment. What am I missing?

Sounds like this may be a dead end now due to the above comment, but just to circle back on one point:
@mikeschroder re: 2, About the scaling of images. I think the srcset handling works well. But we see many cases every day where some images on customer sites are being scaled by the browser and not handled with srcset. If you would like further info I could certainly analyze those cases further to see why. I'm guessing it could be themes/plugins "doing it wrong". These instances create a significant performance issue.

Thanks for the time and attention you've given this conversation!!