search

web-illinois / toolkit

This library provides styles and web components for creating branded UIUC websites.
18 stars 7 forks source link

Footer - Social Media Icons #132

Closed mwllr closed 3 years ago

mwllr commented 3 years ago

The social media icons do not have an aria label which makes them blank.... Please tag Keith if possible.

Screen Shot 2021-07-13 at 2 49 01 PM
bryanjonker-illinois commented 3 years ago

Sent a note to Keith

This is concerning https://github.com/web-illinois/toolkit/issues/132

The social media links don’t have ARIA labels, but they do have text inside the links that refer to the social media platform. These are hidden using the overflow, so they should be available to screen readers. Based on this, do we need ARIA labels, or would that be extra noise? Thanks.

khays9 commented 3 years ago

If there is text content in the link, then adding ARIA labels would be redundant. That being said, an ARIA label on a link will cause any text inside that link to be ignored, so it won't cause an issue. Note that text added via the CSS content element is not reliably read, so it would be better to use the ARIA label instead.

In the code snippet above I don't see where there is any text--is it down in the shadow dom?

bryanjonker-illinois commented 3 years ago

Ah -- yeah, I think that was an old version. Basically, whatever the person puts in the slot is what we're going to put into the footer. Here is how it currently looks at https://cdn.brand.illinois.edu/toolkit/dev/examples/components/footer/default/index.html

image

If this looks OK, I'll close this ticket. Thanks.

khays9 commented 3 years ago

That code looks good to me. I second that we close the issue.