Hi, I’m part of the team behind https://deckaura.com/. I’d like to request specific UX and accessibility feedback on an interactive card-reading page. This would not be a promotional post or a backlink request, and I would clearly disclose my affiliation.
The questions would focus on mobile usability, the clarity of the card-selection flow, accessibility, and how responsibly the entertainment disclaimer is presented. Would it be acceptable to include the page link in the Design & UX category for this purpose?
Given that there appear to be a few UX and accessibility issues worth discussing, I’m going to pass this one.
Just to get started you may want to consider the W3C’s guide on accessibility menus. This is the simpler disclosure pattern.
In this implementation the enter key can be used to open up sub menus and cursor keys can be used to select sub menu items. In your implementation of the main navigation there is no way to access sub menu items using the keyboard — hitting enter just takes you to that main category.
Focusing on items is not clear.
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
outline: 2px solid rgb(var(--color-primary, 0, 0, 0));
outline-offset: 2px;
}
--color-primary doesn’t exist. Personally I would change this color to red temporarily and tab through your pages to see how clear the selections are. In some cases, in one of your accordion menus, the outline is hidden by the containing element having an overflow: hidden.
That’s just a couple of things I spotted.