Replace infinite scrolling

Infinite scrolling enables a user to scroll indefinitely on a page. This could increase the time spent on a page and therefore its weight and the amount of consumed resources. This mechanism is used in captology to capture the attention of users. Article 20 of the proposed law written by the French Senate (French) actually plans to ban this technique.

Example of infinite scroll

When you search for pictures on about climate marches, in just a few scrolls, the page weight quickly reaches 25 MB (which does not include the download of pictures!). Scrolling is so simple that it is hard to realize how many pictures are loaded and when to stop. We keep scrolling for a better picture...

List of loaded requests for the display of one page with infinite scroll

The recommendation is to replace as much as possible an infinite scroll by an action. An action might be a pagination, or a “See more” button.

It is also important to think about the right number of elements to display by default. Avoid frustrating users with too many clicks. Find the right balance!

Avoid auto-completion

Auto-completion and suggestion mechanisms require a lot of requests to the server.

Example of auto-completion

The Gmail default option “Smart compose” proposes “smart” suggestions to build the message. These tools contribute to intellectual laziness, and are energy-consuming.

Beginning of an email showing an automatic suggestion

To conserve energy, avoid these tools or use the already available help techniques (error prevention, examples, input formats…). If their usage remains relevant in your context, it is also possible to limit them, for example by proposing suggestions only after a certain amount of characters typed.

More info


The line between keeping users informed and continuously soliciting is a tight one to walk. Again, eco-design and ethics share common recommendations about notification. You must honestly ask yourself how useful and frequent notifications need to be.

Some practices to consider:

  • Think about the different notification formats and how urgent they need to be
  • Enable users to personalize their notifications, like who, when, and how they want to receive notifications
  • Avoid useless confirmation emails (ex: after unsubscribing from a newsletter)
  • Replace a confirmation toaster by a change of state. For example, replace a toaster showing a new element by a new focus state on the new element.
More info

Except where otherwise noted, content on this site is licensed under a Creative Commons Attribution 4.0 International license.

Come talk with us on, channel #projet_ecoconception (in French).

Authors of the guide: Aurélie Baton and Anne Faubry.