While many brands are using responsive design to create websites that deliver a consistent experience across multiple platforms and devices, mobile web developer Trilibis found that image-heavy responsive design mobile sites are taking an “unacceptable” time to load.
Evaluating page weight, images and load times for 155 prominent responsive design websites — including Starbucks.com, Engadget.com and BoldandNoble.com — Trilibis found 69 percent took four seconds or more to load on a smartphone.
Trilibis revealed only one in five of the sites it analyzed delivered a “good” load time on a smartphone, with 31 percent of the sites taking anywhere from eight to 48-seconds to load.
Responsive Design Website Smartphone Load Times:
Trilibis claims a site’s load time becomes unacceptable if a page weight goes beyond 1MB. Of the 155 sites analyzed in the Trilibis study, 61 percent delivered a home page at least 1MB in size, where images accounted for, on average, 50 to 60 percent of the site’s page weight. From the study:
While a number of factors can determine the overall weight (i.e., size in bytes) of a web page, images are generally the principle contributor. This is particularly true for responsive websites, which generally serve the same content to all devices. This can lead to overly large images being served to mobile devices.
Image Weight a Key Driver of Overall Page Weight:
The study listed the mean load time of the 155 responsive design sites at 7.95 seconds, with a median time of 5.82 seconds. Of all the responsive design websites evaluated by Trilibis, the fastest load time recorded was .54 seconds; the slowest site took 48.08 seconds to load.
In an effort to reduce the page weight of the sites, and load times, Trilibis experimented with the 64 sites whose homepage weight exceeded 1MB. By optimizing every image on each of the sites for all devices, Trilibis was able to minimize page weight on smartphones by 77 percent:
Before server-side optimization, the total image weight of all 64 responsive websites was 115MB. The image optimization process dramatically reduced the page weight for every class of device.
Average Page Weight Savings After Optimizing Images: