Make WordPress Core

Opened 11 years ago

Closed 11 years ago

Last modified 11 years ago

#35661 closed defect (bug) (fixed)

Color contrast and other improvements for the WP badge

Reported by: afercia Owned by: melchoyce
Priority: normal Milestone: 4.5
Component: Administration Version:
Severity: normal Keywords: has-screenshots color-contrast has-patch commit
Cc: Focuses: ui, accessibility

Description

See related #31713.

The WP badge on the About/Credits/Freedoms screens has a version number with a low contrast:

https://cldup.com/C--LgvVAJg.png

Also, the "W" mark should be updated to the most recent one and maybe the placement of the badge could be improved a bit.

Attachments (3)

About-screen.png (112.0 KB ) - added by liljimmi 11 years ago.
Version number in white.
35661-update-badge.diff (4.7 KB ) - added by hugobaeta 11 years ago.
Patch to fix text color, adjust proportions of the badge, and replace svg (uploading updated fallback png separately)
w-logo-white.png (9.1 KB ) - added by hugobaeta 11 years ago.
updated png fallback file at retina size (double the size that it's displayed)

Download all attachments as: .zip

Change History (16)

#1 @afercia
11 years ago

  • Owner set to hugobaeta
  • Status newassigned

Assigning to @hugobaeta since he's far more familiar with WordPress branding than me :)

This ticket was mentioned in Slack in #design by afercia. View the logs.


11 years ago

@liljimmi
11 years ago

Version number in white.

#3 @liljimmi
11 years ago

Hello. I attached a screenshot of the version number in white. Let me know what you all think. I also took the current logo from https://wordpress.org/about/logos/ and it looks identical to the one on the welcome screen.

Please let me know if I'm missing something.

Thank you.

#4 @afercia
11 years ago

Hello @liljimmi! the version number in white is definitely more readable. About the logo: cc @hugobaeta :)

#5 @liljimmi
11 years ago

Would you like me to create a patch for the contrast, or wait for feedback on the logo and make a patch for the whole thing?

#6 @afercia
11 years ago

@liljimmi not sure about the logo, @hugobaeta mentioned he wanted to update it with the latest version, see: https://wordpress.slack.com/archives/design/p1454081141000448

@hugobaeta
11 years ago

Patch to fix text color, adjust proportions of the badge, and replace svg (uploading updated fallback png separately)

@hugobaeta
11 years ago

updated png fallback file at retina size (double the size that it's displayed)

#7 @hugobaeta
11 years ago

Yes, I've been wanting to update the logo there with the revised new version (you can find it on the new Design Handbook: https://make.wordpress.org/design/handbook/foundations/identity/).

Uploaded a patch to change the text color to white, and used the opportunity to tweak the proportions of the patch slightly. Also updated the image files (SVG and PNG fallback) with the new version of the logo mark. Here's a preview:

https://cldup.com/_uPCzGTTvi.png

#8 @liljimmi
11 years ago

Looks great!

#9 @afercia
11 years ago

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

For posterity: before and after on Chrome, Windows:

https://cldup.com/BDyKfDuDb5.png

I'd say one of the design team representative should commit :)

#10 @melchoyce
11 years ago

  • Owner changed from hugobaeta to melchoyce

I'll take this one.

This ticket was mentioned in Slack in #core by chriscct7. View the logs.


11 years ago

#12 @melchoyce
11 years ago

  • Resolutionfixed
  • Status assignedclosed

In 36910:

About: Improve color contrast of WP Badge text, and update the logo to use the latest version.

Fixes #35661.
Props @hugobaeta.

#13 @pento
11 years ago

In 36929:

About: Run w-logo-white.png through imagemin.

See #35661.

Note: See TracTickets for help on using tickets.