Homepage Size - Site Speed in eCommerce - Kaizen

It’s all about size

A. The smaller, the better

It makes sense that if you’re trying to get speed up, you need to keep size down. The less there is to move from the Internet to the user, the less time it takes.

As mentioned and analysed earlier in this article, the eCommerce sites looked at in our study were bigger on average than other webpages out there – a whole 35% bigger, at 3.1 MB, compared to a global standard of 2.3MB.

eCommerce websites size
eCommerce websites size eCommerce websites size

Bigger size of the eCommerce websites can be usually explained by larger and more frequent images, videos and the ubiquitous need to track every single click and hover of a potential customer.

Average bytes per Page by Content Page
Average bytes per Page by Content Page Average bytes per Page by Content Page

B. Format, compress, minify

One of the biggest issues on plus-sized websites is pictures. Unless they’re compressed and resized to suitable formats, they can be over-large and slow page speed to a crawl.

The solution to that problem explains itself – compress and resize – but less obvious fixes can be found in using the appropriate file type. The .png format assigns each colour in an image a number, making files smaller if they’re in block colouring and simple – like infographics, illustrations and icons.

But for photographs, with a wide number of colours and much finer details, .png can compromise the quality of the image. You might consider using .jpg files instead. Another alternative is also using .WebP, an open source image type format from Google, which supports both lossy and lossless compression. (currently only supported by Google Chrome)

Using correct size, unscaled images manually can be quite a daunting task for web developers. This is where PageSpeed modules from Google can come in handy, and automate many of the tasks necessary for successful site speed optimisation. See more here: Google Pagespeed module

Format: PNG
Dimensions: 1200x879
Size: 24KB
image
Format: WebP
Dimensions: 1200x879
Size: 15KB

A smaller impact, but which is multiplied across the website, is to minify the various source codes. The CSS and JavaScript resources could be minified using tools like http://javascript-minifier.com/ and http://cssminifier.com/ into a single string/line and should save kilobytes, which otherwise would be spent on white space.

The HTML should be also as compact as possible, which still could be minified –though that could make future analysis much harder. We recommend stripping out all the unnecessary white spaces and empty lines.

Google Analytics code

Minified Google Analytics code

E
M
B
E
D