Skip to content

Take 22% off using code GET22. Hurry, ends soon!

Web Accessibility Toolkit for WordPress
Get Started

Menu ARIA Labels

Menu ARIA Labels automatically apply aria-label attributes to links in your WordPress navigation menus when the Title Attribute is set and differs from the visible link text. This improves how screen readers interpret your menu by offering clearer, more descriptive labels.

This setting is especially useful when your link text is brief — such as “Home” — but you want screen reader users to hear something more informative, like “Go to homepage”.

What accessibility issue does this fix

Without additional labeling, screen readers simply announce the visible text of a link — which might be too short or lacking in context. Relying on the HTML title attribute alone is unreliable, as most screen readers do not announce it consistently.

By using aria-label, you ensure assistive technologies provide a more descriptive and accessible experience.

This helps address WCAG 2.1 Success Criterion 2.4.4 – Link Purpose (In Context) (opens in new tab), ensuring that links are understandable when read out of context.

How does Menu ARIA Labels affect accessibility

With this feature enabled:

  • Any menu link with a custom Title Attribute that differs from the visible link text will be given an aria-label attribute automatically.
  • This label is announced by screen readers instead of the shorter or ambiguous visible text.
  • Users with assistive technology gain more context and clarity as they navigate your site.

Without it:

  • Menu links with short or unclear text may confuse users.
  • The Title Attribute may be ignored entirely by screen readers, reducing its accessibility value.

Example:

If your menu has a link like:

<a href="/about" title="Learn more about our company">About</a>

ARIA & Accessibility Toolkit will convert it to:

<a href="/about" aria-label="Learn more about our company">About</a>

This ensures screen readers announce: “Learn more about our company” instead of just “About”.

How to enable Menu ARIA Labels using Web Accessibility Toolkit

  1. Go to Settings > Web Accessibility.
  2. Open the ARIA tab.
  3. Scroll to Menu ARIA Labels.
  4. Select the navigation menus you want to enhance.
    • The plugin will look for menu links that have Title Attributes that differ from their visible text.
  5. Click Save Changes.

Tip: If the “Title Attribute” field isn’t visible in the Appearance → Menus screen, click “Screen Options” at the top and check the box for it.

How to confirm that Menu ARIA Labels is working

  1. Visit the frontend of your site.
  2. Right-click a menu link and choose “Inspect” to open browser DevTools.
  3. Look for links where the aria-label attribute has been added:
    • It will only appear if the Title Attribute exists and is different from the link’s visible text.
  4. Optionally, test with a screen reader to confirm that the longer label is announced instead of the short visible text.

Limitations

  • No aria-label will be added if the Title Attribute is missing or identical to the link text.
  • This only works on links within WordPress nav menus selected in the plugin settings.
  • Free version supports 2 menus — upgrade to PRO for unlimited.