Making the web as wide as the world - Can web images make the world a little greener?

Making the web as wide as the world - Can web images make the world a little greener?

Philippe Vella | 16 days ago | 7 min read | in user-experience

Picture the average commuter sitting on a bus to work. Phone in hand, head focused straight down, scrolling through their social feed, favorite sites or images on their phone. You can visualize it because you see it all the time. Now, multiply it by 3.5 billion… that’s the number of smartphones in the world right now.

While not everyone fits this stereotype on their daily commute - or in fact, at the bus stop, walking in a crowded place or even at the cinema - the fact that a reasonable chunk of us spend a lot of time looking down at our devices, gives an inkling as to how much online browsing takes place every second of every day. What does this screen time mean for data consumption, energy usage and carbon emissions?

Worldwide Data Consumption.

Global data consumption is around 12,000 terabytes every second. As the transfer of each gigabyte of data produces 3kg of CO₂, global data consumption therefore contributes almost 37,000 tonnes of CO₂ every second. That’s equivalent to the energy use of 4,270 homes for a whole year, or almost 8,000 cars.

Every. Single. Second. Every. Single. Day.

It’s safe to assume that our consumption habits won’t change, so these numbers will only increase. Is it possible to reduce emissions through less data consumption? Is there a way to do it intelligently, efficiently and effectively? Perhaps the simplest solution is… use less data?

A world with LESS data?

Before the straitjackets arrive and we’re dragged away, let’s make an analogy between data consumption and the automotive industry.

The average distance each car can travel on a tank of fuel has increased 250% since 1978, with most of that improvement coming since 2010. In the same period, the CO₂ emissions of the average motor vehicle dropped significantly. While this slows the contribution cars make to emissions, the total number of cars worldwide is increasing. What is the result? We get more from less. If data really is the new oil, we need to start getting less from more with data.

We’re not expecting for a minute that consumption habits should change. For all the distractions and productivity apps we use, we know that isn’t going to happen. In fact, the amount of time each of us spend staring at a screen will probably increase. Available products and services providing immediate, cloud-based access to just about anything, at any moment will become more common. 5G will make mobile browsing a breeze. But that doesn’t mean data consumption will go with it. A 2013 article in Science Daily claimed that 90% of the world’s data had been created in the previous two years. If the same truth holds today, then the numbers must be staggering.

Cleaner, more fuel efficient cars < leaner, more efficient apps and web images

Think about the average page on the average ecommerce site. Filled with images and suggestions for other products which “you may like”. It won’t surprise you to learn that web images make up 65% of what we refer to as ‘web bloat’; in other words, the majority of time lost when loading this page, and most of data passed to your connected device in that moment, is due to web images.

Photo by Tommy Krombacher on Unsplash
Photo by Tommy Krombacher on Unsplash

That’s because images tend to remain static: uploaded to the cloud at a certain dpi/resolution/size and never altered. When browsing sessions occur on a page such as this ecommerce example, that file is presented to the user in close to its original form. The code which delivers the image may alter its placement within the text, responsive images may adapt to the resolution or a layout such as a portrait or landscape view on phones… but most of the time it’s the same size file and therefore the same amount of data. Not to mention that slight hiccup you get when a page is loading and you click a link, but in the instant you clicked it the page moves and you’ve accidentally chosen the wrong link… That’s caused by images.

Find out more about Lazy Loading and Best Practices for web images

Why do web images slow down pages and what can be done?

Why do web images cause web bloat? Because current web technologies cannot handle the volume and disparity of connected devices globally and also don’t adjust for the variability of connection most people experience. Even pages which are carefully and have inbuilt responsive images are constructed as if every user has the ideal device and the best connection, whereas the opposite is more commonly the case.

Until now, web building tech focused on the builder, not the end-user. Ease of deployment and developer experience have been priorities for devtech for much of the history of the web. User experience is a oft-heard mantra which focuses on best-in-class, not the needs or variabilities of billions of users.

But, there is a better way.

There is technology which can alter that experience no matter the location, connection or device and deliver the best possible experience to each and every user in real-time. And in doing so, save massive amounts of data exchange and therefore processing power and energy consumption. How? The power of images.

Data savings and effect on emissions with Images.

To deliver a better user experience, save bandwidth and therefore processing power, we need to start using web technologies which customize user experience. For images, this means cropping and compressing web images in real-time based on device and connectivity. In this way, not only can web professionals help deliver the best possible online user experience, faster site speed for their customers and optimized content quality, they’ll also save enormous amounts of data transfer and thus energy consumption.

Since TwicPics went live with our first customer in May 2019, we’ve saved around 5 Petabytes for our customers and their users. This equates to approximately 94% bandwidth saved, which means without Twicpics, our customers would have contributed an additional 15 tonnes of CO₂, or almost half the amount currently being contributed every second.

Photo by Pankaj Patel on Unsplash
Photo by Pankaj Patel on Unsplash

That’s a saving in CO₂ emissions equivalent to more than 16,000 return flights between London and Dubai.

We’re a reasonably small business thus far, so this is just the beginning. In the year and a half since we launched, we’ve tripled the bandwidth we’ve saved. If we keep this rate of growth until the first milestone of the Paris agreement in 2025, we will save almost half a million tonnes of CO₂, the same as removing 90,000 cars from the road for a single year.

Of course, we didn’t create TwicPics to save the planet or reduce data wastage. Far from it. But technology can be at the service of both UX and the environment; we want more browsing, just with a win-win and improved experience for everyone.

We want to remove complexity and constraint from image processing for the web by helping web professionals deliver the best possible experience for each and every user. We want to make the web as wide as the world, because it isn’t one size fits all. We want an egalitarian web, built by technologists… with their users foremost in mind.

The Simplest, Most Powerful Way to tackle Responsive Images