4 ms·

Ha! Thanks for catching that! I think that demonstrates how difficult it is to make even a simple website accessible. I assumed that since my browser's "reader

Ha! Thanks for catching that! I think that demonstrates how difficult it is to make even a simple website accessible. I assumed that since my browser's "reader mode" was all good, then screen readers would know how to parse it too. I do like the heart aesthetic, so how exactly would I make it more accessible?

graypegg 3y ago
role="presentation" will remove it from the a11y tree! Easy fix. Most browsers will notice the characters in the element are not human readable and make some tweaks to make "heartheartheartheartheartheartheartheart" less likely though, even in the current version!
- surprisetalk 3y ago
  Thank you! I added it.
  - graypegg 3y ago
    In case you're maybe interested, I wrote up a little thing about how I think of accessible interfaces and designing for them: https://graypegg.com/2023/11/25/the-private-definition-of-accessible.html https://graypegg.com/2023/11/25/the-private-definition-of-ac... Edit: decided to post it here, https://news.ycombinator.com/item?id=38683774 https://news.ycombinator.com/item?id=38683774
    - deleted 3y ago
      [deleted]
  - devinprater 3y ago
    Thank you!
jwarren 3y ago
Depends - do you want screen readers to hear something? If so, add a `aria-label="heart"` or similar. If not, add `role="presentation"` to remove it from the accessibility tree altogether. You might also want to change the element from a `header` to something else, like a `div` or a `span` or even a `figure` instead. Then put "potato.cheap is home of the... The "Cheap" Web" inside the `header` instead.
varispeed 3y ago
The problem is that accessibility has been treated as an afterthought, so designers, UX and people crafting HTML usually are not in habit of embedding accessibility into their works. It often comes when someone disabled complaints or if there is a regulation they didn't know about and there is "oh sh..." moment where accessibility is tacked onto already done project. So it's difficult in the sense that people don't think about it, there are not so many tutorials available and so on.
- graypegg 3y ago
  YES. I think it's this unique form of after thought, where people imagine accessibility as a "score" that you can "increase". The web developer lowest-common-denominator cares about it, but only at this weird surface level. More aria tags = more accessibility points. It becomes this weird game where we end up with insanely noisy markup, which creates a horrible described interface for anyone actually using assistive technology. It's an interface like any other. We'd be weirded out if designers graded their screen specs as "visual" enough. More pixels are required in this area, think of our screen users! They need more pixels!

graypegg 3y ago

role="presentation" will remove it from the a11y tree! Easy fix. Most browsers will notice the characters in the element are not human readable and make some tweaks to make "heartheartheartheartheartheartheartheart" less likely though, even in the current version!

surprisetalk 3y ago
Thank you! I added it.
- graypegg 3y ago
  In case you're maybe interested, I wrote up a little thing about how I think of accessible interfaces and designing for them: https://graypegg.com/2023/11/25/the-private-definition-of-accessible.html https://graypegg.com/2023/11/25/the-private-definition-of-ac... Edit: decided to post it here, https://news.ycombinator.com/item?id=38683774 https://news.ycombinator.com/item?id=38683774
  - deleted 3y ago
    [deleted]
- devinprater 3y ago
  Thank you!

jwarren 3y ago

Depends - do you want screen readers to hear something? If so, add a `aria-label="heart"` or similar. If not, add `role="presentation"` to remove it from the accessibility tree altogether. You might also want to change the element from a `header` to something else, like a `div` or a `span` or even a `figure` instead. Then put "potato.cheap is home of the... The "Cheap" Web" inside the `header` instead.

varispeed 3y ago

The problem is that accessibility has been treated as an afterthought, so designers, UX and people crafting HTML usually are not in habit of embedding accessibility into their works. It often comes when someone disabled complaints or if there is a regulation they didn't know about and there is "oh sh..." moment where accessibility is tacked onto already done project. So it's difficult in the sense that people don't think about it, there are not so many tutorials available and so on.

graypegg 3y ago
YES. I think it's this unique form of after thought, where people imagine accessibility as a "score" that you can "increase". The web developer lowest-common-denominator cares about it, but only at this weird surface level. More aria tags = more accessibility points. It becomes this weird game where we end up with insanely noisy markup, which creates a horrible described interface for anyone actually using assistive technology. It's an interface like any other. We'd be weirded out if designers graded their screen specs as "visual" enough. More pixels are required in this area, think of our screen users! They need more pixels!