Update the Dashboard welcome banner for 6.1

[ryelle]

The Dashboard's welcome panel currently shows the "6.0" background image. It will need to be updated for 6.1, at least the image asset. Any string changes would need to happen ASAP (before beta 3 on Oct 4, unless this is considered part of the "About" strings).

For the past few releases, this design has matched the About page design (the 6.1 About page is tracked at #56357).

See #55532 for the previous update.

[ryelle]

Current dashboard widget

[davidbaumwald]

Moving this up in prio for visibility.

[rudlinkon]

@sabbirmc or @msnewas you may help by providing the design.

[adampickering]

@richtabor and myself whipped up many concepts for the Dashboard welcome banner for 6.1

See threads.

​https://wordpress.slack.com/archives/C02S78ZAL/p1664551500695589

​https://wordpress.slack.com/archives/C02S78ZAL/p1664915916310249

[kirasong]

@chaion07 and I looked at this ticket during triage today.

Thanks @ryelle for creating the ticket for tracking, and @adampickering and @richtabor for the designs!

Swapping keyword for needs-design-feedback since there are designs posted for review now.

Looks like there's some good conversation happening over on Slack.

[ryelle]

Updating the keywords back to needs-design, the designs posted were for the About page headers. The design here will be related, but isn't done yet. The dashboard page designs could also reflect the chosen admin color scheme.

Since we'll be past hard string freeze, we can only change the style (background of the header).

Apply the "About page" style update to the Welcome panel on the dashboard. This includes the 6.1 bubble image which is also added via ​https://github.com/WordPress/wordpress-develop/pull/3461.

This also updates the design to match the current color scheme. I'll link to screenshots, to avoid image-dumping in the ticket.

​Default, ​Blue, ​Coffee, ​Ectoplasm, ​Light, ​Midnight, ​Modern, ​Ocean, ​Sunrise.

And on small screens, the background disappears. ​Default, ​Blue, ​Coffee, ​Ectoplasm, ​Light, ​Midnight, ​Modern, ​Ocean, ​Sunrise.

Trac ticket: https://core.trac.wordpress.org/ticket/56703

Mind swapping out the first icon with this one? I'd say its a bit clearer. Thanks!

I think they look ace ✨

Mind swapping out the first icon with this one? I'd say its a bit clearer. Thanks!

Done ✅

[ryelle]

design approved, now it just needs 2nd committer sign off.

[davidbaumwald]

LGTM! @ryelle If you want to get this in before RC2, go for it!

[davidbaumwald]

In 54638:

Administration: Update the Dashboard welcome banner for 6.1.

Reviewed by ryelle and davidbaumwald.

Props ryelle, adampickering, mikeschroder, richtabor.
Fixes #56703.

Merged into core in https://core.trac.wordpress.org/changeset/54638.

[davidbaumwald]

Cleaning up the keywords after the merge.

[kebbet]

In the latest commit the 6.0 header image was added, was this by intension? Running trunk now displays 6.0 in the welcome banner background, and in the header of about.php …

• https://core.trac.wordpress.org/browser/trunk/src/wp-admin/images/about-header-about.svg

Bring back the svg from https://core.trac.wordpress.org/browser/trunk/src/wp-admin/images/about-header-about.svg?rev=54635

https://core.trac.wordpress.org/ticket/56703

[kebbet]

It's incorrect in 6.1 branch too.
-> https://core.trac.wordpress.org/browser/branches/6.1/src/wp-admin/images/about-header-about.svg

[SergeyBiryukov]

In 54645:

Help/About: Restore the correct header image for WordPress 6.1.

The new About header image appears to have been accidentally reverted to the older one in a previous commit.

Follow-up to [54635], [54638].

Props kebbet.
See #56703.

Thanks for the PR! Merged in r54645.

[SergeyBiryukov]

Marking [54645] for backporting to the 6.1 branch after a second committer's review.

[ryelle]

Looks good, I can do the backport commit.

[ryelle]

In 54648:

Help/About: Restore the correct header image for WordPress 6.1.

The new About header image appears to have been accidentally reverted to the older one in a previous commit.

Follow-up to [54635], [54638].

Props kebbet.
Reviewed by SergeyBiryukov, ryelle.
Merges [54645] to the 6.1 branch.
Fixes #56703.

[sabernhardt]

The SVG still needs aria-hidden, as it has had in 6.0 (changeset:53383 / ticket:55532#comment:13).

I'd also like to consider changing each path element to circle and removing the clip-path so the image can be much smaller. (I could convert the Freedoms image to circles, too, but the Credits and Privacy SVGs are more complicated.)

[sabernhardt]

adding aria-hidden, focusable and viewBox attributes; removing clip-path; converting path elements to circle

[ryokuhi]

We reviewed this ticket today during the Accessibility Team's weekly bug scrub.

The changes suggested by @sabernhardt regarding the aria-hidded, the focusable, and the viewBox attributes are needed.

Regarding the use of circles instead of paths, such a change would make the file sizes much smaller.
It would probably be easier if someone from the Design Team with the source files could make these changes.

[ryelle]

Patch 56703.diff​ looks good, I don't see any visual change from using circle and the file is notably smaller. I'm going to move the conversation about the other About images over to the About page ticket though.

[ryelle]

In 54662:

Help/About: Update the About header image.

When used inline, the SVG needs the aria-hidden, focusable, and viewBox properties for accessibility. Additionally, this optimizes the SVG by using cirlce elements in place of path, and removing clipPath. There is no visible change, but the file is now one-third the size.

Props sabernhardt.
See #56703, #56357.

[ryelle]

Marking [54662] for backport after a second committer review.

[SergeyBiryukov]

[54662] looks good to backport.

[ryelle]

In 54677:

Help/About: Update the About header image.

When used inline, the SVG needs the aria-hidden, focusable, and viewBox properties for accessibility. Additionally, this optimizes the SVG by using circle elements in place of path, and removing clipPath. There is no visible change, but the file is now one-third the size.

Props sabernhardt.
Reviewed by SergeyBiryukov, ryelle.
Merges [54662] to the 6.1 branch.
Fixes #56703. See #56357.