How to speed up your online store?

More and more reports and analyses show that the majority of website visitors are mobile channel users. The e-point and Google report also says that this is reflected in the Google search engine itself. The data show that last year the number of queries from mobile phones was twice as high as from computers. Unfortunately not all entrepreneurs take this into account when designing their websites.

During Mobile Trends Conference 2022 two specialists from mobile industry spoke, who are the authors of the audit of 50 Polish online stores. Piotr Kowalski from Google discussed 5 recommendations for improving user experience of mobile website, while Michał Szklarski from e-point suggests 5 ways to speed up loading your portal.

In the introduction of the document, we can read that Google commissioned a study from French research and consulting firm IPSOS. The resulting data shows that Poles are on average in more than seven shopping processes at once. This is a special feature because it means that we shop everywhere: while riding the streetcar, standing in line, in bed or at work. Such optimistic information for sellers, however, needs to be confronted with reality, as ca. 70 percent. Polish customers abandon the shopping cart without making the final conversion. A big culprit for this is user experience, but also the technological limitations of cell phones. Smartphones have up to six times smaller work surface area, which makes navigation much more difficult. A serious design obstacle is also the lower computing power of such devices, resulting from weaker processors, graphics cards or operating memory. Sometimes the network connectivity is unreliable, and additional frustrations are provided by badly designed page scripts or bad loading settings of individual elements of the mobile version of the store.

Improve CLS

If we talk about improving CLS then let’s answer the question what is this indicator at all. Cumulative Layout Shift one of Core Web Vitals elements responsible for visual stability of the page during loading. According to SEO specialists this is one of the most important indicators, because it has a real impact on the evaluation of the service in the Google PageSpeed Insights tool. This tool checks optimality of loading a given website. In addition to the technical aspects, it is worth realizing that the lack of optimized CLS is not just about failing a test in a tool. On the other side of the screen there are angry consumers, who may never want to use our store again. As invette points out.pl this indicator should not exceed the level of 0.1, it requires us to Google.

What working on CLS means in practice? With optimization in mind, we need to define a specific size for our images in the HTML code. Michal Szklarski argues that setting precise and HTML-tag-defined width and height for image elements <img> reduces layout offsets and tag loading. So we have a situation in which on a mobile phone the largest elements load first, after which smaller ones appear. The elements are then adjusted to fit the device screen.

According to research, the majority of Polish stores do not have a precise size defined, which causes uneven loading of the site, especially its graphic elements. To fix this you need to define and override the width (‘width’) and height (‘height’) parameters in the right image sets.

Problems with CLS were reported by as many as 82%. of the researched webshops.

Get rid of the old Javascript

The person responsible for the document used a very fitting word here, namely – revising. According to PWN it is a search of premises, persons etc. A search is a search for evidence of criminal acts in a case. It is no different in this case. Google doesn’t like unnecessary junk in its field. Auditors recommend removing or otherwise optimizing unused JavaScript code. This is to reduce the amount of data transferred in the client-server relationship.

This is particularly important, because the lack of such optimization causes another failure in loading the website, which sometimes can cost the user additional tens of seconds of irritation. It is recommended to reconsider the need to continue using outdated JavaScript, and to compress all JavaScript resources. An additional way out of the situation may also be to optimize traffic during operation, thanks to CloudFlare class solutions.

Problems with outdated JavaScript were present in 75% of. e-commerce sites examined.

Cache Longer

The cache allows quick access to data stored on the device, separating it from RAM, says Morele.net. Website harbingers.io makes us aware that cache is responsible for storing data needed when the browser views the page. This is important due to the fact that thanks to this memory based on very fast (and very expensive) nanotechnological semiconductors, the device does not have to download the same data from the web every time. The browser is able to retrieve them from the cache. Another tip for improving the loading speed of our website is to extend the cache storage period. This results in a much greater availability of data for the page. Specialists ensure that the fixed elements of the web portal can be easily stored on the user’s device. The result will be no need to read the page over and over again on each subsequent visit. Apart from shortening the loading time, it is connected with saving mobile data needed for information transfer.

The audit of websites showed that a large part of resources loads with a maximum cache time of 0 to several days, which is not mandatory with little changeable website resources. It is therefore recommended to increase the caching time of permanent resources to as much as 12 months or even longer.

A short caching period was encountered in 65 percent of e-commerce sites surveyed.

Make text visible during font loading

Contrary to what you might think, fonts are usually large files, and loading them can take a while. There are browsers, which do not show the user any text until the fonts are loaded. Then we have the FOIT and FOUT phenomenon. This factor did not cause page-loading problems, but it dramatically affected CLS by “breaking up user attention,” reports the report. As we can guess, this can affect a fairly low level of positive customer experience. It is recommended to replace old fonts in TrueType Font formats with new fonts in Web Open Font Format formats. Furthermore, web store owners should consider implementing the CSS “font-display” feature, which allows you to see the text as it loads.

The problem with old fonts was experienced by over 60 percent. of audited stores.

JS optimization

Researchers remind us that too much of an accumulation of solutions on a site can overload the site’s servers, which greatly affects the site’s loading speed. Of course, in the era of competition and building technological advantage, having a system of marketing automation, virtual assistants or rankings may prove crucial to gaining and keeping new customers. However, there is no need to throw the baby out with the bathwater. An optimal solution that doesn’t deprive our website of much-needed conveniences may be to reduce the time it takes to parse, compile and execute JS code. This may also be important because many of the JavaScript scripts are not consistently used and tested.

High-performance JS scripting affects the overall length of the website loading and significantly decreases the user experience by prolonging the process. A few seconds longer according to the audit drastically reduces the potential for conversions. Developers call for leaning into JS scripting a little harder. You need to analyze your needs and optimize your Javascript for usability and proper functioning. It may be a good practice to divide scripts into smaller fragments, which will be more flexible in loading. More than 55% do not cope with this angle. of the companies surveyed that sell online.

The m-commerce market is not easy. A huge number of competing players, algorithms constantly lurking from around the corner and customers whose expectations are increasing day by day. The efforts put into marketing and refining your offer may prove to be ineffective if your website does not meet the visual expectations of your customers or they simply get tired of waiting for it to load. After all, competitors’ sites take three seconds less to load. UX and usability of a website are nowadays as important as marketing, sales or logistics. Good first impressions, the ergonomics of the site, as well as solutions that make the site easier to use, are the most important factors in increasing conversions. It is especially important for people with disabilities, who do not need to see our store or be able to move their fingers. The main conclusion of the research is that users demand from the store that the content should appear on the screen with immediate effect, and the interactions should not cause any problem. The more we do to optimize our web resources, the fewer customers we will lose, and perhaps the more we will gain.