[Athen] Flip Cards in Canvas

[Monica Olsson]

Hi Heather,

The way my inbox is filtering ATHEN email is awful right now, so I don' have a good sense on the response you have already received. I want to echo Dan Comden's sentiment here. You don't need to know much about HTML or CSS to do a very basic accessibility/usability audit of the flip card tool for Canvas. Instead, use your keyboard. Set your computer mouse far away from your computer or unplug it! After you open up the flip card tool, use your keyboard to see if you can navigate the keyboard's focus appropriately around the flip card's elements, and then test to see if you can use your keyboard to "flip" the card.

WebAIM Keyboard Testing<https://webaim.org/techniques/keyboard/#testing>

I am guessing you may encounter roadblocks, sadly, which will indicate accessibility issues. Just today I was on a call with a vendor about the flip card design they use in their LMS. It is not accessible and I'm advocating they remove it entirely and provide us an alternative accessible way to interact with the content.



[Title: SBCTC logo - Description: Compass]

Monica M. Olsson (she/her/hers)

Policy Associate – Accessible IT Coordinator

Washington State Board for Community and Technical Colleges

•Email: molsson at sbctc.edu<mailto:molsson at sbctc.edu> • Phone: 360-704-3922



The power of the Web is in its universality.
Access by everyone regardless of disability is an essential aspect.

Tim Berners-Lee, W3C Director and inventor of the World Wide Web

[cid:07c9ca0f-cba8-4e8c-9425-480e78f099e9]<https://outlook.office.com/bookwithme/user/321a279c65664c04a18fa34a96e959ab@sbctc.edu?anonymous&ep=signature>                Book time to meet with me<https://outlook.office.com/bookwithme/user/321a279c65664c04a18fa34a96e959ab@sbctc.edu?anonymous&ep=signature>
________________________________
From: athen-list <athen-list-bounces at mailman12.u.washington.edu> on behalf of Dan Comden <danc at uw.edu>
Sent: Thursday, June 22, 2023 2:17 PM
To: Access Technology Higher Education Network <athen-list at u.washington.edu>
Cc: The EDUCAUSE IT Accessibility Community Group Listserv <EDUCAUSE-ITACCESS at connectedcommunity.org>; WebAIM Discussion List <webaim-forum at list.webaim.org>
Subject: Re: [Athen] Flip Cards in Canvas

[Sent from outside SBCTC]

Can't speak to the accessibility of this specific Canvas widget, but keyboard testing is something most anyone can do.

Check out nomouse.org<http://nomouse.org> for more details.

Make sure the same functionality for mouse users is present for keyboard-only folks.

-*- Dan



On Thu, Jun 22, 2023 at 1:08 PM Heather Mariger <heather.mariger at chemeketa.edu<mailto:heather.mariger at chemeketa.edu>> wrote:
Greetings,

I apologize for the cross posting (I need all the help I can get)...

I have a faculty member who wants to use flip cards in Canvas. He found this article: Create CSS Flip cards in Canvas<https://urldefense.com/v3/__https://www.howtocanvas.com/theme-editor/flipcard__;!!K-Hz7m0Vt54!jGpW6nBeNIE4998Ztm4cEw5tAl9tfMByozWvdhXQbGo4DaOjXCnAIWUtoURvQUr2SKu0W03bVF2H82Sf_1mH4kSxtepsYvGQcA$>

While I have a very basic understanding of CSS and HTML, I am in no way qualified to determine if this technique is fully keyboard accessible (I rather suspect not).

So, I am reaching out to you brilliant people to ask if these instructions are actually accessible or if you know of a way to make accessible flip cards in Canvas.

Thanks so much!
H.




Heather Mariger
Digital Accessibility Advocate
Pronouns: She/Her

Center for Academic Innovation
Chemeketa Community College
4000 Lancaster Drive NE - 9/126A
Salem, OR 97305

503.589.7832

*****************
Diversity is being invited to the party; inclusion is being asked to dance.
Verna Myers, author and speaker

[https://ci3.googleusercontent.com/mail-sig/AIorK4wz2gxtvjQyMTpC_0WG-EazWKiKpKpBmV7xR5EAWQiTKtGrsvFIo9MV_3-jAopcCt5HPEuWGpw]

_______________________________________________
athen-list mailing list
athen-list at mailman12.u.washington.edu<mailto:athen-list at mailman12.u.washington.edu>
http://mailman12.u.washington.edu/mailman/listinfo/athen-list
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://mailman12.u.washington.edu/pipermail/athen-list/attachments/20230630/c5c007a2/attachment.html>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: Outlook-Title_ SBC.png
Type: image/png
Size: 22672 bytes
Desc: Outlook-Title_ SBC.png
URL: <http://mailman12.u.washington.edu/pipermail/athen-list/attachments/20230630/c5c007a2/attachment.png>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: Outlook-pyob5uea.png
Type: image/png
Size: 528 bytes
Desc: Outlook-pyob5uea.png
URL: <http://mailman12.u.washington.edu/pipermail/athen-list/attachments/20230630/c5c007a2/attachment-0001.png>