Hi All,
I am getting following issues on accessibility issue,
I have added unique ID’s for all the HTML elements which are showing in the list, still these issues are appearing.
can someone please help me to solve this.
Thanks in advance.
Do you have an URL for your site (or any other hints that could help understand your problem)?
Are you using any 3. party scripts that injects HTML?
Are you using any SVG files with IDs?
Thanks for response Johannes
Yes using 3rd party scripts for HTML and also using SVGs with ID.
For my sites, I’m using cookieinformation.com script, and the markup injected to the site is not of the best quality. So empty anchor tags and non-unique IDs are created. This is detected by the accessibility tool.
Also, my tooling for SVGs does some optimaization that makes the IDs short, often one letter only. This is also detected by the accessibility tool.
For now, I have not given it any time to look into.
Okay, so we don’t have solution for this right ?
Depends on your setup, you need to share more details about your problem to clarify.
If you see the following elements having unique Ids still I am getting this error
IDs Of Active Elements Must Be Unique
Fix any of the following: Document has active elements with the same id attribute: submemenu-beauty<a id="submemenu-beauty" class="text-md-12 text-sm-12 text-xs-12" href="#" aria-label="Beauty">Beauty</a>
Fix any of the following: Document has active elements with the same id attribute: submemenu-shoes<a id="submemenu-shoes" class="text-md-12 text-sm-12 text-xs-12" href="#" aria-label="Shoes">Shoes</a>
Fix any of the following: Document has active elements with the same id attribute: submemenu-moncler<a id="submemenu-moncler" class="text-md-12 text-sm-12 text-xs-12" href="#" aria-label="Moncler">Moncler</a>
Fix any of the following: Document has active elements with the same id attribute: submemenu-sachin-and-babi<a id="submemenu-sachin-and-babi" class="text-md-12 text-sm-12 text-xs-12" href="#" aria-label="Sachin and Babi">Sachin and Babi</a>
Fix any of the following: Document has active elements with the same id attribute: submemenu-valentino-garavani<a id="submemenu-valentino-garavani" class="text-md-12 text-sm-12 text-xs-12" href="#" aria-label="Valentino Garavani">Valentino Garavani</a>
Fix any of the following: Document has active elements with the same id attribute: submemenu-new-in-<a id="submemenu-new-in-" class="text-md-12 text-sm-12 text-xs-12" href="#" aria-label="New in ">New in </a>
Fix any of the following: Document has active elements with the same id attribute: submemenu-best-sellers<a id="submemenu-best-sellers" class="text-md-12 text-sm-12 text-xs-12" href="#" aria-label="Best sellers">Best sellers</a>
Fix any of the following: Document has active elements with the same id attribute: submemenu-undefined<a id="submemenu-undefined" class="text-md-12 text-sm-12 text-xs-12" href="#"></a>
Fix any of the following: Document has active elements with the same id attribute: submemenu-new-in<a id="submemenu-new-in" class="text-md-12 text-sm-12 text-xs-12" href="#" aria-label="New in">New in</a>
Fix any of the following: Document has active elements with the same id attribute: submemenu-dining-entertaining<a id="submemenu-dining-entertaining" class="text-md-12 text-sm-12 text-xs-12" href="#" aria-label="Dining & entertaining">Dining & entertaining</a>
Fix any of the following: Document has active elements with the same id attribute: submemenu-home-decor<a id="submemenu-home-decor" class="text-md-12 text-sm-12 text-xs-12" href="#" aria-label="Home decor">Home decor</a>
Fix any of the following: Document has active elements with the same id attribute: submemenu-pet-accessories<a id="submemenu-pet-accessories" class="text-md-12 text-sm-12 text-xs-12" href="#" aria-label="Pet accessories">Pet accessories</a>
Fix any of the following: Document has active elements with the same id attribute: submemenu-jewelry-storage<a id="submemenu-jewelry-storage" class="text-md-12 text-sm-12 text-xs-12" href="#" aria-label="Jewelry storage">Jewelry storage</a>
Fix any of the following: Document has active elements with the same id attribute: submemenu-technology<a id="submemenu-technology" class="text-md-12 text-sm-12 text-xs-12" href="#" aria-label="Technology">Technology</a>
Then just fix that your IDs should not be equal, so if you have id="submemenu-home-decor" once in your code, you should not have the same id elsewhere. Are you using the IDs for anything, or can they just be removed?
That I had already done,I had given unique ID’s to every HTML elements but still this issue is appearing in accessibility issues section.
Then you need to share a URL, because that issue would only be detected if the ID exists elsewhere in the markup. But consider if the ID is needed after all, do you use it for anything?
I’m having a problem with the LACWebServices website, which I’m fixing for a client. But someone else worked on this site before me, so it’s difficult for me to find the cause of the problem.