Bad code
<a href="/contact" aria-label="If you find that you need additional
assistance in navigating or accessing the content of this website,
please call our customer service toll free number 1-800-666-8654309" title="If
you find that you need additional assistance in navigating or accessing
the content of this website, please call our customer service
toll free number 1-800-666-8654309">
Contact
</a>
<a href="/login" aria-label="If you find that you need additional assistance in navigating or accessing the content of this website, please call our customer service toll free number 1-800-666-8654309" title="If you find that you need additional assistance in navigating or accessing the content of this website, please call our customer service toll free number 1-800-666-8654309">
Login
</a>
Issues and how to fix them
aria-label
, aria-labelledby
, etc. must not be misused for dumping contact information or other unrelated content.- Text in a link must describe the purpose or the target of the link.
- The visible label of an element should match the accessible name.
- Information concerning accessibility should be on a dedicated page (e.g. an accessibility statement) and/or the contact page.
- The
title
attribute shouldn't be used for important contact information due to inconsistent browser support and lack of accessibility. - Redundant link text should be avoided.
Good code
<a href="/contact">
Contact
</a>
<a href="/login">
Login
</a>