Make WordPress Core

Opened 4 years ago

Last modified 4 years ago

#50416 closed task (blessed)

5.5 About Page — at Version 31

Reported by: davidbaumwald's profile davidbaumwald Owned by: marybaum's profile marybaum
Milestone: 5.5 Priority: normal
Severity: normal Version:
Component: Help/About Keywords: i18n-change needs-patch commit dev-reviewed
Focuses: ui, accessibility, administration, ui-copy Cc:

Description (last modified by davidbaumwald)

This is where discussion and work will take place during 5.5 for the about' page.

Change History (34)

#1 @davidbaumwald
4 years ago

  • Milestone changed from Awaiting Review to 5.5

#2 @marybaum
4 years ago

  • Owner set to marybaum
  • Status changed from new to assigned

#3 @marybaum
4 years ago

  • Keywords needs-strategy-brief needs-copy added

5.5 About Page team, for matcher: @yvettesonneveld, @michelebutcher-jones, @estelaris, @metalandcoffee, @melchoyce, @marktimemedia, @abhanonstopnewsuk, @elmastudio Welcome aboard and props to all for taking this journey!

Last edited 4 years ago by marybaum (previous) (diff)

#4 @marybaum
4 years ago

Props @davidbaumwald for opening this ticket!

#5 in reply to: ↑ description @marybaum
4 years ago

Adding links here to #49295 for reference and @SergeyBiryukov's ticket #50372.

We can certainly fix the contrast on the upgrade notices in 5.5 and going forward!

Replying to davidbaumwald:

This is where discussion and work will take place during 5.5 for the about page.

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


4 years ago

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


4 years ago

@marybaum
4 years ago

First draft of copy

#8 @davidbaumwald
4 years ago

@marybaum Thanks! Can you submit the beginnings of a patch for this so others can begin contributing to the work?

Last edited 4 years ago by davidbaumwald (previous) (diff)

#9 @marybaum
4 years ago

  • Focuses ui-copy added
  • Keywords has-strategy-brief has-first-copy needs-layout added; needs-patch needs-design needs-strategy-brief needs-copy removed

