Missing or incorrect ARIA attributes

How to fix

1. 1

   Add basic ARIA roles

   html

   <!-- Main navigation -->
   <nav aria-label="Navigation principale">
     <ul>...</ul>
   </nav>
   
   <!-- Toggle button (burger menu) -->
   <button aria-expanded="false" aria-controls="menu-principal">
     Menu
   </button>
   
   <!-- Dialog / modal -->
   <div role="dialog" aria-modal="true" aria-labelledby="dialog-title">
     <h2 id="dialog-title">Titre de la modale</h2>
   </div>

2. 2

   Dynamic ARIA states with JavaScript

   javascript

   // Update aria-expanded on toggle
   const btn = document.querySelector('[aria-controls="menu"]');
   btn.addEventListener('click', () => {
     const expanded = btn.getAttribute('aria-expanded') === 'true';
     btn.setAttribute('aria-expanded', String(!expanded));
   });

3. 3

   Use accessible themes

   Look for themes with the "Accessibility Ready" label on WordPress.org. They respect ARIA standards by default. Avoid page builders that often generate inaccessible HTML.