Improve URL input and Image URL input user interfaces consistency #58507
Labels
[Focus] Accessibility (a11y)
Changes that impact accessibility and need corresponding review (e.g. markup changes).
Needs Design Feedback
Needs general design feedback.
[Package] Block editor
/packages/block-editor
[Type] Bug
An existing feature does not function as intended
Description
Splitting this out from #58505 (comment)
Consistency in user interfaces is part of accessibility, better user experience and consistent design.
A consistent UI reduces cognitive load, provides predictability and improves trust and affordance.
To insert links on text and images there are two different components. Besides obvious specific differences, for example images do have specific features like 'preset' to add a link to the image file or attachment, ideally these two UIs should look and behave very similarly. There's some pretty evidend inconsistencies though. To mention a few:
Paste URL or type to search
vs.Search or type url
withurl
lowercase (sigh).Additionally, while working on #58505 I observed the state of the CSS isn't ideal. There's some overriding of default styles that should be avoided and, generally, working on this part of the CSS isn't a great user experience. It's likely that, by reducing functional inconsistencies and inconsistent markup, it is then posisble to freatly simplify the CSS as well.
Current state of the Image URL input UI before #58505
Current state of the 'default' URL input UI:
Step-by-step reproduction instructions
Screenshots, screen recording, code snippet
No response
Environment info
No response
Please confirm that you have searched existing issues in the repo.
Yes
Please confirm that you have tested with all plugins deactivated except Gutenberg.
Yes
The text was updated successfully, but these errors were encountered: