Case Studies: Chapter 5 – M6 Optimizes Site Speed

Case study: M6 speeds up Web performance and conversions.

M6, also known as Métropole Television, is the third most-watched television network in the French-speaking world.

Alexandre Theriot, the SEO architect, explained in a blog post on Dareboost.com how he has been using Web Performance Monitoring to manage and optimize performance for various properties owned by m6. The bounce rate dropped by 25%, and the conversion rate increased by 12% along the way.

Typical for publishers, most of the sites that M6 manages have a business model based on monetizing pageviews with ad space. That requires adding many third-party scripts to register, analyze, and customize browsing for internet users. So, like many publishers, M6 is forced to add a lot of third-party JavaScript to their pages.

As Alexandre shared, on average, M6 pages will make 600 requests, weigh between 2 and 6MB, and have a fully loaded time of 20 to 45 seconds. As a result, JavaScript often represents more than 60% of the total weight of their pages. In addition to being a big consumer of requests and bandwidth, it’s also a big consumer of CPU on users’ mobile devices and growing frustration for their users that expect fast performance.

So, Alexandre and the team tried to tune the pages for speed as much as possible by implementing best practice improvements recommended by their web performance monitoring tool.  

“Without necessarily drawing up an exhaustive list of our actions, we applied these basic rules to the site:

  • Removal of unused assets, inline JavaScript and CSS elements;

  • Code coverage analysis to isolate code modules for major templates;

  • JavaScript minification;

  • Image compression and resizing;

  • Critical CSS inlining to optimize the first page display;

  • Lazy-loading of secondary images;

  • Removal of CSS background-images;

  • Optimization of usage of fonts;

  • Compression with Gzip / Deflate;

  • and Domain Sharding.

As these are mostly cosmetic items, we implemented them rather quickly. We then assessed our progress by analyzing the Speed Index in the Web Performance Monitoring tool. From the beginning, we set ourselves to drop under the 1000 mark on desktop computers.

A goal we’ve reached quickly.

 

Image: Speed improvement at M6 after optimizing the page code (left, June 2018 vs. right September 2017)

 

 

 

Step 4: Improve and balance your content strategy

When you’ve taken advantage of all the low hanging fruit for technical improvements, it becomes time to validate whether the content strategy on your landing page can also be improved.

Of course, you can’t just strip down the page to look like a website from 1995 to make it as fast as possible. So, the key questions to ask here are the following:

 

  • What content elements are engaging and persuasive should we keep vs. which other content elements are frequently ignored by users, and we should eliminate them to lighten the page load?

  • How can we help more users find the most engaging and persuasive content elements on their own so that we can eliminate pushy banners and page takeovers that negatively impact the Core Web Vitals metric for Cumulative Layout Shift?  The better we tune our content strategy, the less we need to resort to pushy modal windows, page takeovers, and interrupts.

C-SUITE cheat sheet for Core Web Vitals optimization

In summary, see the C-SUITE cheat sheet to help you approach Core Web Vitals optimization with the help of web performance monitoring.