week11y issue 153

Your weekly frequent11y newsletter, brought to you by @ChrisBAshton:

Everyone Watches TV with Subtitles Now. How’d That Happen?

I thought this article was interesting to call out, as in my experience we still often assume captions should be an ‘opt in’ thing. But perhaps things have pivoted to them being ‘opt out’. Indeed, some captions are now ‘on’ by default on social media.

In a 2022 survey of 1,200 people, language learning company Preply determined that 50 percent of Americans used subtitles and closed captions the vast majority of the time they watch content.

According to Preply, 57 percent of all Americans watch shows or movies or videos in public on their mobile devices, but a very significant 74 percent of Gen Z do the same. Even if you’re (hopefully) using headphones while in public, it’s likely you’re getting poor audio quality… subtitles are practically a necessity.

The article also cites ‘habit’ as one of the main reasons. People are simply more used to using subtitles; the article cites that in 2020, nearly 30 percent of on-demand streaming was for non-US shows.

Finally, there are some modern technical issues that could explain why hearing dialogue is more difficult:

For some, the problem is the design of modern televisions; the majority of which place internal speakers at the bottom of the set instead of facing towards the audience, causing significantly worse audio quality. Other issues are caused by sound designs optimized for theatrical experiences, which can result in compressed audio when translated to home.

Become an accessibility champion by using simple mockup annotations

“Accessibility annotations” detail interaction design behaviours in UI designs. They communicate the intended experience for keyboard and screen reader users, allowing developers to implement the design just as they would implement a visual one. This speeds up the design QA and development process, but also ensures designers have thought about accessible interactions from the start.

The article shows screenshots of some annotated designs, with symbols clarifying the intended focus tab order of a component, or call-outs to screen-reader-specific text. Even the underlying semantics – whether a list should be ordered or unordered, for example – are clarified with markup annotations.

There is also a Jira ticket template “to facilitate design accessibility review discussions while reviewing the visual mockups”.

The article links to Deque’s downloadable accessibility annotations toolkit, which has files for Adobe Illustrator and Sketch as well as individual SVGs.

The difference between Increased Contrast Mode and Windows High Contrast Mode (Forced Colours Mode)

Martin Underhill describes Increased Contrast Mode (ICM) – a setting that users can opt into, and which website designers/developers can accommodate through a media query:

@media (prefers-contrast: more) {
    /* High contrast styling goes here */

Not a lot of people know about this, or they don’t have it high on their list of priorities. It’s utterly reliant on the website creator to support.

Windows High Contrast Mode (WHCM), on the other hand, is a ‘forced colours mode’. It doesn’t rely on the website creator, and instead forces the chosen theme onto the website. It has a well supported media query like ICM, but only allows a handful of carefully selected things to be styled:

@media (forced-colors: active) {
    /* WHCM styling goes here */
    /* Limited to things like text colour, background colour and keyboard focus outline colour */

Martin has made the decision to not attempt to define styles for WHCM users, instead delegating this to the user’s operating system. It should mean they have a more consistent/familiar experience, and it will automatically support their choice of dark or light theme.

Did you know that you can subscribe to dai11y, week11y, fortnight11y or month11y updates! Every newsletter gets the same content; it is your choice to have short, regular emails or longer, less frequent ones. Curated with ♥ by developer @ChrisBAshton.