#60141 closed defect (bug) (fixed)
Proximity of controls: Upload New Media multi-file uploader
Reported by: | afercia | Owned by: | audrasjb |
---|---|---|---|
Milestone: | 6.6 | Priority: | normal |
Severity: | normal | Version: | 5.8 |
Component: | Media | Keywords: | has-screenshots has-patch commit |
Focuses: | accessibility | Cc: |
Description
When uploading media files in the Upload New Media > multi-file uploader page, newly added files are listed within rows after the uploader.
The rows contain:
- The attachment details, on the left.
- Additional tools, on the right.
There's a couple problems with that.
Proximity of controls
The tools are displayed too far to the right, way far from the details. This is a problem, for example, for low vision users and users who use screen magnifiers, as the tools may be out of their vision field.
Controls should be displayed visually grouped so that they can be easily discovered by all users. I'm not sure there's a good reason to have all that spacing between details and tools in the first place.
The Copy button shifts to the left when copying
There's a few Copy buttons in use in the admin pages. Most of them are aligned to the left and there's a good reason for that: The UI must provide space for the 'Copied!' confirmation text.
However, on this page the Copy button is aligned to the right. After a copy operation, the 'Copied!' text appears on the right of the button thus making the button itself shift to the left. I'm not sure having moving interactive controls on the screen is a good user experience. Instead, the Copy button should be placed in a way to reserve some space for the 'Copied!' text to appear without triggering a shift of other content.
See screenshots and animated GIF below.
Attachments (7)
Change History (21)
This ticket was mentioned in Slack in #accessibility by joedolson. View the logs.
6 months ago
#2
@
6 months ago
- Milestone changed from Awaiting Review to 6.6
- Owner set to rcreators
- Status changed from new to assigned
- Version set to 5.8
This makes sense. Milestoning.
@
4 months ago
@afercia can you check this and give a feedback if this works or do you have any other idea.
#4
@
4 months ago
@rcreators thanks for the ping and the screenshot.
To me, your proposal would work.
An alternative approach could be keeping the horizontal alignment but aligning the 'attachment-tools' to the left. However, the filenames of the attachments may have different length. In this case, the problem would be keeping the 'attachment-tools' with the Edit and Copy aligned. See attached screenshot. Overeall, I'd vote for your proposal because it's simpler.
#5
@
4 months ago
@rcreators a grid layout is an interesting exploration. Personally, I'd rather keep it simple and minimize changes by keeping the current layout and just fixing the proximity problem.
This ticket was mentioned in PR #6547 on WordPress/wordpress-develop by @rcreators.
4 months ago
#6
- Keywords has-patch added
This patch is updating the design of the upload-new.php file. So if the user uploads the files, the progress bar is now stacked below the file name. After the upload completes, Action buttons also stack below the file name.
Trac ticket: https://core.trac.wordpress.org/ticket/60141
#8
@
4 months ago
- Keywords has-testing-info removed
@afercia Changes amended to PR. Please test it and let me know if needed any changes else we can put it to commit.
@rcreators commented on PR #6547:
4 months ago
#9
@afercia All the changes are amended. Ready to commit. :-)
#10
@
4 months ago
- Keywords commit added
https://github.com/WordPress/wordpress-develop/pull/6547 looks good to me. Marking for commit.
This ticket was mentioned in Slack in #accessibility by rcreators. View the logs.
4 months ago
#12
@
4 months ago
- Owner changed from rcreators to audrasjb
Thanks everyone for your work. Self assigning for commit as we're close to 6.6 beta 1.
@audrasjb commented on PR #6547:
4 months ago
#14
committed in https://core.trac.wordpress.org/changeset/58279
Unnecessary spacing between details and tools