Home page loading - showing text first, then images

[meachv]

When I first go to my store home page, for a very quick microsecond it looks like all the header text flashes quickly right before all the picture load. It seems like its probably taking a microsecond for the images to load so for that moment you see the headers text on the page. Even though I went through every single one of my images and optimized them for the web. Is there something recommended I can do so that my page loads more professionally so that the home page immediately shows up with everything and doesn't do the weird text flash? 

page is skyislandjewelry.com

Is this something only fixable with an app?

Thank you!

[kazi]

Hello @meachv  It seems any js/css file loading issue. Hire any shopify developer to fix it.

[oscprofessional]

@meachv 

Theme Upgrade :

Its benefits include improved loading speeds, which can help with both user experience and store conversion rates, and search engine optimization. 

Refer to this blog : 

https://www.oscprofessionals.com/shopify/improve-your-shopify-stores-speed-performance-score-by-upgr...

We’ve had the best success for our clients by working with our developers to implement the lazy sizes because it's quite complicated for non-technical people.

You need to work on the following points :

• Theme Upgrade if there is a scope and upgraded theme available
• Reduce JS Payload.
• Use Critical CSS.
• Replace GIFs With Static Images
• Reduce Large Image Sizes
• Migrate Tracking Codes To Google Tag Manager
• Compress Images
• Limit Third-Party JavaScript & Shopify Apps
• Preload Web Fonts. 
• I suggest limiting it to one and using a standard web font.

By fixing these issues, your website speed score can definitely improve.

For more details please check the link below. 

https://www.oscprofessionals.com/blog/shopify-speed-optimization-guide/

If anything needs to be included or clarified then feel free to ask.  We will surely help you. 

Have a nice day!

[flareAI]

Hello @meachv,

Good day! Gina from flareAI app helping Shopify merchants get $5Million+ in sales from Google Search, on autopilot.

The issue you're experiencing with the text flashing on your Shopify store's home page could be due to several factors, including slow server response time, large images, and the order in which the elements of the page load.

To improve the loading speed of your Shopify store's home page and prevent the text flash, here are some steps you can take:

1. Optimize your images
Although you've optimized your images for the web, you may want to check if there are any images that are still too large in file size. Use an image optimization tool to compress your images further without losing quality.

2. Minimize HTTP requests
The more requests your website makes, the longer it will take to load. Consider minimizing the number of HTTP requests your website makes by combining CSS and JavaScript files.

3. Use lazy loading
Lazy loading is a technique that defers the loading of images until the user scrolls down to the section where the image is located. This can help speed up the initial loading time of your page.

4. Prioritize above-the-fold content
Make sure that the content that appears above the fold (the part of the page that is visible without scrolling) loads quickly. This can be achieved by optimizing images, reducing HTTP requests, and minifying CSS and JavaScript files.

By implementing these steps, you can improve the loading speed of your Shopify store's home page and prevent the text flash. These steps can be done without using an app, but if you're still experiencing issues, you may want to consider using a Shopify app that specializes in optimizing page speed.

Let me know if you have any further questions.

Gina