Gutenberg: Give the title area a block description

[Clorith]

The title area can easily be mistaken for a block, with it being so close to the content.

If you select it, the Block section of the extended settings will show No block selected, which may seem a bit confusing, how about introducing a text here that informs users what they are looking at, something simple like This field is the title of your <post>, and its placement is determined by your theme.

I added that last bit about placement, since it looks like it's a part of your content, when in reality it isn't.

[designsimply]

Adding a screenshot for reference.

^{Seen at http://alittletestblog.com/wp-admin/post-new.php running WordPress 4.9.8 and Gutenberg 3.4.0 using Firefox 61.0.1 on macOS 10.13.6.}

[Clorith]

Perhaps we could make the permalink more discoverable by utilizing this area?
As we are now essentially removing the slug meta box, this would be a natural place for it I feel, not completely convinced on it, but it's an idea at least.

[designsimply]

It's worth discussion! Added the Needs Design Feedback tag for that purpose.

[karmatosed]

Maybe we can just not have block show when it's clicked? I mean it's not yet a block so having it behave this way seems a little wrong. I know this adds in a new element of only showing 'block' when it's clicked on a block, however I think this could make a lot more sense and stop the confusion. @jasmussen pinging you here as this is a little move from what we have now but to me I think sensible.

[jasmussen]

Yep, excellent discussion to have, and I agree completely with Tammie. This is a "temporary" problem, in that _we absolutely mean for the title to be a block so you can remove it_, but that won't happen in the near future. Which also means "temporary" could be a while. But it's worth mentioning, as that suggests any solutions we figure here are eventually going to be in the "back compat" category. In that vein, although I agree we should surface the permalink editing in a better way than we have now (separate issue is filed somewhere with some good ideas there), we probably shouldn't put it in the inspector here, given this preface.

But a description seems like a superb first step. Something that describes what the title does, what it means for SEO, where it shows up on the page, and perhaps even acknowledge that this isn't a block which is why you can't move it and such. Something like:

This is the title of your document. Depending on your theme, it will show up as the label in your browsers tabs, and as the headline of your publication. A good title is important for search engine optimization, as well as for people using screen readers to announce what the document is about.
The title is not a block, so you can't move it or delete it.

☝️ that, but less techy, shorter, better, sweeter, perhaps. @michelleweber?

[michelleweber]

How's about something like:

This is your post's title. Titles are important for search engines and so people using screen readers understand what they're reading, so don't leave it blank! You might see it a browser tab, or as a headline on your website. The exact placement depends on your theme -- it's not a block, so you can't move it around.

I'd put a paragraph break after "blank!" for easier quick reading, if there's space to do that.

(Ideally, there are 2 versions, one for posts and one for pages, to avoid using "document" -- I suspect that when people are writing posts or pages, they're not thinking in terms of "documents.")

[jasmussen]

Holy guacamole that's good. You're good Michelle. You're good.

But yes, I intentionally used "Document" because of the post/page split. But it's worse than that — we might have a million unknown custom post types. So if there's a word we can use as an umbrella term for any content type, that would be easiest, especially for translators. I feel like @yoavf might have had some thoughts on this in the past.

[michelleweber]

I do what I can. Bummer about the page/post thing -- I figured it wouldn't fly and there was a reason you'd originally used "document," but I had to try!

Options:

1. Don't call it anything. Just say "This is the title."
2. "Document," which is broad, but I feel like that word already has a lot of specific connotations for people and they are not website-related connotations, which invites confusion.
3. "Content." Personally, the word "content" makes my eyeball twitch, but it is a word that's commonly associated with websites and the things we put on websites, and it's broad enough to encompass pages, posts, and post types.

Personally, my vote is with 1. But assuming that 1 lacks the specificity you want here, I'd probably go with 3. Or whatever better thing Yoav has already come up with :)

[yoavf]

I feel like @yoavf might have had some thoughts on this in the past.
:)

As far as translation is concerned, it's definitely possible (and something we've done in the past) to create three variations of a string. One for posts, one for pages, and one for all other content types. This way you can customize the message specifically for posts or pages, and have another more generic message for everything else.

[kjellr]

I'm going to go ahead and remove Needs Design Feedback from this issue, since it seems like we're aligned on a design solution. 👍

[0aveRyan]

@yoavf My personal feeling is separate strings could be overkill, and still won't account for Custom Post Types (but happy to be persuaded otherwise).

I agree it's confusing whether this is a block/movable item (the design treatment currently furnishes the Title area with Block-like appearance), but I think addressing that nuance through design would be better than description text.

@michelleweber riffing on your copy from above:

Craft a title to identify this content across your site, search engines and social media.

[michelleweber]

Would this be in place of the "no block selected," with no other description?

I'd probably say "add" or "write" instead of "craft" -- they're a little less formal, a little more accessible. "Add a title to identify this content on your site. They're helpful for search engines and social media, too."

[melchoyce]

Should this also have a block icon?

[designsimply]

Should this also have a block icon?

Maybe after it becomes a real block? See https://github.com/WordPress/gutenberg/issues/11553.