Accordion accessibility problem
Hi,
I've been notified of an accessibility issue on this page: https://italpizza.com/consumatore/
Problem: The two forms on this page are managed via accordion, but once inside, it's impossible to exit without closing them.
Screenshot: https://userway.it/hubfs/screenshots-per-report/Italpizza/6_italpizza.png
Is it possible to check?
Comments
Hi,
just checked both forms and I'm able to exit both without closing them.
I also have another question: I'm told the account login isn't being read correctly, even though it appears to be usable via keyboard.
Screen: https://userway.it/hubfs/screenshots-per-report/Italpizza/2_italpizza.png
Affected code: <circle class="path" cx="13" cy="9.7" r="4.1"></circle>
Solution: Rewrite the link text so it's meaningful, describing what the link points to. Alternatively, place the <a> element around existing text that's meaningful. For example, replace: For details on NASA's Mars program, <a href="nasa.gov">click here</a> with: Visit the <a href="nasa.gov">Mars program page on the NASA website</a> for details.
Can you help me fix this?
The <circle> tag is part of the SVG, and the whole SVG is placed in the <a> tag with a title provided:
Everything seems to be fine here for me.
Best regards
OK, I also need help with another question.
I'm told that the popup to access the customer area is navigable by keyboard, but only after all other elements on the page.
Screen: https://userway.it/hubfs/screenshots-per-report/Italpizza/5_italpizza.png
Solution: Ensure that the visual order of the content matches the order of the content in the source code, as present in the DOM. The tabindex attribute can be used, with due care, in special cases.
Could you help me solve this?
Should not it be accessible by entering it by clicking "enter" just like for the submenus?
It is how it works at the moment.
If you would be so kind to provide more details about this.
Thanks
I'm sending you the code affected by the problem:
<form class="woocommerce-form woocommerce-form-login login" method="post" action="https://italpizza.com/mio-account/" data-hs-cf-bound="true">
<p class="form-row form-row-first">
<label for="username">Nome utente o indirizzo email <span class="required">*</span></label>
<input type="text" class="input-text" name="username" aria-label="Username" autocomplete="username">
</p>
<p class="form-row form-row-last">
<label for="password">Password <span class="required">*</span></label>
<input class="input-text woocommerce-Input" type="password" name="password" aria-label="Password" autocomplete="current-password">
</p>
<div class="clear"></div>
<p class="form-row">
<label class="woocommerce-form__label woocommerce-form__label-for-checkbox woocommerce-form-login__rememberme">
<input class="woocommerce-form__input woocommerce-form__input-checkbox" name="rememberme" type="checkbox" value="forever"> <span>Ricordami</span>
</label>
<input type="hidden" name="woocommerce-login-nonce" value="ced205a73d"><input type="hidden" name="_wp_http_referer" value="/">
<input type="hidden" name="redirect" value="">
<button type="submit" class="woocommerce-button button woocommerce-form-login__submit" name="login" value="Accedi">Accedi</button>
</p>
<p class="lost_password">
<a href="https://italpizza.com/mio-account/lost-password/">Password dimenticata?</a>
</p>
<div class="clear"></div>
</form>
Thanks, but it is not what I asked for.
Please provide more information on what the problem is and how you suggest it should be resolved.
Best regards
I've attached a video demonstrating the problem.
When logged in, account features are only accessible after all other elements on the page have been accessed. This needs to be resolved.
Thanks
Please send us the WordPress dashboard and FTP access privately through the contact form, which is on the right side at https://themeforest.net/user/muffingroup#contact and we will check what might be the reason.
Notice!
Please attach a link to this forum discussion.
Sending incorrect or incomplete data will result in a longer response time.
Therefore, please ensure that the data you send are complete and correct.
Thanks
Good morning,
I've just sent the requested logins. Please keep the last email valid; the first contained errors.
Please don't make any changes to the site, as it's live.
Please let me know in advance what type of changes are needed.
Thank you.
I have checked that and it works fine for me despite being logged in or not, and I do not have to go through the entire page. See the following video I recorded:
Are there any extra steps to reproduce this?
Best regards
Hi,
For testing, we usually use NVDA as a screen reader on Windows systems, one of the most widely used in the industry, while on Mac we rely on the built-in VoiceOver player.
We also recommend using these tools to verify that the implemented solutions are well integrated into the site.
At the moment, I understand the error persists.
Awaiting updates.
I have installed NVDA, and I was able to reproduce that.
We have an idea on how it might be corrected, but we must check that.
I will inform you regarding this.
Best regards