E-mail List Archives
Thread: Web calendar
Number of posts in this thread: 2 (In chronological order)
From: Hill, Barry (Accessibility Tester)
Date: Tue, Feb 13 2024 2:31AM
Subject: Web calendar
No previous message | Next message →
Hi all
This old chestnut again. Our designers are trying to come up with a calendar/date picker for a sports site that covers two years, 12 months in arrears and 12 months in advance. The idea is that the user picks the sport, then picks a date to get details of the events on that date. Currently, they have a very basic date picker that shows one month with available dates each as an individual button in a list, but it's far from perfect, particularly for switch controllers.
Things to consider:
* Not all dates will have events on for the chosen sport. How can this be portrayed;
* The user needs to know the currently selected date;
* The user needs to be notified of the change to content on update;
* The user needs to access the calendar on each page to be able to quickly change dates;
* This needs to be usable for screen readers, screen magnification, switch controllers, and voice control.
So, any suggestions?
Many thanks in anticipation.
Cheers
Barry
Information in this email including any attachments may be privileged, confidential and is intended exclusively for the addressee. The views expressed may not be official policy, but the personal views of the originator. If you have received it in error, please notify the sender by return e-mail and delete it from your system. You should not reproduce, distribute, store, retransmit, use or disclose its contents to anyone. Please note we reserve the right to monitor all e-mail communication through our internal and external networks. SKY and the SKY marks are trademarks of Sky Limited and Sky International AG and are used under licence.
Sky UK Limited (Registration No. 2906991), Sky-In-Home Service Limited (Registration No. 2067075), Sky Subscribers Services Limited (Registration No. 2340150) and Sky CP Limited (Registration No. 9513259) are direct or indirect subsidiaries of Sky Limited (Registration No. 2247735). All of the companies mentioned in this paragraph are incorporated in England and Wales and share the same registered office at Grant Way, Isleworth, Middlesex TW7 5QD
From: jp Jamous
Date: Wed, Feb 14 2024 11:35AM
Subject: Re: Web calendar
← Previous message | No next message
Here are some suggestions:
* Not all dates will have events on for the chosen sport. How can this be portrayed;
For screen readers you can use on each button aria-disabled="true". That would announce to screen readers that it is disabled, which means no event occurs on that date. For low-vision/color-blind, you can use shapes and colors. For example, Black on White means no event and Dark Blue on white means there is an event. Add a dashed line for the bottom border of the button when there is no event and a solid bottom border when there is an event. Of course, you need to provide that explanation in text before the calendar so users know what those shapes and colors mean.
* The user needs to know the currently selected date;
Same as the above one using shapes and colors. For screen readers use aria-disabled="false", because there is an event on that date and aria-pressed="true", which would announce that the button is selected.
* The user needs to be notified of the change to content on update;
I don't follow this one. Can you provide more information? Where would the update come from? Back-end or something the user does?
* The user needs to access the calendar on each page to be able to quickly change dates;
This one is a vague description as well. Depending on how the page is designed, the calendar can be a button that would open a modal or have a calendar region present on the page. The right answer is to know how the page is designed.
* This needs to be usable for screen readers, screen magnification, switch controllers, and voice control.
What I suggested above will cover most of those. I believe voice recognition software like Dragon can detect the aria attributes. A quick google search should help.
So, any suggestions?
Many thanks in anticipation.