Accessibility fixes [#2003834]

this issue will fix the accessibility issues from #1952394: Add configuration translation user interface module in core

First off, it is hard to distinguish the "source" information from the form field where to type its translation. This issue could be solved by adding the language to the label of the information that you are translating.
So, for instance, to translate the site name you could have something like:
Site name (Source language): site_name
Site name (Language_that_you_are_translating_the_information_into): form field to translate it
If this additional information should not be shown to sighted users, it can be wrapped in a span/div element which the "element-invisible" class can be assigned to, so that the information is available for screen reader users, but not for sighted ones.

When you try to translate the displays of a view, you get lots of buttons labelled "display settings". You can understand what display a button refers to only after clicking it. This is not good for accessibility and (maybe( for usability too. And I was also wondering: does it make sense, from a usability point of view, to have the display settings in collapsible details elements?

And finally, I think that the Source text that you are translating into another language should be wrapped in a div/span element, which "lang" attribute should be set to the appropriate value according to the source language. It could be also appropriate to set the "lang" attribute of the form element to translate an element (e.g. the site name) to the appropriate value according to the language that the text is going to be translated into.

Comment	File	Size	Author
#19	2003834-config-translation_accessibility-19.patch	3.97 KB	Schnitzel
#19
#9	1999156-config-tranlation_accessibility-depends-2004194-9.patch	3.15 KB	Schnitzel
#9
#8	1999156-config-tranlation_accessibility-7.patch	3.16 KB	Schnitzel
#8
#3	1999156-config-tranlation_accessibility-3.patch	3.14 KB	Schnitzel
#3
#1	1999156-config-tranlation_accessibility-1.patch	3.14 KB	Schnitzel
#1

Support from Acquia helps fund testing for Drupal Acquia logo

Comments

Comment #1

Schnitzel CreditAttribution: Schnitzel commented 25 May 2013 at 18:01

Status:

Active

» Needs review

File	Size
1999156-config-tranlation_accessibility-1.patch	3.14 KB

the attached patch fixes all these issues:

The Source and Translation Label now have the Language in Brakets, but with the "element-invisible" class, so it's only shown to screen readers
The Title of a collapsible area tries to search the child items for something with "title" in the key and if found shows this in the title, so for the Frontpage Views it shows "Displaysettings Master" instead of "Displaysettings"
Added the lang="" attribute to the source and translation, so that screenreaders can work better with different languages. (actually this would make sense to do this in the string translation)

Comment #2

25 May 2013 at 19:05

Status:

Needs review

» Needs work

The last submitted patch, 1999156-config-tranlation_accessibility-1.patch, failed testing.

Comment #3

Schnitzel CreditAttribution: Schnitzel commented 25 May 2013 at 19:20

File	Size
1999156-config-tranlation_accessibility-3.patch	3.14 KB

reroll

Comment #4

Schnitzel CreditAttribution: Schnitzel commented 25 May 2013 at 19:20

Status:

Needs work

» Needs review

Comment #5

25 May 2013 at 19:29

Status:

Needs review

» Needs work

The last submitted patch, 1999156-config-tranlation_accessibility-3.patch, failed testing.

Comment #6

Schnitzel CreditAttribution: Schnitzel commented 25 May 2013 at 19:51

Status:

Needs work

» Needs review

#3: 1999156-config-tranlation_accessibility-3.patch queued for re-testing.

Comment #7

25 May 2013 at 19:58

Status:

Needs review

» Needs work

The last submitted patch, 1999156-config-tranlation_accessibility-3.patch, failed testing.

Comment #8

Schnitzel CreditAttribution: Schnitzel commented 25 May 2013 at 20:06

Status:

Needs work

» Needs review

File	Size
1999156-config-tranlation_accessibility-7.patch	3.16 KB

(facepalm), overwrote $key, interesting that the whole thing actually still worked! :D

Comment #9

Schnitzel CreditAttribution: Schnitzel commented 25 May 2013 at 20:20

File	Size
1999156-config-tranlation_accessibility-depends-2004194-9.patch	3.15 KB

this patch depends on #2004194: Add getLanguageWithFallback() to ConfigGroupMapper so it will fail till it's not yet landed

Comment #10

25 May 2013 at 20:29

Status:

Needs review

» Needs work

The last submitted patch, 1999156-config-tranlation_accessibility-depends-2004194-9.patch, failed testing.

Comment #11

Schnitzel CreditAttribution: Schnitzel commented 25 May 2013 at 21:36

Status:

Needs work

» Needs review

#9: 1999156-config-tranlation_accessibility-depends-2004194-9.patch queued for re-testing.

Comment #12

25 May 2013 at 21:41

Status:

Needs review

» Needs work

The last submitted patch, 1999156-config-tranlation_accessibility-depends-2004194-9.patch, failed testing.

Comment #13

Schnitzel CreditAttribution: Schnitzel commented 25 May 2013 at 21:58

Status:

Needs work

» Needs review

#9: 1999156-config-tranlation_accessibility-depends-2004194-9.patch queued for re-testing.

Comment #14

25 May 2013 at 22:06

Status:

Needs review

» Needs work

The last submitted patch, 1999156-config-tranlation_accessibility-depends-2004194-9.patch, failed testing.

Comment #15

Schnitzel CreditAttribution: Schnitzel commented 25 May 2013 at 22:44

Status:

Needs work

» Needs review

#9: 1999156-config-tranlation_accessibility-depends-2004194-9.patch queued for re-testing.

Comment #16

25 May 2013 at 22:51

Status:

Needs review

» Needs work

The last submitted patch, 1999156-config-tranlation_accessibility-depends-2004194-9.patch, failed testing.

Comment #17

Schnitzel CreditAttribution: Schnitzel commented 25 May 2013 at 22:53

Status:

Needs work

» Needs review

#9: 1999156-config-tranlation_accessibility-depends-2004194-9.patch queued for re-testing.

Comment #18

Gábor Hojtsy

he/him

Hungarian

Hungary

CreditAttribution: Gábor Hojtsy commented 26 May 2013 at 00:48

Status:

Needs review

» Needs work

+++ b/lib/Drupal/config_translation/Form/ConfigTranslationManageForm.phpundefined
@@ -138,9 +146,16 @@ class ConfigTranslationManageForm implements FormInterface {
+          $title = ' ';
+          foreach (array_keys($sub_build) as $title_key) {
+            if (strpos($title_key, 'title') !== FALSE) {
+              $title .= strip_tags($sub_build[$title_key]['source']['#markup']);
+              break;
+            }
+          }
           $build[$key] = array(
             '#type' => 'details',
-            '#title' => t($definition['label']),
+            '#title' => t($definition['label']) . $title,

I think title should come first before the label definition, eg. "Page Display" vs. "Display Page".

Also, it would be great to look for a 'label' key as well. So what I would do is

$keys = array_keys($sub_build);
if (isset($sub_build['label'])) { use that }
elseif (isset($sub_build['title'])) { use that }
else {
  your foreach with strpos for BOTH title and label :) as in strpos(.. 'label') || strpos(... 'title')
}