I encourage you to think about and make sure you are using the right elements at the right time. Sometimes I overthink this, but that’s because it’s that important to me - I want to make sure that the markup I use helps people understand the content, and doesn’t hinder them.
Léonie makes a really good point here: if you’re adding aria attributes to indicate interactions you’re making available through JavaScript, then make sure you also use JavaScript to add those aria attributes.
When to use aria-hidden="true", and when you might need display: none:
aria-hiddenby itself is not enough to completely hide an element from all users, if that is the end goal.
When to use role="presentation" (or role="none"):
Where
aria-hiddencan be used to completely hide content from assistive technology, modifying an element’sroleto “none” or “presentation” removes the semantics of the element, but does not hide the content from assistive technologies.
I love these kinds of deep dives into one seemingly simple pattern; in this case it’s a download link with the humble A element.
A useful primer on which combinations of attributes and values work best for which form fields: type, autocomplete, autocorrect, and autocapitalize.
A guide to using ARIA roles from the mighty Steve Faulkner.
Useful markup statistics from Google, complete with snotty commentary.