Re: { Flip Cards - Hover/Focus }

Hi Caroline,

usually we think about screenreader users when trying to avoid problems for people with disabilities.

But especially for people that tend to get dizzy, these things can be a real problem – especially if they are using the keyboard and there are several rows of flip cards, then the whole page is scrolling, things are turning around (when jumping from one to another first one goes back in “closed state”, next one opens.

I myself are getting problems with such kind of styling (also parallax scrolling and so on), when I have to work for more than a few minute with a page like this: for example for testing it. This is really difficult for me (it comes with age, by the way…)

Also this is very distracting for everyone (especially for people with learning disabilities).

Flip cards should be used only in small numbers – if at all. And never ever combine them with parallax scrolling effects – even if the WCAG allows it: this is a real problem for a lot of people. There is an interesting video on Youtube from a ID24 contribution you might be interested in

https://www.youtube.com/watch?v=j9o4DkXh2OU


Marc



From: caroline <woodward.caroline@gmail.com>
Date: Tuesday, 18. August 2020 at 01:27
To: "w3c-wai-ig@w3.org" <w3c-wai-ig@w3.org>
Subject: { Flip Cards - Hover/Focus }
Resent from: <w3c-wai-ig@w3.org>
Resent date: Tuesday, 18. August 2020 at 01:22

Hi all,
What your thoughts are on the accessibility of flipcards.

The scenario I have in mind is when the title of the flipcard is initially displayed but flips over to reveal details when it gains focus or the user places their cursor over it.

What I don't like about it is that if the user magnifies their screen and doesn't use a screen reader that they don't have the opportunity to see what is initially displayed on the front and would have to undergo the exercise of navigating off and moving back on to obtain the details.

With text, there is a simple solution of including the title from front to the content that appears when the card id flipped. However, we have had a scenario where high level data was on the front of the flipcard and displayed a breakdown when the user hovered over it. I was able to push for the interaction to be initiated by the user pressing the enter/space key, instead of being triggered by the hover, but wondered if I could have approached this item differently.

Thanks for your thoughts :)