Optimiser vos fichiers vidéos pour Shopify

💡 Même avec une technologie avancée comme celle de Sharp, chaque MB ajouté au poids d'une page web a un impact sur les temps de chargement. Pour maximiser votre rentabilité et diminuer votre taux de rebond, il est essentiel d'optimiser la quantité de données à charger. La taille compte également : plus une vidéo est longue, plus elle est lourde, et les vidéos sont une des sources majeurs de poids sur les pages web, impactant négativement les performances. 

Le format (.mp4)

Ce format est le plus universellement supporté par l'ensemble des navigateurs, et il est également le plus facile à compresser : nous vous recommandons très fortement d'utiliser le .mp4 pour vos vidéos. 

Le ratio

Essayez au maximum d'uploader une vidéo dont les dimensions correspondent de base à celles qui seront affichées. 

Contrairement aux images, qui sont automatiquement chargées et recoupées à la bonne taille d'affichage par Sharp pour diminuer leur poids avant même qu'elles arrivent dans le navigateur, cela n'est possible pour des vidéos.

Le navigateur va d'abord les charger en entier, puis ensuite être affichées dans les dimensions prévues par votre site. Cependant, l'intégralité du fichier ayant été chargé, cela peut forcer les utilisateurs à télécharger l'intégralité d'une vidéo, quand bien même seul 1/3 de celle-ci serait réellement affiché à l'écran.  

Jusqu'à 70% d'une vidéo peut donc être télécharger pour rien, ce qui ralentit d'autant le chargement de votre page. 

Pour éviter cela, recadrez les vidéos AVANT de les uploader sur Shopify. 

Par exemple, dans une vidéo carrée sur une fiche produit, une vidéo au format 16/9 non recoupée occasionnera 40% de données supplémentaire à charger. N'hésitez pas à demander les dimensions cibles à notre équipe, on se fera un plaisir de vous aider. 

La taille compte !

La résolution des vidéos est très importante également. Selon l'endroit où elle est diffusée et sa fonction (illustration d'un point textuel), la résolution de la vidéo doit être adaptée. 

Par défaut, pour une vidéo qui a vocation a être affichée en plein écran, la résolution doit au maximum être de 1920 x 1080. Dans une vidéo affichée comme contenu dans une section, un 600 x 600 est amplement suffisant (si c'est un ratio carré évidemment, à adapter en fonction de ce dernier). 

Optimiser le fichier 

Le format MP4 est très efficace au niveau de la compression de la vidéo. Il est absolument nécessaire de l'utiliser si vous voulez avoir le meilleur rapport qualité de vidéo/poids du fichier. 

Nous vous recommandons d'utiliser le site suivant pour compresser vos vidéos : https://www.videosmaller.com/ . VideoSmaller est un service en ligne qui vous permet de réduire la taille de fichier de vos vidéos sans perdre de qualité. 

Si possible, ne cliquez pas sur "Use low compression level (best quality)" qui inutilement augmenter la taille du fichier. Si le résultat final est trop lourd, vous pouvez utiliser l'option "Scale" pour la réduire davantage. 

Important : si votre vidéo n'est là que pour illustrer et que vous n'avez pas besoin de l'audio, n'hésitez absolument pas à l'enlever en cliquant sur "Retirer l'audio de la vidéo" 

Cela peut vraiment avoir un impact très important, vous devriez avoir des résultats similaires à la capture d'écran ci-dessous : 

Voilà, vous savez maintenant optimiser vos vidéos pour optimiser les performances de votre site Ecommerce !