Project

General

Profile

Actions
Copy link

Bug #92613

closed

Epic #89595: Improve accessibility of backend

Mobile module menu links are missing link title

Added by Gabe Troyan over 3 years ago. Updated about 3 years ago.

Status:
Closed
Priority:
Should have
Assignee:
-
Category:
Backend User Interface
Target version:
-
Start date:
2020-10-20
Due date:
% Done:

100%

Estimated time:
TYPO3 Version:
11
PHP Version:
Tags:
tas2020, accessibility
Complexity:
Is Regression:
Sprint Focus:

Description

Pages/Tasks

  • Module menu left

Affected WCAG 2.1 Success criterions

  • 2.4.4 Link Purpose (In Context) A
  • 4.1.2 Name, Role, Value A

Affected components

  • Link

Description

When the module menu on the left is collapsed, only the icons without the titles are visible. When navigating to a link, the descriptive text must be presented to screen reader users to indicate the target of the link. The linked icons in the module menu have no descriptive text. The title-Attribute is not sufficient for all assistive technologies.

<button title="Page content" class="modulemenu-action t3js-modulemenu-action modulemenu-action-active" role="menuitem" id="web_layout" data-modulename="web_layout" data-link="/typo3/index.php?route=%2Fmodule%2Fweb%2Flayout&amp;token=a283194fa743e2f53d933e31d8bb84c801ae0af8" data-navigationcomponentid="TYPO3/CMS/Backend/PageTree/PageTreeElement">
 ...
</button>

Recommendation

When the module menu is collapsed, make sure that there are accessible titles available for the menu links. One solution would be to remove the CSS style "display: none" from the actual title of the menu item.

<span class="modulemenu-name">Page</span>

https://typo3.audit.gugler.at/issues#TYPO3-75

Related issues 1 (0 open — 1 closed)

Related to TYPO3 Core - Feature #92704: Make the navigation through module menu more efficient for keyboard usersClosed2020-10-25

Actions
Actions
Copy link
 #1

Updated by Gerrit Code Review over 3 years ago

  • Status changed from New to Under Review

Patch set 1 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/66220

Actions
Copy link
 #2

Updated by Riccardo De Contardi over 3 years ago

  • Parent task set to #89595
Actions
Copy link
 #3

Updated by Martin Kutschker over 3 years ago

  • Related to Feature #92704: Make the navigation through module menu more efficient for keyboard users added
Actions
Copy link
 #4

Updated by Martin Kutschker over 3 years ago

Suggested (and tested) solution:

//
// Name
//
.modulemenu-name {
    @extend .sr-only;

    overflow: hidden;
    flex-grow: 1;
    margin-left: 1em;
    white-space: nowrap;
    text-overflow: ellipsis;
}

//
// Scaffold
//
.scaffold-modulemenu-expanded {
    .modulemenu-name {
        position: static;
        margin: 0 0 0 1em;
        width: auto;
        height: auto;
    }
}
Actions
Copy link
 #5

Updated by Gerrit Code Review over 3 years ago

Patch set 14 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/66283

Actions
Copy link
 #6

Updated by Gerrit Code Review over 3 years ago

Patch set 15 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/66283

Actions
Copy link
 #7

Updated by Gerrit Code Review over 3 years ago

Patch set 16 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/66283

Actions
Copy link
 #8

Updated by Gerrit Code Review over 3 years ago

Patch set 17 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/66283

Actions
Copy link
 #9

Updated by Gerrit Code Review over 3 years ago

Patch set 18 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/66283

Actions
Copy link
 #10

Updated by Gerrit Code Review over 3 years ago

Patch set 19 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/66283

Actions
Copy link
 #11

Updated by Gerrit Code Review over 3 years ago

Patch set 20 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/66283

Actions
Copy link
 #12

Updated by Gerrit Code Review over 3 years ago

Patch set 21 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/66283

Actions
Copy link
 #13

Updated by Gerrit Code Review over 3 years ago

Patch set 22 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/66283

Actions
Copy link
 #14

Updated by Gerrit Code Review over 3 years ago

Patch set 23 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/66283

Actions
Copy link
 #15

Updated by Gerrit Code Review over 3 years ago

Patch set 24 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/66283

Actions
Copy link
 #16

Updated by Anonymous over 3 years ago

  • Status changed from Under Review to Resolved
  • % Done changed from 0 to 100
Actions
Copy link
 #17

Updated by Benni Mack about 3 years ago

  • Status changed from Resolved to Closed
Actions
Copy link

Also available in: Atom PDF