So I worked for 3 hours on what I thought was an overloaded or badly coded section of this site. The pages were transitioning with what appeared to be a re-load. Normally if a background image and a header logo has been loaded once, the transitions are smooth and you do not see them load again. This section was jittering after every link.
Most of my searching led to suggestions that had to do with optimizing, and other clean up chores which I started to do anyway. Things like joining my external style sheets into one, etc.
The crazy Solution?
It turns out instead of positioning my striped background image center top, I had it positioned center 5px…
I wanted a little space between the top of the browser window and the top of the stripe. I made the change not convinced. I was on the verge of taking my many images and converting from .png to low quality .jpg and dreading it.
It worked! Beautiful smooth transitions and I can move on!
Of course I brought the background into Photoshop and just added that needed space on top and problem solved. Every day a new trick.
I am excited to finally be re-making my site so that I have a place to document some of my discoveries. The hard Googled tricks that save the day.