[Support request] Settings in Customizations that fail Google Lighthouse Test

Home Forums Support [Support request] Settings in Customizations that fail Google Lighthouse Test

Home Forums Support Settings in Customizations that fail Google Lighthouse Test

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1681991
    Terry

    I have a number of sites using GeneratePress which I am trying to reach the 90 score in Google Lighthouse Test. In the customization setting GP sets the width of the Logo not the height this isn’t easily fixed in the child web. Would you consider making this change in your next major update? IME, that would likely also make it easier to position other objects in the header. I also strongly suggest putting CSS, JS, and other elements that can be moved from the head to the footer preferably just before the <body> tag or better still inline. I’m currently moving <scripts> to the footer in the functions file of the child theme, however, CSS requires moving them 1 at a time which bloats code. GP definitely performs the best of all the themes I’ve tested so far and the option to combine CSS indicates that a lot of thought has already been put into making this theme fast and easy to use. I realize there is some controversy about this since Google is basically using their ranking stick and carrot to speed up crawls and lower their bandwidth costs. I really like this theme and I am making these suggestions to give the users and developers of this theme a heads up on some possible issues as we tune sites to pass this test which in May will become a ranking factor much like HTTPS, Mobile Friendly and page speed. Thanks for a great theme and plugin!

    #1683473
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    1. The logo width option is there for display purposes of the logo only. It doesn’t actually resize the logo file. It’s useful for SVG images or images that are uploaded larger than what you want them to display as (2x).

    The best thing to do here is to size the logo yourself, then upload the correct size. That correct size could be 100% of what you want it to show as or 200% which would allow you to reduce the size using the option above for better quality (2x).

    2. CSS should ideally remain in the <head>, as if you move the wrong CSS to the footer, it will cause CLS issues. To prevent too many render-blocking scripts, a plugin like Autoptimize is recommended.

    All theme javascript should load in the footer by default.

    The combine CSS option is a bit of an old one. If you switch the structure to “Flexbox” in “Customize > General”, it will automatically combine your CSS. There are also various other performance benefits to this.

    Hope this helps! Appreciate the feedback!

    #1683495
    Terry

    Thanks Tom re: logo the issue is the test requires width, height and alt attributes currently the theme only includes width and alt which defaults to “Awesome Logo” which are the only values provided in the Customization settings. I assumed height wasn’t included in source because GP does not have the value to set the attribute. Having height, width and alt on images definitely performs better and is required to validate HTML.

    #1684742
    Tom
    Lead Developer
    Lead Developer

    Width and height attributes should be included. Are you using the Flexbox structure? I believe we made the change there but not in the Floats structure for back-compat reasons.

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.