Wednesday, September 18, 2019
Bernard Watch is one of the most respected names in fine Swiss timepieces online. They are based in Austin, TX but serve online customers around the world. Their customers are looking for high-end watches and need a great user experience to accompany this large-ticket purchase.
Bernard Watch timepieces are meticulously detailed and have high resolution photographs to show their quality. Unfortunately, these images have the downside of slowing down web page loading.
Bernard Watch needed a solution to accelerate image loading without sacrificing image quality.
Here is what they found.
“Mobile users are important and represent more than 50% of our visitors. ImageEngine helped us deliver higher visual quality images while also cutting image payload by 80%. With this one change, we instantly reduced page load time. And best yet, I could set it and forget it so I could focus on other web marketing and operating issues.”
VP of Technology and Operations, Bernard Watch
Bernard Watch carries a wide range of high-end timepieces, with brands like Rolex, Panerai, IWC, and Ulysse Nardin. High resolution images of each timepiece frequently had a size of 200kB each. And with pages holding 10 or more images, the overall page size frequently exceeded 4MB. This page size resulted in poor performance as both mobile and desktop users waited more than 10 seconds for pages to load.
Bernard Watch sells to customers around the world. They needed a website experience that maintained high quality, 24 hours per day, 7 days per week. With heavy pages, the initial loading was frequently too slow.
They also are frequently adding new watches. Between both new watches and past sales, Bernard Watch manages over 10,000 images. With new watches frequently joining the website, Bernard needed a solution that would streamline their image management process. Bernard Watch needed a simple solution so they can focus on their core business of selling high-end watches and the customer service that requires.
Previously, Bernard Watch used the Cloudflare Content Delivery Network (CDN) that did not have a focus on image optimization. So Bernard Watch, investigated several image CDN and image management vendors.
Bernard Watch tested ImageEngine’s resizing CDN service to address their image acceleration challenges. ImageEngine is unique because it seamlessly combines three services.
Second, ImageEngine leverages this device information to automatically resize, compress, and convert images to next-gen image formats (WebP, JPEG 2000) in real-time. It optimizes only when images are requested. ImageEngine also caches images, so there is no need to resize them for subsequent requests from identical devices.
Third, ImageEngine uses its global image CDN with device-aware edge servers. This means that ImageEngine’s logic is pushed to the edge of its global network. Images are cached as close to customers as possible, resulting in a 30% faster mobile and a 50% faster desktop Google page speed score.
As part of of the account set up process, Bernard Watch pointed ImageEngine at the source directory of the images. With one small change, ImageEngine started optimizing and delivering images.
In addition, they changed the way they process images for the website. Previously, Bernard Watch had limited use Adobe Lighthouse to automatically limit each individual image size to a maximum of 150k. This limited the quality of the images. Since ImageEngine will take the master image and dynamically reduce image payload by up to 80%, Bernard Watch decided to start with higher quality master images. They increase their maximum size for master images by 33%. The net result was that the final image delivered to users was both higher visual quality and dramatically smaller payload.
Bernard Watch reduced their total image payload, which improved performance and lowered CDN costs. Originally, total image payload was 568 GB per month on BernardWatch.com. After implementing ImageEngine, BernardWatch.com delivered only 100 GB of images per month, which was a huge reduction of 82% savings.
An increasing proportion of Bernard Watch’s visitors are using mobile devices. 58% of visitors are on smartphones, and a large proportion use iPhones. Therefore, ImageEngine’s ability to optimize specifically for the Safari browser on iPhones is crucial. For these visitors, ImageEngine converts the images to JP2 (JPEG 2000). The result is 82% savings on JP2 image format payload.
Likewise, ImageEngine was able to deliver images from its edge server cache more than 98% of the time. This means no delays caused by going back to the origin source and re-optimizing images. By serving optimized images from the cache of it edge servers, Bernard Watch was able to reduce page load time by several seconds.
ImageEngine’s simplicity and ScientiaMobile’s 24/7 support made this roll-out quick and streamlined. ScientiaMobile’s support team not only helped ensure a smooth transition during implementation, but they also helped Bernard Watch later on as they started to focus on optimizing more for mobile.