WordPress.org

Make WordPress Core

Opened 4 months ago

Last modified 4 months ago

#49616 new enhancement

Audit /wp-admin and sentence-case UI elements (buttons, drop-downs) for better readability

Reported by: sixhours Owned by:
Milestone: Future Release Priority: normal
Severity: normal Version:
Component: Administration Keywords: has-patch
Focuses: accessibility, ui-copy Cc:

Description

I know this has been done throughout Gutenberg and in core to some extent (see #49371 and #48412). Would it be worth doing a sweep of the remainder of /wp-admin to sentence-case UI elements once and for all?

Examples:

  • "Add New Post" becomes "Add new post"
  • "All Categories" becomes "All categories"

The case for sentence case, h/t @danhauk:

  • Sentence case improves readability by allowing users to see proper shapes of words without the breaking flow of Capital Letters (i.e. Title Case is harder to read quickly because of how we typically read using the shapes of words.)
  • Sentence case respects the difference between proper nouns and the other words. For example, “Upgrade to premium plan” vs. “Upgrade to Premium Plan” could have very different meanings.
  • i18n: some languages capitalize different things (e.g. all nouns are capitalized in German). Title case adds cognitive load when users have to figure out which words are nouns, for example.

I welcome your thoughts!

Attachments (2)

Screen Shot 2020-03-10 at 10.22.41 AM.png (45.3 KB) - added by sixhours 4 months ago.
Screenshot of filters and heading of post list in /wp-admin
sentence-case-ui.diff (307.3 KB) - added by sixhours 4 months ago.
Patch for sentence-casing UI elements

Download all attachments as: .zip

Change History (5)

@sixhours
4 months ago

Screenshot of filters and heading of post list in /wp-admin

#1 @ianbelanger
4 months ago

  • Component changed from General to Administration
  • Keywords needs-patch added
  • Milestone changed from Awaiting Review to Future Release

#2 @aduth
4 months ago

Related recent Slack discussion, from #core-editor chat on 2020-02-26:

https://wordpress.slack.com/archives/C02QB2JS7/p1582727178065300

Which itself related to a conversation in the Gutenberg repository:

https://github.com/WordPress/gutenberg/pull/20187#issuecomment-585855450

And relevant guidelines from the Gutenberg and Core handbooks, respectively:

When it comes to headlines and subheads, there are two ways to capitalize:

In Title Case, the First Letter of Almost Every Word Is Capitalized

In sentence case, only the first letter of the line is capitalized

Feature names and dashboard sections typically use title case (think “Site Stats” or “Recently Published”), whereas feature labels typically use sentence case (like “Show buttons on” or “Comment Likes are,” where “Likes” is capitalized because it’s the feature name, but the overall label is using sentence case).

When you’re looking at a full page of UI copy, make sure you’re being consistent across all of it, and that all similar kinds of copy—headlines, tooltips, buttons, etc.—are using the same case.

From: https://developer.wordpress.org/block-editor/contributors/document/copy-guide/#five-pay-attention-to-capitalization

Capitalization

  • Labels
  • Button labels
  • Actions

From: https://make.wordpress.org/core/handbook/best-practices/spelling/#capitalization

Ideally, I think these should be converged toward one (well-defined) standard, so that we have a reference guideline against which any changes would be made.

#3 @sixhours
4 months ago

  • Keywords has-patch added; needs-patch removed

I started a patch for this. It's a big one. :)

Headings remain Title Case, but I've updated UI elements (labels, buttons, dropdowns, navigation) to use Sentence case.

I've probably missed some, but I hope this is a helpful starting point!

@sixhours
4 months ago

Patch for sentence-casing UI elements

Note: See TracTickets for help on using tickets.