WCAG: 1.4 Distinguishable

[StephDriver]

Requirement

https://www.w3.org/TR/WCAG22/#distinguishable

Make it easier for users to see and hear content including separating foreground from background.

Current Situation

❌ use of colour

Colour is not the only visual means of conveying any information except for the contact form in the OLH theme where it is used to show invalid inputs.

✅ audio control

There is no auto-play audio.

✅ contrast

Janeway is designed so that each journal can have their own colour schemes making colour 'user-content'. We are exploring how we can support good colour contrast choices.

❌ resize text

Text resizing via page zoom is handled dynamically alongside screen width changes. This works well apart from a known issue with some header images which flow over the text.

✅ images of text

Images of text are only expected to be used for logotypes. Text is styled using CSS rather than having images of text. By design: Information and structure are separated from presentation so that different journals and presses can have unique 'looks'.

✅ reflow

Pages reflow dynamically for different screen widths.

✅ non-text contrast

Colours are user-content, see contrast above.

❌ text spacing

There are a handful of places where text overflows its container when the spacing is adjusted. There are a couple of bugs which are more likely at higher text spacing.

❌ hover or focus

Hover is not used. There is very focus use in the front end. It is used in the navigation, and for some popup elements. These were investigated in detail in #4194 and subsequently work has been defined to ensure all such items are dismissible and persistent.

Work to do

Use of Colour

• All themes contact forms A11y updates #4268

contrast

• is there a minimum contrast ratio between text and background? #3934
• Improve colour contrast A11y by defining colour pairings for text #3994

resize text

• Header overwriting logo at some screenwidths #4052

text spacing

• Text spacing audit #4260
• Readability - overriding user's prefered font #4230
• Social Media/Dyslexia Features across themes #755
• Clean theme references overflowing table of contents #4261
• Clean theme table of contents not scrolling #4264
• Material theme, DOI overflows container on change of text spacing #4265

hover or focus

• OLH Theme Navigation fixes #4225
• Material Theme Navigation Fixes #4226
• How to Cite screenreader navigation fails #4235
• When viewing an enlarged table I cannot see any way to dismiss or close it #4008