More improvements based on google page speed and gtmetrix
Hi,
Betheme scores very well in Google page speed. But I still see some improvements that are possible. Is there any possibility that the improvements below can be adjusted?
Image elements do not have explicit width and height: <img class="logo-main scale-with-grid " src="https://mywebsite.be/wp-content/uploads/2023/11/website-img…" data-retina="https://mywebsite.be/wp-content/uploads/2023/11/website-img…" data-height="48" alt="My website alt text" data-no-retina="">
There is no width="" and height="". I use logo and retina logo. W3 total cache also has problems with this. Because there is no width="" available, the website sometimes shows an image that is very small and almost invisible. I tested this by specifying a width in the code and it worked.
Values assigned to role="" are not valid ARIA roles: social menu <ul class="social" role="navigation" aria-label="social menu">
[aria-*] attributes do not correspond to their roles: cart icon <i class="icon-bag-fine" aria-label="cart icon">, language menu icon <i class="icon-down-open-mini" aria-label="language menu icon">
[id] attributes for active, focusable elements are not unique: cart icon <a id="header_cart" class="top-bar-right-icon header-cart top-bar-right-icon-cart " href="https://www.mywebsite.be/winkelwagen/">
Links cannot be crawled: I have already adjusted the scroll to top button in my child theme in footer.php by placing a # in href="" of scroll to top button. href="#" so. I don't want to make a header.php or something like that in child-theme. So I can't fix this one: nl <a class="active" tabindex="0" data-title="wpml" aria-label="Language menu icon">
I don't know which of the above can be adjusted. Maybe these are small changes for you, maybe not. And it gives a website builder a better feeling when the page speed scores become greener. Thank you in advance for your answer.
Comments
Hi,
1) The explicit width and height can be corrected by using the Regenerate Thumbnails option from Betheme -> Tools.
2) Rest should be already corrected, so ensure that you have the newest version of Betheme installed. If you are sure about it, please attach a link to your website so we can take a closer look at this.
Best regards
Hi,
I have regenerated all the thumbnails. I still get the same message in Google Page Speed.
I have the last version of betheme (Your version 27.2.10).
Here you can see the Page Speed rapport for the image and area value for social menu. https://pagespeed.web.dev/analysis/https-huisartsenvanwacht-panacea-be/0pxaujlo1q?form_factor=desktop
For the other improvements I can't share a Page Speed url because I don't have the latest version in webshop for the cart attribute and WPML crawled link in menu. I update as soon as possible and share the Page Speed for that.
1) As I can see, you are using WPBakery on your website.
It is not our builder, and it is responsible for adding height and width attributes to images (with our BeBuilder this problem does not appear).
In that case, you should contact the WPBakery support instead.
2) So, I am waiting for you to let me know if the update resolves this.
Best regards
Hi,
First of all, I don't know much about how this works. But I would think that the page builder starts under the header? The logo is created in PHP files such as header.php, right?
That's why I took another website as an example where wpbakery is not active and the betheme builder is used.
Theme is up to date. I regenerated the thumbnails. Here is the page speed report: https://pagespeed.web.dev/analysis/https-sottocer-eu/hkgfig90fh?form_factor=desktop
I see the same possible improvements. The social menu aria roles, image attributes for logo in header.
1) On this website, the only image that it refers to is a logo, and this can be resolved by using the Header Builder.
As you can see, none of the images from the content was mentioned here.
2) From the rest of the things you mentioned in your first message, I noticed only this one:
I passed it to the dev team, and we will correct it.
Best regards
1) I was also talking about that logo in the header. So that can only be done properly with the header builder? Because now I use the general theme options. As mentioned, I have already tried to change this in the PHP code. And that works. But I don't know enough about it to know if this creates other problems/conflicts. That's why I leave the code unchanged. If you cannot adjust that, no problem.
2) Thank you. So this has nothing to do with Wpbakery page builder? Then you can also pass on the other improvements to the dev team? I think putting a # in the href of the scroll to top button is just a minor change? + aria attribute for cart icon,...
1) Technical barriers prevent us from correcting that for layouts from theme options, but in the header builder, it is correct.
2) This part from the screenshot is not WPBakery related, only the image width and height are related to it.
And indeed, we will correct that in future updates.
Best regards
1) OK no problem.
2) Great! I look forward to it. Thanks.
Thank you for fixing the aria role on social menu in update 27.2.11.
I have a website with woocommerce and the latest version of betheme. I can now prove the 2 errors for the cart icon in the menu as I said at the beginning of this discussion.
So it concerns these two errors:
[aria-*] attributes do not correspond to their roles: cart icon <i class="icon-bag-fine" aria-label="cart icon">, language menu icon <i class="icon-down-open-mini" aria-label="language menu icon">
[id] attributes for active, focusable elements are not unique: cart icon <a id="header_cart" class="top-bar-right-icon header-cart top-bar-right-icon-cart " href="https://retail.tast-toe.be/winkelwagen/">
Here is a link to Google Page Speed report and website:
https://pagespeed.web.dev/analysis/https-retail-tast-toe-be/7y1a2j83el?form_factor=desktop
https://retail.tast-toe.be/
Don't mind the other mistakes. This website is under construction. Can you address these errors? Thanks in advance for viewing this
I contacted the dev team about this as well, and we will take a look at this.
Best regards