Back to articles
Blog | 21/07/2025 09:48

Eco-design at MobileThinking: Media performance

First team, first challenge: to lighten without impoverishing.

In the first article of this series, we spoke about our latest Hackathon: a whole day dedicated to web eco-design, aimed at initiating a more responsible approach to how we create digital services. No deliverables to submit. No deadlines to meet. Just a clear objective: to make our site greener and more efficient.

And for this, we have formed several small teams around targeted challenges. Here is the feedback from the first team, composed of Kevin, Mattia and Roseline, who chose to tackle an essential lever:

👉 media performance.

 

Initial Assessment 🛰

On a web page, everything that is displayed… is downloaded.
And everything that is downloaded… consumes energy.

Media (images, videos, fonts, animations…) thus play a key role in the environmental footprint of a site.

So, we began by asking the right questions:
  • Images: are they too large, too heavy, poorly compressed?
  • Videos: are they necessary? Can they be hosted differently? Played automatically or on demand?
  • Fonts: how many files are loaded? Are all the variants useful?
  • Animations & effects: do they serve a real purpose?

Identified Issues

During a working morning, quite a few questions emerged:  
  • What tools truly allow us to measure environmental impact?
  • How can we lighten the load without degrading the user experience?
  • Where lies the right balance between aesthetics, performance, and simplicity?
  • How do we collectively decide what is “useful” or not in an interface?

What we have tested 🤖

Once the blocking elements were identified, we moved on to action: 
  • Analysis tools : EcoIndex, Website Carbon, GreenIT Analysis, etc.
  • Exploring best practices : benchmarks, Frugal UX recommendations
  • Concrete experiments on our site : image formats, video weights, font loading, lazy loading…
The idea was not to “reduce at all costs”, but to reassess each media in light of its actual value.

Our improvement avenues

🔋 Here are the initial improvements implemented or identified: 
  • Images : → Move to lighter formats (WebP, AVIF) → Systematically resize according to screens → Use lazy loading and optimise preload
  • Videos : → Prefer external hosting (YouTube) → Remove autoplay → Provide a textual or visual alternative
  • Fonts : → Create custom subsets → Host locally → Activate font-display: swap
  • Animations : → Remove gimmicky effects → Keep only those that have a genuine UX or accessibility role

What we take away

Working on the performance of media is not merely a technical optimisation.

It is a profound reflection on our usage, our automatisms, and our quality criteria. It is about questioning whether each visual element truly deserves the energy it consumes.

And it is also a concrete means of gaining speed, clarity… and awareness.
 

To be continued… ✨

First challenge successfully addressed.

We are eager to embed these good practices in our projects so that they become reflexes!

To be followed: a new team, a new dilemma…
Client-side or server-side, which consumes more ? Spoiler: it is not that simple 🙈
Back to articles

Discover similar articles

news

MobileThinking becomes Dexio

blog

Eco-design at MobileThinking: Media performance

news

ULTIMO at EUCAD 2025

See all articles