Project

General

Profile

Actions

Task #92648

open

Epic #89595: Improve accessibility of backend

Page column header has insufficient color contrast and no <h2>-tag, the icon has no discernible text

Added by Mark Leutl almost 4 years ago. Updated 3 months ago.

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

0%

Estimated time:
TYPO3 Version:
11
PHP Version:
Tags:
accessibility
Complexity:
easy
Sprint Focus:

Description

Text must have a color contrast ratio of 4.5:1, icons a color contrast ratio of 3:1. The headline in .t3-page-column-header has insufficient color contrast of 2.84 (foreground color: #999999, background color: #ffffff), see WebAIM Color Contrast Checker.

Since this is a heading, a <h2>-tag should be used.

A screenreader doesn't know the purpose of the link because the link and icon have no discernible text.

#tas2020 TYPO3-60


Related issues 1 (1 open0 closed)

Related to TYPO3 Core - Bug #103583: Improve accessibility of elements with low opacity on focus by keyboardUnder Review2024-04-09

Actions
Actions #1

Updated by Mark Leutl almost 4 years ago

  • Description updated (diff)
Actions #2

Updated by Riccardo De Contardi almost 4 years ago

  • Parent task set to #89595
Actions #3

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/+/66875

Actions #4

Updated by Gerrit Code Review over 3 years ago

Patch set 2 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/+/66875

Actions #5

Updated by Christian Kuhn about 3 years ago

  • Status changed from Under Review to New
Actions #6

Updated by Christian Kuhn about 3 years ago

The pending patch did not find consensus and is stalled. Issues is kept open for now for a fresh approach when work is picked up here again.

Actions #7

Updated by Riccardo De Contardi 3 months ago

  • Related to Bug #103583: Improve accessibility of elements with low opacity on focus by keyboard added
Actions #8

Updated by Riccardo De Contardi 3 months ago

On TYPO3 13.2.0-dev the column areas have been redesigned; now the text is

12px bold #000000
while the background-color is #f2f2f2

It is sufficient to be AAA compliant for small texts (https://www.learnui.design/tools/accessible-color-generator.html)

what's left?

  • Still, it is not a heading, but a plain text inside a <div> .
  • The "Edit this column icon" on its normal state has a really low contrast (disabled!) - see related issue
Actions

Also available in: Atom PDF