If I have:
<h2> Edit your details <a href="/help?topic=editDetails"> <img src="/images/helpIcon.gif" width="20" height="20" alt="Help about: Editing your details" /> </a> </h2>
Is the heading accessible?
A heading list generated by AT would include the link text, this sounds like a reasonable thing to do.
The link in the example above contains only an image, so the image's alt text may be used instead, so I understand. Does this make the heading more difficult to understand?
I suppose the help icon could be taken outside of the element. I'm just wondering if there's any real issue here.
EDIT : To make it clearer, these are the variations of how it may appear in a browser:
If the image is available:
VS. If the image is not available:
Could this formulation of the help feature pose a problem for a user understanding the action?
The scenario where the icon's alt text is (visually) displayed to the user is also valid, but I'm not sure that matches my question. I don't think the user will not understand the help icon, but the heading. I'll explain further:
I have found this graphic which demonstrates how HTML Headings are presented to users of JAWS (screen reader for visually impaired users):
Such users will often navigate a HTML page using the headings to start the reader reading from the heading they're interested in.
I'm concerned that the Help Icon may cause the meaning of the heading to be confusing and therefore it's probably not ideal to put a link/icon inside a header element.