This html file is a first go at the copy, based largely on this message strategy (https://docs.google.com/document/d/1Bw4aTbtoqAdYLxuXiZjKIYVnePzLt772qlud83imTx8/edit#heading=h.dulxln433j2l)

I learned to use message strategies at my first good agency job, in 1983. They were a requirement on every project and had come to the place I was working by way of Ted Bates & Company, a Chicago ad agency whose philosophy was "It's not creative unless it sells."

Contemporary agencies sometimes call these creative briefs; it doesn't really matter what we call them, as long as we're aware that our purpose is to communicate with our users and help them celebrate everything great about this new software they've just downloaded -- and for FREE!

Rough layouts to come shortly.

#10 @davidbaumwald
4 years ago

  • Keywords needs-design needs-patch needs-copy-review added; has-strategy-brief has-first-copy needs-layout removed

Updating tags to standard Trac workflow.

@audrasjb
4 years ago

Tried to put together the copy in the current 5.4 about page, for copy review

#11 follow-up: @audrasjb
4 years ago

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

Thanks @marybaum, it's good to see the copy one month ahead of the release day :)

In 50416.diff, I tried to put together the HTML blob into the current 5.4 about page screen as it could help to copy review what @marybaum wrote.

Please don't run WPCS linting! 😂 I tried to minimized the amount of semantics issues but I didn't run the coding standards tools.

I also fixed some typos.

I'll add a complete review of the issues I found on the copy later :)

#12 in reply to: ↑ 11 @marybaum
4 years ago

Have no fear! I won't be running this copy near any sort of linting! This is advertising, not editorial, ui or software. Read it out loud and see if you can catch the cadences -- there are places where the text repeats itself for effect, as you might see in poetry or music.

The paragraph breaks are intentional -- I break rules in this kind of copy. Those are not mistakes. They're decisions.

Remember that my degree is in Make it look intentional.

Replying to audrasjb:

Thanks @marybaum, it's good to see the copy one month ahead of the release day :)

In 50416.diff, I tried to put together the HTML blob into the current 5.4 about page screen as it could help to copy review what @marybaum wrote.

Please don't run WPCS linting! 😂 I tried to minimized the amount of semantics issues but I didn't run the coding standards tools.

I also fixed some typos.

I'll add a complete review of the issues I found on the copy later :)

#14 @ryelle
4 years ago

The PR linked above iterates on the previous patch — it cleans up some of the links & HTML in the strings, and tweaks how the content is currently displayed so it can be readable until we get a proper layout (I'm happy to collaborate with any designers to go over what framework we have, what we can easily do, what we can stretch…). I also added a screenshot of the current content.

There are still more than a few places with html tags in strings. For example,

<strong>Inline image editing</strong> - Crop, rotate, and zoom your photos right from the image block. If you do a lot of work with images, this alone could save you hours every week!

We try to avoid this usually, but splitting these strings up would mean more fragmented translations. Should these be tweaked to remove the extra HTML? Is this use of HTML not an issue? some translator input would be good here.

The list of gutenberg release tags is a lot — is there a single make post, or maybe a tag, that we could link to instead? If not, we'll want to figure out some way to make those more descriptive for link navigation (ex, screen readers).

For accessibility (since headings came up late last release), the current heading outline is:

1. Welcome to WordPress 5.5.
	2. Speed
	2. Search
	2. Security
	2. Speed. Search. Security. The power of three big improvements, all packed into WordPress 5.5.
	2. Highlights from the block editor
	2. Wait! There’s more!
		3. Better accessibility
	2. Just for developers
		3. Lazy-loading images
		3. PHPMailer
		3. Other changes for developers

#15 in reply to: ↑ description @marybaum
4 years ago

We have a layout! Huge props @estelaris.

https://www.figma.com/file/6DYWCgcbVKUYY2fcgC9LsX/About-page-5.5?node-id=40%3A127

See yall at devchat for show n tell! Yes, I'll add that to the agenda 😜

Replying to davidbaumwald:

This is where discussion and work will take place during 5.5 for the about page.

#16 @audrasjb
4 years ago

  • Keywords has-patch removed

Looks like this Figma file is not publicly accessible @marybaum @estelaris :)

#17 @estelaris
4 years ago

  • Keywords needs-design-feedback added; needs-design removed

#18 @audrasjb
4 years ago

Great! Thanks @estelaris and everyone who worked on this! 😃

I took a look on the proposal and here is what I noted on my side:

Header and Main navigation

  • Shouldn't we use the official WordPress font/style for the upper right "WordPress" text + logo?
  • The image banner is pretty big, in my opinion, it would be nice to reduce it a little (but that's just a personal thought)
  • More importantly, the colors used doesn't meet accessibility guidelines: #87BA22 / #fff
  • We'll need styles for navigation items hover/focus (must be something else than just color change)
  • I’m still unable to understand why we need/want to put "5.5" above "WordPress" in the main title, but that was already the case with 5.4 and 5.3 ;)

Editorial sections

what's the idea to manage column’s content?

  • "Dynamically" via CSS so columns auto-adapt themselves according to their content. Pros: columns will always have quite the same height on all languages. Cons: we can't ensure it will looks like that everywhere (for example the text "As of right now, you're finally done." will probably appear on the second column in many cases)

The "Highlights from block editor" section, doesn't use the good bullet style (according to the rest of the page). It shouldn't be "disc" but the "dot" used in the accessibility section as "disc" appear to be used for level two items (like in "Other changes for developers" section".

We'll need to add links styles to section’s content. At least two cases: links in regular sections (normal + focus/hover styles) and links contained in the green "For developers" box (normal + hover/focus styles).

Last edited 4 years ago by audrasjb (previous) (diff)

#19 @ryelle
4 years ago

Re columns, in the About page dev documentation, we have the has-2-columns helper class. It's not dynamic css, but we usually want headings at the top of each column. For the a11y section, we could probably bring back a dynamic column helper class.

I can build this up in the current about page framework to see what else it needs, while we wait for the updated nav & link styles - i'll update my PR before the core chat I saw there's copy & design discussion, so holding off on this for now.

Last edited 4 years ago by ryelle (previous) (diff)

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


4 years ago

#21 @afercia
4 years ago

More importantly, the colors used doesn't meet accessibility guidelines: #87BA22 / #fff

Yep, not sure that's the exact shade of green but worth reminding any text/background contrast must pass the 4.5:1 threshold.

Couple more initial considerations:

1
The all-uppercase WORDPRESS at the top right doesn't meet the WordPress logo usage guidelines. I think I already mentioned this for the previous release 5.4 but it wasn't changed. If it's okay for the projects leads, no objections from me.

2
The copy:

And that redundant Error: prefix in error notices? Gone.

Needs to be removed. That change was reverted in [48115].

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


4 years ago

#23 @cbringmann
4 years ago

Thanks to all who have worked on this so far. I think it is looking great! A couple of comments and suggestions:

Refined drag-and-drop

Capitalize the r

I wonder if shifting the tone to be neutral and features-focused would engage a larger audience? Question for feedback as I am new to the release process and am curious what tone has worked well in the past.

#24 @audrasjb
4 years ago

I wonder if shifting the tone to be neutral and features-focused would engage a larger audience?

I'd second that @cbringmann. I'm personally more comfortable with neutral tone and as General Translation Editor for a localized version of WordPress, it would be easier to translate.
But if most of the core team members are happy with that tone, I'm fine with the proposal. Not a big deal for me :)

Last edited 4 years ago by audrasjb (previous) (diff)

#25 in reply to: ↑ description ; follow-up: @marybaum
4 years ago

The design is certainly a work in progress, and we have a lot to work through. We're all open to any refinements, particularly from an accessibility point of view.

In terms of the copy, it's tempting to think that a neutral tone and dispassionste listing of features would appeal -- but that doesn't even work in training materials. All that does is bore people. (Wonder why so many Americans never read their email? That's a big part of it -- in uni, a lot of us get taught to write in a way that makes us sound smart but does nothing to communicate with the actual human beings on the other side of the screen.)

The only people who get any training at all in how to connect with a human are journalists (often, just sportswriters) and novelists. And then we advertising and direct-marketing people have to retrain copywriters all over again.

But this is the closest we come to advertising. And in advertising, we remember two things: we are always and only ever talking to one person at a time, and we talk to the emotions -- to the benefits.

Nearly a century's worth of data has shown that time and again, people buy what they want (never what they need) and they buy from people who understand them -- who have walked miles and miles in their shoes.

Abha, Yvette and I have pinned several books and a few ads to both the 5.5 and 5.6 chats that teach this point -- And I'll leave you with the barest hint of a story to make my point that this is true at every level of society.

Want to know why so many Americans carry phones from AT&T Wireless? Especially when, at the dawn of the iPhone's history, the company Apple made the deal with was called Cingular, and it had the best reputation across US wireless companies? Well, I'm in a position to know that the first thing that happened in a long process was that the CEO of Cingular Wireless was rejected from a certain country club here in St. Louis, Mo. I kid you knot -- and it started a chain reaction that over the next many years led to the configuration of wireless tech companies we see today.

Of course there were many steps in the process -- but that was the trigger.

So, no -- all a neutral tone does is confirm a reader's fear that a given piece of copy is for someone other than the only person they ever want to read about: Me. Or, to us, You -- with occasional mentions of a supporting cast whose first names are all Your: Your friends, your family, your boss -- and more.

I've spent just about forty years studying this, and I don't consider myself all that good at it (yet) but any time I've deviated from the drama we all live in, called Life, and tried to talk down to or over the head of a reader, or to more than one person at a time, the only audience I've ever reached was (back when we printed things) a couple of fruit flies on the banana peel in the kitchen trash, where my group's copy ended up. And not one of them had any money ...

"I wonder if shifting the tone to be neutral and features-focused would engage a larger audience?"

#26 in reply to: ↑ description @marybaum
4 years ago

There's a later version of the layout with considerably shorter, tighter copy here:

https://www.figma.com/file/D4tVZ0mJDcaRdODjk7XYTv/About-page-5.5-(Copy)?node-id=0%3A1

#27 follow-up: @audrasjb
4 years ago

Thanks @marybaum for elaborating. To be clear, I'm fine with the current copy if everyone if ok with that.

I’d just point out that the general aim you described for this page looks (culturally) very US-centric to me, but it is something each Locale can probably adapt on their side.

Last edited 4 years ago by audrasjb (previous) (diff)

#28 in reply to: ↑ 25 @marybaum
4 years ago

  • Description modified (diff)

Replying to marybaum:

The design is certainly a work in progress, and we have a lot to work through. We're all open to any refinements, particularly from an accessibility point of view.

In terms of the copy, it's tempting to think that a neutral tone and dispassionste listing of features would appeal -- but that doesn't even work in training materials. All that does is bore people. (Wonder why so many Americans never read their email? That's a big part of it -- in uni, a lot of us get taught to write in a way that makes us sound smart but does nothing to communicate with the actual human beings on the other side of the screen.)

The only people who get any training at all in how to connect with a human are journalists (often, just sportswriters) and novelists. And then we advertising and direct-marketing people have to retrain copywriters all over again.

But this is the closest we come to advertising. And in advertising, we remember two things: we are always and only ever talking to one person at a time, and we talk to the emotions -- to the benefits.

Nearly a century's worth of data has shown that time and again, people buy what they want (never what they need) and they buy from people who understand them -- who have walked miles and miles in their shoes.

Abha, Yvette and I have pinned several books and a few ads to both the 5.5 and 5.6 chats that teach this point -- And I'll leave you with the barest hint of a story to make my point that this is true at every level of society.

Want to know why so many Americans carry phones from AT&T Wireless? Especially when, at the dawn of the iPhone's history, the company Apple made the deal with was called Cingular, and it had the best reputation across US wireless companies? Well, I'm in a position to know that the first thing that happened in a long process was that the CEO of Cingular Wireless was rejected from a certain country club here in St. Louis, Mo. I kid you knot -- and it started a chain reaction that over the next many years led to the configuration of wireless tech companies we see today.

Of course there were many steps in the process -- but that was the trigger.

So, no -- all a neutral tone does is confirm a reader's fear that a given piece of copy is for someone other than the only person they ever want to read about: Me. Or, to us, You -- with occasional mentions of a supporting cast whose first names are all Your: Your friends, your family, your boss -- and more.

I've spent just about forty years studying this, and I don't consider myself all that good at it (yet) but any time I've deviated from the drama we all live in, called Life, and tried to talk down to or over the head of a reader, or to more than one person at a time, the only audience I've ever reached was (back when we printed things) a couple of fruit flies on the banana peel in the kitchen trash, where my group's copy ended up. And not one of them had any money ...

"I wonder if shifting the tone to be neutral and features-focused would engage a larger audience?"

#29 @davidbaumwald
4 years ago

  • Description modified (diff)

#30 in reply to: ↑ 27 @marybaum
4 years ago

  • Description modified (diff)

Replying to audrasjb:

Thanks @marybaum for elaborating. To be clear, I'm fine with the current copy if everyone if ok with that.

I’d just point out that the general aim you described for this page looks (culturally) very US-centric to me, but it is something each Locale can probably adapt on their side.

I'll concede that any fantasies I ever had of living en France ended with "How would I write decent copy in French?" ...

When we get to 5.6, the Marketing team will start building actual personae we can write to, so there will be some actual data around the concerns we can address. And it will be a good thing to keep in mind that talking to one person in copy, and commiserating over a given frustration in a given part of the UX, doesn't mean we're always talking to a 50-year-old baseball fan in Missouri.

A couple people have caught expressions that are too US-centric already, and we should definitely keep looking for those and making the experiences they represent readable -- feelable! -- across the common experience we all have as WP admin users.

That's one thing I like about You -- each of us is You if the experience is relatable.

Last edited 4 years ago by marybaum (previous) (diff)

#31 @davidbaumwald
4 years ago

  • Description modified (diff)

@marybaum Can you not edit the ticket description when commenting. I think the ticket description should be meaningful and descriptive of the process taking place here. Resetting the description again to the original.

Last edited 4 years ago by davidbaumwald (previous) (diff)
Note: See TracTickets for help on using tickets.