The 4 Key Strategies Behind The New Zeus Jones Website (zeusjones.com)
over 4 years ago from Alex Register, Designer
over 4 years ago from Alex Register, Designer
Wow, this site is beautiful.
It seems like they often load a simpler/blurred image before loading the same image in full resolution. It adds quite a nice effect and I imagine helps with user perception of loading.
Thanks Erik! You're spot on with the image loading.
Every image (with a few exceptions for really small ones) first loads a much smaller image file that's about 1/10 the size of the full image asset. The smaller image is scaled up and blurred to fit the content area, and once the high-res image is loaded and ready, the smaller blurred image fades out to reveal the high res image.
Facebook took a super similar approach with how they handle loading cover images on their mobile app. Helps avoid choppy page loads, and provides a nice transition into the content.
Designer News
Where the design community meets.
Designer News is a large, global community of people working or interested in design and technology.
Have feedback?
Login to Comment
You'll need to log in before you can leave a comment.
LoginRegister Today
New accounts can leave comments immediately, and gain full permissions after one week.
Register now