3 ms·

FYI, the gravatar images don't load on my browser because I have Firefox's content blocker enabled. The alt-text "The user's avatar" is showing in a bunch of pl

FYI, the gravatar images don't load on my browser because I have Firefox's content blocker enabled. The alt-text "The user's avatar" is showing in a bunch of places, and on the project list it overlaps with the project titles. I'd recommend: * Replacing "The user's avatar" at the top with the user's name. * On the project list, just setting the alt-text to "". Otherwise: nice site.

StavrosK 7y ago
Ah, thank you, but removing the alt-text would be bad for accessibility. It is meant for visually impaired people, after all. Maybe setting the title would fix this, I'll look into it, thank you!
- laken 7y ago
  The alt-text "The User's Avatar" is worse for accessibility than an _empty_ alt-text (not no alt-text, empty alt text). Alt-text is to describe non-decorative images that add meaning. The parent commenter is correct on how you would implement accessible alt-text here. In the top, your avatar is meant to to represent a link to your profile. That needs an alt attribute. The alt attribute should be the current user's name, "Your Profile", or something similar. When signed out, something like "Sign In" might work better. In the featured projects, the avatar that's there is decorative. The litmus test for decorative images is that if the image wasn't there, would you be able to easily figure out what to do? The image is purely decorative, as the creator's name is adjacent to it. There you would add an empty alt tag, like `alt=""` (not the same as no alt text), as screen-readers know to ignore that image then.
  - StavrosK 7y ago
    I see, thank you, I'll change them then.
    - laken 7y ago
      No problem! Alt text is super confusing if you don't do it often, and there's a lot of untrue assumptions out there about it :) I highly recommend this page by WebAIM on it: https://webaim.org/techniques/alttext/ https://webaim.org/techniques/alttext/
      - StavrosK 7y ago
        This is extremely useful, thank you!

StavrosK 7y ago

Ah, thank you, but removing the alt-text would be bad for accessibility. It is meant for visually impaired people, after all. Maybe setting the title would fix this, I'll look into it, thank you!

laken 7y ago
The alt-text "The User's Avatar" is worse for accessibility than an _empty_ alt-text (not no alt-text, empty alt text). Alt-text is to describe non-decorative images that add meaning. The parent commenter is correct on how you would implement accessible alt-text here. In the top, your avatar is meant to to represent a link to your profile. That needs an alt attribute. The alt attribute should be the current user's name, "Your Profile", or something similar. When signed out, something like "Sign In" might work better. In the featured projects, the avatar that's there is decorative. The litmus test for decorative images is that if the image wasn't there, would you be able to easily figure out what to do? The image is purely decorative, as the creator's name is adjacent to it. There you would add an empty alt tag, like `alt=""` (not the same as no alt text), as screen-readers know to ignore that image then.
- StavrosK 7y ago
  I see, thank you, I'll change them then.
  - laken 7y ago
    No problem! Alt text is super confusing if you don't do it often, and there's a lot of untrue assumptions out there about it :) I highly recommend this page by WebAIM on it: https://webaim.org/techniques/alttext/ https://webaim.org/techniques/alttext/
    - StavrosK 7y ago
      This is extremely useful, thank you!