éco-conception web : Adapter le format des vidéos aux contextes de visualisation
Dans le cadre du lancement du livre Eco-conception web – Les 100 bonnes pratiques auquel plusieurs contributeurs de GreenIT.fr ont participé, nous vous proposons chaque semaine un focus sur une bonne pratique.
Aujourd’hui : Adapter les vidéos aux contextes de visualisation
Prévoir plusieurs formats (taille, frame rate , compression audio, etc.) selon le contexte de lecture des vidéos (ordinateur de bureau, tablette Wi-Fi, smartphone EDGE…).
L’optimisation des vidéos doit être réalisée en dehors du site web, idéalement lors de la postproduction. Si ce n’est pas possible, utilisez des services comme Youtube ou Vimeo qui proposent, par défaut, plusieurs formats optimisés (SD, HD, etc.).
Par exemple, une aide utilisateur tournée en 1 680 × 1 050, d’une durée de 15 secondes, pèse :
* 49 Mo non optimisée ;
* 3 Mo optimisée pour une résolution égale ou supérieure à 1 024 × 720 en MPEG 4 / H.264 / AAC ;
* 1,2 Mo optimisée pour une résolution égale ou supérieure à 480 × 320 en MPEG 4 / H.264 / AAC.
On peut donc estimer un gain d’au moins 50 % du poids (et probablement des gains lors du décodage, car le format d’encodage tient compte des matériels cibles) entre la version « desktop » et la version « mobile » de la vidéo.
Avec 3 tailles différentes × 3 encodages différents, soient 9 versions d’une même vidéo, la plupart des cas devraient être couverts. Avec une logique de responsive design, il est possible de servir telle ou telle vidéo en fonction de règles simples telles que la résolution d’écran.
Découvrir le livre Eco-conception web – Les 100 bonnes pratiques
L’acheter chez amazon.fr, eyrolles.com, à la Fnac.com.
Frédéric Bordage
Expert en green IT, sobriété numérique, numérique responsable, écoconception et slow.tech, j'ai créé le collectif Green IT en 2004. Je conseille des organisations privées et publiques, et anime GreenIT.fr, le Collectif Conception Numérique Responsable (@CNumR) et le Club Green IT.