This just made me realize that while I do have focus on my key sites, there are so many selectable elements that it's usability is bad due to chaos. Recently a popular design pattern for content teasers is to render them as cards that are wrapped with an A link element so that the entire card is selectable and clickable.
I like that for accessibility reasons, but is it possible to make that entire card element selectable for those using focus indicators, but not for people clicking with a mouse? I want to retain the option of having clickable links within the teaser content that's not crucial to the experience so I'd want to sacrifice that option for access using readers.
This just made me realize that while I do have focus on my key sites, there are so many selectable elements that it's usability is bad due to chaos. Recently a popular design pattern for content teasers is to render them as cards that are wrapped with an A link element so that the entire card is selectable and clickable.
I like that for accessibility reasons, but is it possible to make that entire card element selectable for those using focus indicators, but not for people clicking with a mouse? I want to retain the option of having clickable links within the teaser content that's not crucial to the experience so I'd want to sacrifice that option for access using readers.
I like these two resources. They are what you're looking for.
inclusive-components.design/cards/
nomensa.com/blog/how-build-accessi...