Hello,
My site is https://weignitegrowth.com.
When the site loads, the 2nd section is seen first.
And then the hero slider loads.
This causes my content to shift, and affects the user experience.
Can you please tell me why this is happening, and how I can fix it?
Thanks,
Poulomi
Hi Poulomi
Thanks for reaching out.
Please, try editing your Hero widget and checking that a height value has been set in the available Height setting.
Hi, I specified 600, and now it works, but my CSS on the mobile has gone all haywire. Doesn’t look like the desktop version.
Do I need to put a responsive height too?
Glad to hear you’re making progress. Yes, try setting an appropriate mobile height that works for the image and content.
Ok, working on it.
Also have another issue. When my pages load, the font looks all haywire at first.
https://imgur.com/UUe1f6J
And then it looks proper.
https://imgur.com/mI8fhgW
In the blog page:
https://imgur.com/ARJhQP9
https://imgur.com/JXIJnTS
In the menu:
https://imgur.com/XQw8KPi
https://imgur.com/klyEDxw
There is a 1-2 second gap, which is not great for the user experience. How can I avoid this please?
Thank you
Glad to hear you’re making progress. You can start out by giving Autoptimize a try. Improving site performance will help to reduce the web font load time that you’re seeing.
I already use Autoptimize, but it doesn’t help, evidently. The font size changes are all in my Custom CSS with the visual editor. Should I change that, in any way?
You try finding performance gains within the AO setup. For example, you could try Aggregate CSS-files, you could also try Inline and defer in the CSS section. Beyond performance improvements, there isn’t a specific action we can recommend. You’re seeing the theme’s CSS load and then Custom CSS and Customizer CSS load later, in order. You can reduce the visual impact of the load order by potentially improving the performance of the page.