Upgrade Site Health “Great job!” Checkmark (Dashicon)

[jetxpert]

Good Day!

It would be awesome if you guys can upgrade subject dashicon to a more modern, better looking version as requested below.

​https://wordpress.org/support/topic/making-wordpress-better-site-health-status-checkmark/#post-14794976

Thank you!

[desrosj]

Hi @jetxpert,

Thanks for this!

The Dashicons font is no longer accepting requests to add new icons or adjust preexisting ones.

A full breakdown can be ​found in the blog post. If this changes, this request would need to be ​submitted on the GitHub repository.

[jetxpert]

@desrosj,

Thank you for your guidance.

Created ​GitHub Issue No. 432.

Cheers!

[desrosj]

Apologies! It seems I misunderstood the suggestion originally. My understanding was that this was a request to add a new icon to the Dashicons font (which would not be considered).

The issue created over on GitHub suggests switching to using a different icon that already exists within the font. Switching an icon used within Core code can be considered. That is a discussion relevant to Trac, so reopening this.

Sorry for the goose chase.

[jetxpert]

@desrosj,

You did not misunderstand the original suggestion. We learned from you, so we made an adjustment.

Just updated ​GitHub Issue No. 432 to suggest using the dashicon: dashicons-heart

Looks great in the backend and suits better the term "Site Health."

Hopefully, Team WordPress will approve and make the change.

Cheers!

[sabernhardt]

heart icon

[sabernhardt]

The heart icon fits well here (or perhaps the smiley).

I made a patch to include aria-hidden with the heart icon. Instead of adding a 20px bottom margin, the height is increased to 150px so that matches the font size and width.

[jetxpert]

@sabernhardt,

Tested your patch at our end. Everything looks great.

Good to go. Thank you!

[generosus]

Replying to desrosj:

Apologies! It seems I misunderstood the suggestion originally. My understanding was that this was a request to add a new icon to the Dashicons font (which would not be considered).

The issue created over on GitHub suggests switching to using a different icon that already exists within the font. Switching an icon used within Core code can be considered. That is a discussion relevant to Trac, so reopening this.

Sorry for the goose chase.

Hi @desrosj! Stumbled upon this ticket. Any chance this suggestion can be tabled for WP Milestone 5.9? Thank you.

[Clorith]

I'm happy to explore different icons to use here, but we need to keep in mind that this needs to be internationally considered "good".

A black heart may be associated with a negative feeling, or in some cases irony, and may not be the best option here.

I can for reference include that the initial icon was the thumbs up dashicon, but this was also dropped because that is a very rude gesture in some parts of the world.

[generosus]

Replying to Clorith:

I'm happy to explore different icons to use here, but we need to keep in mind that this needs to be internationally considered "good".

A black heart may be associated with a negative feeling, or in some cases irony, and may not be the best option here.

I can for reference include that the initial icon was the thumbs up dashicon, but this was also dropped because that is a very rude gesture in some parts of the world.

Hi @Clorith!

Excellent feedback.

We reviewed WP's approved list of dashicons. It appears your concern can be solved by using WP's smiley dashicon (dashicons-smiley) ​https://developer.wordpress.org/resource/dashicons/#smiley.

Would be a nice change to WP's current Site Health dashicon.

[sabernhardt]

smiley icon

[generosus]

@sabernhardt,

Given the geometry of the smiley dashicon, the following CSS code should make things look a tad better:

margin-bottom: .5rem;

Can you double-check me on that? Thoughts appreciated.

Thank you.

[Clorith]

I like how this looks, the happy little friend there, I'll make some minor adjustments to the margins to make it looks a bit more natural, both on desktop and mobile, but other than that, yeah we'll get this included.

[Clorith]

In 52018:

Site Health: Update the icon used when no issues are reported.

The icon used to be a rather blocky checkmark, but has now been changed to the more friendly, and less ambiguous, smiley dashicon.

It also helps cover a rare cases where a checkmark, while often used to mark something as done, may also be used to indicate that something is incorrect (many thanks to my 6th grade teacher for this rationale).

As an added bonus, this commit also adjusts the margins used around the icon, to make it fit more nicely on both large and small viewports.

Props sabernhardt, generosus.
Fixes #53980.