White Flashing going to next page

Site URL: https://www.securview.com

Hi.  

On my site when using Chrome or Edge browser, when you jump to different pages there is a slight delay in loading images.  For half a second all the text loads but there is a white background on the page. It happens to fast that it's got like a flicker effect.

I did some research and it might have to do with how the browser loads the page and any javascript.  

Personally I can live with it, but my company wanted me to find a solution.  

If I can't control the speed in which this loads, can i at least change the temporary background color to black to prevent this "flicker" appearance?

Is this CSS code or javascript?  where do i insert such code?  what is the actual code?

Code isn't going to help a loading issue, what you might look first is the file size of your images, not the size of the image on the site itself. If you can reduce the file size and re-upload that is the number one thing that helps with slow loading. 

Hmm I had saved my images with "save to web" option on photoshop.  My understanding I thought was whatever you uploaded to squarespace, they would optimize the file and compress for you automatically.  But i guess theoretically the larger the original file, the larger the compressed version will be?

But again, how do i change my background color?  If i can't resolve my images, if i have a black flicker instead of a white one, that'd be ideal.

I would think so, and I find that they are never compressed much, reducing the pixel size of the original image is much better solution. I will say this, I find your loading speeds to be rather typical, but a bit more noticeable due to the high contrast of your banners, not that bad though compared to an all single or low contrast color site.

I have seen blocks shift as well, depending on coding and other things, but not on your site. 

@sansari Here's a tutorial to change the color of the "flash"

https://beatrizcaraballo.com/blog/loading-background

@whitney.revoir this is a solution for 7.0 template any idea how to do this on 7.1 version.

Thank you

On 12/28/2021 at 5:45 PM, GSolo said:

@whitney.revoir this is a solution for 7.0 template any idea how to do this on 7.1 version.

Thank you

Try adidng this to Design > Custom CSS

.section-background {
	background-color: white !important;
}

If it doesn't work, please share link to your site, we can check easier

I have the same problem! Can't figure it out, did you solve it?

I have the problem also. My site is mobiusloop.com

On 9/27/2023 at 6:21 AM, GabrielleB said:

I have the problem also. My site is mobiusloop.com

You try adding this code to Website Tools (under Not Linked) > Custom CSS

body {
	background-color: #3d5273;
}