5 façons de réduire le poids des vidéos

Selon les archives du site HTTP Archive, les vidéos représentaient en 2017 environ ¼ du poids des pages web. Je n’ai pas réussi à trouver cette information à jour mais il y a fort à parier que ce chiffre a plutôt augmenté que diminué. Si nous voulons éco-concevoir nos sites web, il est donc important d’apprendre à utiliser les vidéos avec parcimonie et de savoir comment les optimiser pour en réduire le poids.

Même si les images continuent d’être la principale source d’émissions carbone d’une page web, c’est uniquement parce qu’elles sont partout ! Elles représentent 65% du poids des pages web*. Et c’est tout à fait logique puisque toutes les barrières liées à l’usage d’une photo sur le web ont disparu. À l’inverse des vidéos, qui nécessitent plus de temps pour être produites, les images se prennent et se postent en quelques secondes. Il y a aussi de nombreux sites d’images libres de droit pour n’importe quel créateur de contenu qui souhaite illustrer son propos sans même s’embêter à prendre une photo lui-même.

Si les vidéos étaient aussi nombreuses que les images sur le web, le bilan carbone serait catastrophique. 

Comme pour les photos, la règle première est d’utiliser les vidéos à bon escient en appliquant la méthode Marie Kondo. Prendre l’habitude de se poser la question de la nécessité de chaque vidéo. Est-ce qu’elle est utile pour véhiculer un message, une ambiance ? Peut-on obtenir le même résultat différemment, en utilisant une illustration ou en optimisant une image par exemple ?

Si la réponse est que vous avez besoin de cette vidéo, dans ce cas, ok mais voici quelques règles à appliquer pour réduire le poids des vidéos.

5 façons de réduire le poids des vidéos

Faire des formats courts

Plus une vidéo est courte, plus elle est légère, c’est logique ! Outre un poids de page maîtrisé, les vidéos courtes sont plus faciles à regarder puisqu’elles nécessitent moins de temps. Il y aura donc très certainement plus de personnes qui verront votre message. En marketing, l’usage recommandé est de ne pas dépasser 1mn30.

Faire des vidéos avec peu de mouvements 

C’est l’un des “fun fact” qu’Una Kravetz mentionne dans sa conférence The Joy of Optimizing Images. De la même manière que les images avec peu de variations de couleurs sont moins lourdes que les images en contenant beaucoup, les vidéos avec moins de mouvements sont plus intéressantes car elles nécessitent moins de puissance pour être lues.

Ne pas pré-charger les vidéos dans la page

Selon le rapport 2020 de HTTP Archive*, pour 44% des pages web incluant une vidéo, la vidéo est pré-chargée dans la page (attribut preload). On charge donc la vidéo avant même de savoir si l’utilisateur va la visionner. 

Cela augmente le temps de chargement initial de la page et quand on sait que 53% des visites de sites mobile sont abandonnées après seulement 3 secondes (source: Una Kravetz), on ne met pas toutes nos chances de notre côté en pré-chargeant les vidéos…

Ne pas lancer les vidéos automatiquement

Toujours selon le rapport 2020 de HTTP Archive*, pour 55% des pages web incluant une vidéo, la vidéo est lancée automatiquement dès que le visiteur arrive sur la page (attribut autoplay).

Outre le fait que les vidéos sont très gourmandes en bande passante, les vidéos qui se lancent automatiquement sont généralement vues comme trop intrusives et dégradent l’expérience utilisateur.

L’utilisateur n’a en effet pas choisi de voir la vidéo et même si la vidéo peut être pertinente, nous – concepteurs du web – ne sommes pas capables de savoir si l’utilisateur est dans de bonnes conditions pour recevoir notre message vidéo. Les raisons peuvent être très nombreuses.

  • Il se peut qu’il soit dans les transports en commun, au milieu de plein d’autres personnes (nous avons tous vécu ce moment un peu gênant lorsqu’une vidéo se lance automatiquement, avec le son évidemment, en faisant ainsi profiter toute la rame de métro… ).
  • Il se peut qu’il soit pressé et n’ait pas le temps de regarder toute la vidéo pour avoir le message qu’elle contient. Et comme les vidéos ne permettent pas un “scan” visuel comme le permet un article, il est impossible pour l’utilisateur d’aller directement à la partie qui l’intéresse.
  • Il se peut qu’il navigue sur le site web depuis son téléphone (pour rappel, 58% du trafic web provient de terminaux mobiles*) et que la batterie de son téléphone soit presque vide. Dans ce cas, il préfèrera sûrement l’économiser pour un usage plus important comme par exemple, trouver son chemin, commander un taxi ou juste appeler quelqu’un (ce qui est quand même l’usage de base du téléphone, ne l’oublions pas !).
  • Il se peut qu’il soit malentendant et qu’une vidéo non sous-titrée ne lui soit d’aucun intérêt.

Pour toutes ces raisons et probablement beaucoup d’autres, un bouton “play” est la meilleure solution à adopter. Cela permet à l’utilisateur de choisir lui-même de lire ou non la vidéo améliorant ainsi son expérience sur le site puisqu’il n’est pas interrompu à un moment inopportun.

Optimiser les fichiers

Comme pour les images, les fichiers vidéo peuvent eux aussi être optimisés pour en réduire la taille. Le collectif des Designers Éthiques propose par exemple le logiciel Handbrake qui permet de réduire de près de 40% le poids d’une vidéo, sans perte de qualité perceptible.

Je vous invite d’ailleurs à lire la partie sur les vidéos et le son du guide d’éco-conception des Designers Éthiques qui donne des informations complémentaires.

Et ici l’article sur 5 façons de réduire le poids des images pour complémenter cet article.

*source: Almanac Web 2020 HTTP Archive

Vous pouvez contribuer à créer un web plus respectueux de la planète en partageant cet article pour éveiller les consciences :)
  •  
  •  
  •  
Publié le
Catégorisé comme Agir

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *