Opened 16 months ago
Last modified 14 months ago
#58884 accepted enhancement
The image size for the Site Logo block is hard coded to "full"
Reported by: | asafm7 | Owned by: | audrasjb |
---|---|---|---|
Milestone: | Awaiting Review | Priority: | normal |
Severity: | normal | Version: | |
Component: | General | Keywords: | has-patch 2nd-opinion close |
Focuses: | Cc: |
Description
The recommended size for the site icon is 512x512.
The Site Logo block is coded to use the "full" size, in general-templates.php:
$image = wp_get_attachment_image( $custom_logo_id, 'full', false, $custom_logo_attr );
If the icon is at the recommended size of 512x512, the full size is much too big for the common use of the Site Logo block (in the header). That leads to a "Properly size images" warning in page-speed tools.
Attachments (1)
Change History (16)
#3
@
15 months ago
why not
$image = wp_get_attachment_image( $custom_logo_id, array( 512, 512 ), false, $custom_logo_attr );
?
#4
@
15 months ago
- Keywords has-patch commit added
The proposed solution looks good to me.
Self assigning for commit
consideration.
#5
@
15 months ago
Thank you, @asafm7 for the suggestion and @pitamdey for the patch.
Test Report. ✅
Patch tested: https://core.trac.wordpress.org/attachment/ticket/58884/58884.patch
Env
- WordPress - 6.4-alpha-20230824.164623
- Web Server: Nginx
- Chrome Version - 115
- OS - macOS
- Theme: Twenty Sixteen Version: 3.0
- PHP - 7.4.0
- Active Plugin - None
Test result
Site Logo block to be functioning as expected. I couldn't find any functional issues during testing.
Status
Ready for the Next Step. ✅
#6
follow-up:
↓ 9
@
15 months ago
- Keywords commit removed
- Owner set to audrasjb
- Status changed from new to accepted
The implementation looks good to me, but could you please add some sources about why the ideal size would be 512x512px?
This ticket was mentioned in Slack in #core by zunaid321. View the logs.
15 months ago
#8
@
15 months ago
Maybe I'm missing something, but isn't the patch still hard coding 512*512, and that is usually too big for a logo?
#9
in reply to:
↑ 6
@
14 months ago
Replying to audrasjb:
The implementation looks good to me, but could you please add some sources about why the ideal size would be 512x512px?
- Compatibility: A 512x512 pixel size for the site icon is often recommended because it provides a good balance between high resolution and compatibility with various devices and screen resolutions. It ensures that the icon looks crisp and clear on both desktop and mobile devices without being excessively large.
- Retina Displays: Many modern devices, especially Apple devices, have high-resolution Retina displays. A 512x512 pixel site icon ensures that the icon still appears sharp and detailed on these high-resolution screens without being pixelated or blurry.
- Favicon Use: Site icons are often used as favicons, which are small icons displayed in the browser tab when a user visits a website. A 512x512 pixel icon can be easily scaled down to smaller sizes for use as favicons while maintaining image quality.
- Versatility: A 512x512 pixel icon provides versatility. It can be downsized as needed for different use cases within the website, such as in the header, footer, or as a favicon, without losing image quality.
- SEO and Accessibility: Having a high-quality site icon can also contribute to a better user experience and potentially improve search engine optimization (SEO) by making your website appear more professional and visually appealing.
#10
@
14 months ago
@dhrumilk the reason for opening the issue was that 512x512 is too big for a header logo.
On 4 you wrote "It can be downsized as needed for different use cases within the website, such as in the header", but as the patch keeps the size hard-coded, downsizing isn't possible. This is what the ticket was aimed to change. The patch doesn't address it.
The patch only replaces "full" with "512x512". When I opened the ticket, I assumed "full" to be "512x512" anyway, as it is the recommended size by WordPress for the icon image.
Am I missing something?
#11
@
14 months ago
- Keywords 2nd-opinion added
I wonder if there is an issue at all, because this image has srcset and browser picks optimal size by its own. And 512x512 size needs to be registered, otherwise it will have no effect, and if it is registered, then we will create all other images in this size.
#12
@
14 months ago
- Focuses performance removed
- Keywords close added
@asafm7, the site icon and site logo are different, and you can use them at your preferred size.
Regarding the site logo, WordPress does not suggest a specific size because logos can vary in size according to the brand. Using the full
size is a suitable choice in my opinion, as it provides users with the flexibility to select the size they want.
It's worth noting that there is a get_custom_logo_image_attributes filter available, which allows you to use different-sized images if needed.
Let's also take into consideration @oglekler's point mentioned above. Removing the Performance focus.
@audrasjb Is this in your radar for 6.4
?
This ticket was mentioned in Slack in #core-performance by mukeshpanchal27. View the logs.
14 months ago
#14
@
14 months ago
Thanks @mukesh27 .
This option ties the logo to the icon.
https://drive.google.com/file/d/1_JG1EgS3jCU6fSl3jBzLLTLVLcXDLXOS/view?usp=drivesdk
I didn't try, but I believe filtering the attributes might be too late for utilizing tools such as Jetpack Photon, which contracts its URLs in an earlier stage.
I would propose it to be set to medium instead of full.