Read the latest about Imagery clients and our perspective on the world.
Why You Should be Concerned About Page Weight← back
At the risk of sounding like a broken record, it has become obvious that mobile devices are quickly taking over how we manage our day-to-day lives. With this takeover comes the concern of making websites “mobile friendly.” There are many ways in which people are accomplishing this - mobile apps, mobile websites, or responsive design (which is quickly becoming the most popular of the three).
There is really no wrong way to go about getting your website served to a user in a mobile friendly way, although each way I listed above has its own purpose (which is something you need to figure out before deciding which way you want to go) – but that’s a conversation for another time. What I would like to discuss is page weight, also referred to as page speed, or “page load time."
To start – what is “page weight?” When someone is talking about “page weight,” what they are referring to is the size of all of a web page’s files that a user’s device has to download in order to render it on their viewing screen. This may include HTML, CSS, scripts, images, videos, etc. The more you have of each, or the larger each file is, the greater the page weight will be for your webpage.
Why does this matter? More is never a good thing in terms of a website - especially for file sizes, images, and all around page weight.
Take a look at the average 3G connection of a cell phone for example. Let’s say (based on carrier averages) that internet speeds on a 3G connection are 2.5Mbps (that’s megabits per second). Now we take the average web page weight (based on these stats from Radware) of 1795KB or 1.795MB (that’s megabytes). Our 1.795 megabyte webpage translates to 14.36 megabits. Now we divide our 14.36 megabits by our 2.5 megabit connection speed, which equals 5.744. So for an average web page it will take around 5.744 seconds to load on our 3G connected device – and that is not taking into account server response time. According to a variety of studies, users start to abandon a website at 4 seconds of waiting. This may seem like a short amount of time, but when a user is browsing on their phone, it is more than likely that they are in a hurry and looking for quick and instant gratification.
How do you prevent people from abandoning your website? Simple - serve up a lighter page. Are huge background images necessary on mobile? Is a slider? Try to eliminate some of these image elements because they are what weigh the most on a website. In my opinion, a web page should be no more than 1.5MB in size, and even smaller for a mobile version (think 1MB or less – yes, it’s possible). Just for fun, how about we take a look at the numbers on load time for a 1MB page on a 3G connection. Our 1 megabyte translates to 8 megabits. Divide 8 by our 2.5Mb connection and we have 3.2 seconds for the page to load. This is a decent load time and is just before the 4 second abandonment mark, which reduces the risk of losing visitors.
Say your image is 250KB and you have 4 of them on your slider. That’s 1MB in images on the slider. On a 3G connection, those slider images will take over 3 seconds to load, which isn’t accounting for the rest of the page!