Improve PostURL terminology and accessibility #63669
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
afercia
added
[Type] Bug
|
Size Change: +209 B (+0.01%) Total Size: 1.77 MB
ℹ️ View Unchanged
|
|
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message. To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
This was referenced Jul 18, 2024
|
It is worth noting that after #64053 a long URL / slug is now truncated. I kindly disagree with that change. It defeats the purpose of this UI, which is to show the full URL or slug. |
afercia
force-pushed
the
fix/posturl-ui-slug-peermalink
branch
from
f8c9f5d to
38a37dd
Compare
|
Latest commits rebase on top of latest trunk and remove the truncation introduced in #64053 |
|
We need to do a holistic design pass on this, rather than one-off PRs that don't solve:
Why not simplify big time, making this just about editing the permalink (the primary action here), and providing additional context to what this is and what it's for, without sending people to an external link:
Visual referencesThis PR
Trunk
|
|
I can see some of the arguments in both these proposals. Removing the copy button seems reasonable; that seems unnecessary, and I agree that it's counter-intuitive. It might make sense to move it to be associated with the link, rather than the input, since that's what it actually copies. But we really need to change the labeling to say 'Slug', not 'Link' or 'Permalink'. This field only edits the slug, and it is simply incorrect to label it as anything else. Regarding the link to the page: as far as I know, this is the only place where that link is made available in the interface. I think it's a useful reference. I don't think that the 'Learn more' link is very useful there, and would be better omitted. It might be more useful if the target ID actually existed on that page. |
I see there's still some confusion about the actual editable value. This UI is meant to edit the slug. Instead, the permalink is the full URL, which is not fully editable. Only the slug can be edited here.
I seem to recall there was some prior direct user feedback to have a plave where users can see the full URL (permalink). @annezazu may help find some reference. To me:
However, in more than seven years the contributors didn't reach an agreement on the Edit permalink UI placement. That's a way broader design issue that is out of the scope of this PR. This PR only aims to fix obvious issues in the labeling and naming of this UI. For history, some references about the discussion and changes for the Edit Permalink UI: |
|
I think you're thinking of this! #64659 |
afercia
force-pushed
the
fix/posturl-ui-slug-peermalink
branch
2 times, most recently
from
c57f8fd to
58bf6ac
Compare
|
Flaky tests detected in 6c16cec. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/11325396167
|
joedolson
approved these changes
Oct 13, 2024
afercia
force-pushed
the
fix/posturl-ui-slug-peermalink
branch
from
58bf6ac to
85579bf
Compare
|
This PR only aims to fix obvious issues in the labeling and naming of the Edit permalink UI. This UI hasroom for futher improvements that would be great to address and they're already tracked in other issues. I'd like to suggest to move further feedback on those specific issues. In the meantime, I think this change is an improvement as it restores a correct terminology that has been in use in WordPress for ages and users are familiar with. Screenshot before and after:
|
|
Last commit reduces the top margin of the intro text. Screenshot before and after:
|
Note: I pinged the documentation team on WordPress/Documentation-Issue-Tracker#1704 to inform them of this change. |
ciampo
pushed a commit
that referenced
this pull request
Oct 14, 2024
* Improve PostURL terminology and accessibility. * Restore createInterpolateElement after rebase. * Remove value truncation after PR 64053. * Replace term URL with Permalink. * Reduce post url intro text top margin. Co-authored-by: afercia <[email protected]> Co-authored-by: joedolson <[email protected]> Co-authored-by: richtabor <[email protected]> Co-authored-by: annezazu <[email protected]> Co-authored-by: t-hamano <[email protected]>
gigitux
reviewed
Oct 23, 2024
| isDismissible: true, | ||
| type: 'snackbar', | ||
| } ); | ||
| } ); | ||
| const postUrlSlugDescriptionId = | ||
| 'editor-post-url__slug-descriotion-' + useInstanceId( PostURL ); |
afercia
added a commit
that referenced
this pull request
Oct 24, 2024
afercia
added a commit
that referenced
this pull request
Oct 24, 2024
Co-authored-by: afercia <[email protected]> Co-authored-by: gigitux <[email protected]>
karthick-murugan
pushed a commit
to karthick-murugan/gutenberg
that referenced
this pull request
Nov 13, 2024
* Improve PostURL terminology and accessibility. * Restore createInterpolateElement after rebase. * Remove value truncation after PR 64053. * Replace term URL with Permalink. * Reduce post url intro text top margin. Co-authored-by: afercia <[email protected]> Co-authored-by: joedolson <[email protected]> Co-authored-by: richtabor <[email protected]> Co-authored-by: annezazu <[email protected]> Co-authored-by: t-hamano <[email protected]>
karthick-murugan
pushed a commit
to karthick-murugan/gutenberg
that referenced
this pull request
Nov 13, 2024
Co-authored-by: afercia <[email protected]> Co-authored-by: gigitux <[email protected]>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Fixes #61196
What?
This PR proposes to restore the terminology WordPress always used when editing a post 'link':
The current UI allows users to edit the last part of the link and calls it 'link'. That's not what usees are editing. Actually, they are editing the slug.
On top of that, fixes some accessibility and usability issues:
Why?
For better usability and accessibility.
How?
Testing Instructions
aria-describedbyattribute.Testing Instructions for Keyboard
Screenshots or screencast
Before:
After: