Safari cache problem with a frame page

[mypointofview]

Hello, I have a photography presentation page using frames and the problem is that when I advance to the next page, there's a short moment when the page is white. The problem shows in Safari.

http://tinyurl.com/4gnler

This seems like a normal thing, but I preload the next image and when I view the media page without frame there's no problem and no white moment.

http://tinyurl.com/4yxoby

Also, in Firefox there's no white moment even when viewing it with frames!

Does anybody know a workaround and why this is?

Thank you, Martin.

 

[SrWebDeveloper]

It's not horrible in Safari 3.1.2, but I see what you mean. You can't do anything with the browser cache as a developer except ask the browser not to cache (and it might do so anyway) so I think this is more about image pre-loading techiques if you need the frames.

Are you doing that with JS? Details here.

That's all you can do to speed things up in all browsers, including Safari.

Beyond that, skip the frames thing and use one of these methods instead:

1) Preload images, use a rollover effect except display each new photo in one static div (i.e. click on link on left side, calls a JS function which displays corresponding image in the div on the right)

2) Flash gallery

-jim

 

[mypointofview]

Preloading with hidden div

I preload without JavaScript by loading the next image at the same time in the body, but that picture is set to be hidden.

Regarding frames, I'd need the possibility for a user to scroll and browse through lots of thumbnails quickly (up to 100 thumbs), then be able to click on one and see the bigger image. I use this for showing the outcome of photo shoots to clients and team members. Flash is sluggish, less responsive. I also like to be able to bookmark particular images (out of frame then).

I too think strongly that this "white space" it must be related to the frame technique, since the problem is gone if the frame is not there. HOWEVER, I've checked with the developer menu in Safari, and no element of the frame is loaded (already in cache).

Isn't this strange or what? If somebody want's to help me tackle this - I'd be more than happy because most of clients use Safari ;-)

 

[angelwatt]

Regarding frames, I'd need the possibility for a user to scroll and browse through lots of thumbnails quickly (up to 100 thumbs), then be able to click on one and see the bigger image. I use this for showing the outcome of photo shoots to clients and team members. Flash is sluggish, less responsive. I also like to be able to bookmark particular images (out of frame then).

Lightbox 2 is what you want for most of that. The only tricky part is being able to bookmark an individual image. Even if each image you viewed is added to the browser history the visitor would probably hate to have to hit the back button so many times in order to go all the way back. Just think about the user experience aspect. If you can think of a good way for the visitor to indicate they want to bookmark specific image then I'll see if I can think of a way to implement it.

Also, there's plenty of clones to lightbox that will give you similar options. Just use Google to find lightbox alternatives.

 

[mypointofview]

Thanks with the tip about LightBox. I finally know now what all those sites are using. Unfortunately I never liked it. I find it clumbsy, less straight forward. Like most of this AJAX stuff... some aspects are great, but I like the "mechanical" feel of frames. I hope they don't get deprecated soon. By the way I'm making my galleries with iView, another one of those soon to be oldtimers (at least for the Mac - big Carbon footprint).

I was thinking of perhaps replacing the frame portion with the thumbnails with an iFrame that has its own scroll bar... perhaps too complex.

After all, I think my visitors can live with that "white effect" -- yet it's a beauty mark. Would be nice to have a solution... perhaps some other caching or preloading?

 

[SrWebDeveloper]

Respectfully, in my first reply I included a link that has tips and examples on both image and HTML caching which you can control.

-jim