Pagespeed accessibility errors (last update)

Hi there @nunowp,

Thanks for reaching out. I understand your concern about accessibility errors in Google page speed insights for your mobile pages.

Before we can proceed with further troubleshooting, have you noticed any changes in your mobile site after having updated your theme? When I say changes, I mean, does the site design look any different from how it was prior to updating the theme?

This way, it will help us understand if the issues are true or rather false positives.

Looking forward to your reply.

Hello @ckadenge
Thank you for your reply.

I haven’t made or noticed any changes to the layout, I just applied the latest update to woocommerce and your theme.

I test the site regularly and it was just after these updates. Only if the test is having some problems, but it’s been going on for about a week.

Hey, @nunowp!

I checked my website, which uses the Storefront theme, and I was able to see this issue: “Touch targets do not have sufficient size or spacing”?https://imgbb.com/1dGZhqG

I’ll report this so our team can take a look, thanks for bringing this to our attention! ??

However, I was not able to see this error “Elements use prohibited ARIA attributes”?https://ibb.co/28yhQKd on my site. I even switched the language to Portuguese (since the error seems to be about a tag called Próxima Avalia??o”, which I believe is in Portuguese, right?

It is possible this part is added by a plugin. So I would like to take a closer look on your website.

Can you please share the System Status Report which you can find via WooCommerce > Status > Get system report > Copy for support and leave the URL so we can take a look?

Looking forward to your reply.

Have a wonderful day!

Hello @carolm29,
Thank you for your reply.

Regarding the error “Elements use prohibited ARIA attributes”, by chance it appeared on the homepage where I have the trustindex reviews plugin.

However, I tested it on a product page and I don’t have this plugin active there and the error also appears.
Can you test it on a product page? I suspect it’s not the plugin. Thank you

• This reply was modified 6 months ago by nunowp.

Hello nunowp

Thank you for your reply.

I have checked the product page on my test site that has Storefront as active theme.
But could not find the “Elements use prohibited ARIA attributes” issue.

I also tried searching for the element with a class “ti-next” in the source code of the page but this element is not present on my test site.

In the screenshot you shared, this element appears to be a Greater Than symbol >.

It would be helpful if you could share the link to a product page on your site.
I will inspect it, find out this element’s location, and check the aria-label added to it.

Looking forward to your response. ??

Best regards.

Hi,

The “Aria” error has been resolved, apparently it wasn’t related to the theme.

At the moment, the error that persists in mobile is:

“Touch targets do not have sufficient size or spacing”?https://imgbb.com/1dGZhqG

Thanks

Hi @nunowp

The “Aria” error has been resolved, apparently it wasn’t related to the theme.

That’s great to hear! Thanks for letting us know.

Touch targets do not have sufficient size or spacing”?https://imgbb.com/1dGZhqG

The team is already aware of this issue: https://github.com/woocommerce/storefront/issues/2151

At the time being, we can’t give you an estimate for when the team will look into or fix the issue, as bug reports are prioritized based on a few criteria. Please subscribe to the GitHub issue if you’d like to receive updates.

Meanwhile, you can try increasing the size of the clickable elements and/or the space around them. This can usually be done by adding custom CSS.

I hope this helps! Please let us know how it goes or if you need further assistance.

Hi @shameemreza,

Thank you for your reply,
I understand the priority. However, the 3 bottom bar icons in mobile (account, search and cart) are already quite large, so I have no idea what code to put in. I also can’t compare with the previous version of the theme (which didn’t have the error).

Do you have any suggestions?

It seems that the problem is related to the mobile search box. As I use the “Advanced Woo Search” plugin for this purpose, I deactivated this box with this custom code and it was solved.

.storefront-handheld-footer-bar ul li.search .site-search {display: none;}

I hope I’ve helped.

Final result ??

https://ibb.co/Fsh0Vpx
https://ibb.co/sRS9hZP

Hello nunowp

Thank you for your reply.

I am glad to know that you have resolved the issue.

https://ibb.co/Fsh0Vpx
https://ibb.co/sRS9hZP

These Google Pagespeed results are very impressive.
Excellent work there.

I appreciate your step in sharing the solution here with the Woo community.
It will help many people. ??

Have a great day!