Accessibility First DevRel. I focus on ensuring content created, events held and company assets are as accessible as possible, for as many people as possible.
I am enjoying this deep dive into HTML elements and attributes (although it is scattered across other series....it is a shame they don't let you add articles to two different series on here so I can keep track of them!)
I have almost finished my <abbr> piece I promised you a couple of weeks back, I would expect that to land next week some time.
We could have a good discussion on point 10, the problem here is if you have information for a caption, you can add an alt attribute so this guidance doesn't work in the real world, this is often an issue with WCAG. This one is particularly tricky as if it is user generated content do you add alt="user generated content" or alt="no alt text given" or just leave it as an empty attribute as it adds no value to a screen reader user? What makes it worse is that some older / obscure screen readers will read the file name and path if an alt attribute is omitted and you really don't want that!
The point on imagining you are describing the image on the phone is a great one! I am stealing that one 😁
The other thing to consider is that when writing your alt text, context matters an awful lot.
If you are writing an article about cheese then a picture of a cheese board with cheese, ham etc. should have a different alt attribute text than if the article was about planning a dinner party (first alt text would focus more on the cheese types on the board accompanied by ham, bread etc. The second would describe it as a cheese board with finger food including cheese, ham, bread etc.) Probably not my best example but you get the idea!
The final consideration is alt attributes should be short and succinct. If you feel there is need for added information you may want to use aria-describedby to add much more info for example or another suitable method.
Anyway, finally realised I hadn't followed you yet so have a ❤🦄 and a follow from me, I look forward to the next instalment!
I am enjoying this deep dive into HTML elements and attributes (although it is scattered across other series....it is a shame they don't let you add articles to two different series on here so I can keep track of them!)
I have almost finished my
<abbr>piece I promised you a couple of weeks back, I would expect that to land next week some time.We could have a good discussion on point 10, the problem here is if you have information for a caption, you can add an
altattribute so this guidance doesn't work in the real world, this is often an issue with WCAG. This one is particularly tricky as if it is user generated content do you addalt="user generated content"oralt="no alt text given"or just leave it as an empty attribute as it adds no value to a screen reader user? What makes it worse is that some older / obscure screen readers will read the file name and path if analtattribute is omitted and you really don't want that!The point on imagining you are describing the image on the phone is a great one! I am stealing that one 😁
The other thing to consider is that when writing your
alttext, context matters an awful lot.If you are writing an article about cheese then a picture of a cheese board with cheese, ham etc. should have a different alt attribute text than if the article was about planning a dinner party (first alt text would focus more on the cheese types on the board accompanied by ham, bread etc. The second would describe it as a cheese board with finger food including cheese, ham, bread etc.) Probably not my best example but you get the idea!
The final consideration is
altattributes should be short and succinct. If you feel there is need for added information you may want to usearia-describedbyto add much more info for example or another suitable method.Anyway, finally realised I hadn't followed you yet so have a ❤🦄 and a follow from me, I look forward to the next instalment!
Thanks a lot for your comments! I want to incorporate your comments into the article, but I haven't had time...
I've just written another article, this time on landmark roles and their consequences on the use of <nav>. Let me know what you think. ;-)