Make WordPress Core

Opened 7 years ago

Last modified 4 years ago

#41884 new defect (bug)

Twenty Seventeen: responsive (gallery) images are too large

Reported by: nosilver4u's profile nosilver4u Owned by:
Milestone: Future Release Priority: normal
Severity: normal Version: 4.8.1
Component: Bundled Theme Keywords: has-patch needs-testing
Focuses: Cc:

Description

It seems the sizes attribute used for gallery images on the Twenty Seventeen theme is a bit off. When viewed on the front page or an archive page, instead of the selected thumbnail images (150px), the browser is choosing the medium size at 600w, which I believe is based on the "default" of 580px.
Even worse, when viewing a single post with a gallery, the "size" attribute is 100vw, which means a 1080p screen forces the browser to load the largest image available (1024w in my case).

I switched over to the Twenty Sixteen theme and it does not seem to have this same problem.

I also tested this on another site, and initially it was only showing thumbs (as expected). I compared the media settings, and realized the two sites were different.

So there is one other thing that must be true to cause this behavior. Under the Media settings, if you have the thumbnail cropping turned off, this is the trigger.

So essentially, when the thumbs are 150x113 instead of 150x150, the Twenty Seventeen theme adds all (or most of) the available sizes to the srcset list because it fails to find an exact match to display in the gallery.

You can see it in action here: https://test.shanebishop.net/2017/06/23/hello-world/

Attachments (1)

41884.diff (1.0 KB) - added by AkSDvP 5 years ago.
Ticket: 41884 - Restrict resizing of thumbnail images in admin section.

Download all attachments as: .zip

Change History (4)

#1 @azaozz
5 years ago

  • Keywords needs-patch added
  • Milestone changed from Awaiting Review to 5.3

Just noticed the same thing happening on the Media screen in wp-admin, list view. The browser downloads the "large" size for all thumbnails despite that they are 60x60px. Caused by the sizes attribute being overwritten here: https://core.trac.wordpress.org/browser/tags/5.2.1/src/wp-content/themes/twentyseventeen/functions.php#L562 to always be 100vw, i.e. all images should be as wide as the window...

This can easily be fixed by adding ! is_admin() at the beginning in twentyseventeen_post_thumbnail_sizes_attr() but thinking it is pretty unusual to set all responsive images *everywhere* to be 100vw except when some templates are used. If this is intended only for post thumbnails, it should be restricted only to them :)

@AkSDvP
5 years ago

Ticket: 41884 - Restrict resizing of thumbnail images in admin section.

#2 @AkSDvP
5 years ago

  • Keywords has-patch needs-testing added; needs-patch removed

#3 @davidbaumwald
4 years ago

  • Milestone changed from 5.3 to Future Release

This ticket hasn't seen any movement this cycle. With 5.3 RC1 approaching, this is being moved to Future Release. If a committer feels strongly about this one being in 5.3 and has the time to see it through, it can be moved back up.

Note: See TracTickets for help on using tickets.