Skip to main content

Rationalisez votre contenu vidéo Drupal : Stratégies d'experts pour l'optimisation

Reading time: 8 minutes
CK headshot
Written by
CK Ng
Lead Architect
Drupal logo
Key Takeaways
  • Use platforms like YouTube and Vimeo to offload video hosting, reducing server load and improving site performance.
  • Implement lazy loading on videos to enhance page load times and user experience in Drupal.
  • Utilize Video.js for custom video player integration in Drupal, allowing seamless integration with JavaScript frameworks like React.
  • Ensure video accessibility by including captions, transcripts, and using compliant players like Video.js.
  • Prioritize video security with platforms offering encryption and secure token access, such as Cloudflare Streams.

En tant qu'expert ayant des dizaines d'années d'expérience dans le développement de Drupal, j'ai été le témoin direct des défis et des solutions en matière de gestion de contenu vidéo dans Drupal. Une gestion efficace de la vidéo est cruciale pour tout site web Drupal, mais de nombreuses plateformes d'hébergement web ne disposent pas de l'infrastructure nécessaire à cet effet, ce qui les oblige à faire appel à des services externes.

Pour surmonter ces obstacles, l'utilisation de plateformes vidéo établies telles que Vimeo, YouTube ou Cloudflare Streams peut réduire considérablement les frais généraux techniques et améliorer les performances. En intégrant des vidéos de ces plateformes dans Drupal, vous pouvez améliorer l'expérience des utilisateurs sans avoir à gérer vous-même l'infrastructure vidéo.

Voici quelques raisons convaincantes d'envisager l'utilisation de services externes :

  • Réduction de la charge du serveur : La délocalisation de l'hébergement vidéo réduit la charge sur les serveurs de votre site web, ce qui améliore les performances globales et les temps de chargement.
  • Évolutivité : Ces plateformes gèrent d'importants volumes de trafic, garantissant une lecture vidéo fluide même en cas de pic d'utilisation.
  • Réseaux de diffusion de contenu (CDN) : Les plateformes d'hébergement vidéo externes utilisent des réseaux de diffusion de contenu (CDN) pour une diffusion efficace des vidéos, ce qui garantit des temps de chargement plus rapides à l'échelle mondiale.
  • Optimisation vidéo : Des techniques avancées de compression et d'encodage vidéo sont utilisées pour diffuser des vidéos de haute qualité avec des fichiers de taille minimale.
  • Analyses et perspectives : Ces plateformes fournissent des analyses détaillées sur les performances des vidéos, l'engagement des spectateurs et les données démographiques.
  • Rentabilité : Les services externes peuvent être plus économiques que l'auto-hébergement, en particulier pour les grandes vidéothèques.
  • Facilité d'intégration : L'intégration de vidéos est généralement simple et ne nécessite qu'une expertise technique minimale.
  • Fonctionnalités supplémentaires : De nombreuses plateformes offrent des fonctionnalités telles que l'édition vidéo, le partage et des options de monétisation.

L'utilisation de ces services vous permet de vous concentrer sur la création d'un contenu vidéo captivant tout en garantissant une intégration et des performances transparentes sur votre site Drupal. En septembre 2022, le module Vidéo pour Drupal a été utilisé sur environ 23 869 sites, ce qui témoigne de sa popularité et de son efficacité.

Screenshot showing the usage statistics for Drupal video module

Exploiter les plates-formes vidéo externes

De nombreuses plateformes d'hébergement web n'offrent pas l'infrastructure nécessaire à une gestion efficace de la vidéo, y compris les capacités d'encodage. Il est donc souvent nécessaire de faire appel à des services externes, ce qui est préférable. La mise en œuvre de solutions de transcodage complexes peut nécessiter beaucoup de ressources et de temps en raison de la diversité des formats vidéo et des exigences de diffusion.

Pour surmonter ces difficultés, il est plus efficace d'utiliser des plateformes vidéo établies telles que Vimeo, YouTube ou Cloudflare Streams. Ces plateformes offrent des solutions robustes d'hébergement, d'encodage et de diffusion de vidéos, ce qui permet de réduire considérablement les frais généraux techniques et d'améliorer les performances. En intégrant les vidéos de ces plateformes dans Drupal, vous pouvez vous concentrer sur l'expérience utilisateur et l'intégration sans avoir à gérer vous-même l'infrastructure vidéo.

Le choix de l'option dépend de la quantité de vidéos à héberger et des coûts associés. Vimeo et YouTube constituent également des canaux supplémentaires pour attirer les visiteurs.

Avantages de l'utilisation de services externes :
  • Réduction de la charge du serveur : Le fait de confier l'hébergement des vidéos à des plateformes externes telles que Vimeo et YouTube réduit considérablement la charge sur les serveurs du site web, ce qui améliore les performances globales et les temps de chargement.
    Évolutivité : Ces services sont conçus pour gérer d'importants volumes de trafic, garantissant une lecture vidéo fluide même en cas de pic d'utilisation.
  • Réseau de diffusion de contenu (CDN) : La plupart des plateformes d'hébergement vidéo externes utilisent des CDN pour une diffusion efficace des vidéos, ce qui se traduit par des temps de chargement plus rapides pour les spectateurs du monde entier.
  • Optimisation vidéo : Ces plateformes utilisent souvent des techniques avancées de compression et d'encodage vidéo pour diffuser des vidéos de haute qualité tout en minimisant la taille des fichiers.
  • Analyses et informations : Ces plateformes fournissent généralement des analyses détaillées sur les performances vidéo, l'engagement des spectateurs et les données démographiques.
  • Rentabilité : L'utilisation de services externes peut s'avérer plus rentable que l'auto-hébergement du contenu vidéo, en particulier pour les vidéothèques de grande taille.
  • Facilité d'intégration : L'intégration de vidéos provenant de ces plateformes dans votre site web est généralement simple et ne nécessite qu'une expertise technique minimale. La plupart des plateformes offrent un certain degré de personnalisation du lecteur intégré, ce qui vous permet d'adapter son apparence et ses fonctionnalités à la conception de votre site web. Leurs lecteurs utilisent des techniques avancées telles que la diffusion en continu à débit adaptatif et la diffusion dynamique de contenu pour garantir une lecture fluide sur différents appareils et dans différentes conditions de réseau. Ils prennent également en charge le chargement paresseux, ce qui permet d'optimiser les performances vidéo et de réduire la mise en mémoire tampon.
  • Fonctionnalités supplémentaires : De nombreuses plateformes proposent des fonctionnalités telles que l'édition vidéo, le partage et des options de monétisation.
    L'utilisation de ces services vous permet de vous concentrer sur la création d'un contenu vidéo captivant tout en garantissant une intégration et des performances transparentes sur votre site Drupal. En septembre 2022, le module Vidéo pour Drupal a été utilisé sur environ 23 869 sites, ce qui témoigne de sa popularité et de son efficacité.

L'utilisation de ces services vous permet de vous concentrer sur la création de contenus vidéo captivants tout en garantissant une intégration et des performances transparentes sur votre site Drupal. En septembre 2022, le module vidéo pour Drupal a été utilisé sur environ 23 869 sites, ce qui témoigne de sa popularité et de son efficacité.

Mise en œuvre du chargement paresseux

L'implémentation du lazy loading pour les vidéos améliore le temps de chargement des pages et l'expérience utilisateur. Les lecteurs externes tels que Vimeo et Cloudflare prennent en charge le chargement paresseux dès le départ. Pour YouTube, vous pouvez utiliser le module Lite YouTube. Celui-ci peut être configuré dans le champ vidéo Media de Drupal pour afficher des vidéos utilisant Lite YouTube.

Suivez les étapes suivantes pour configurer le chargement paresseux pour YouTube dans Drupal :

  1. Installez le module Lite YouTube.
  2. Configurez le module sur le champ vidéo Media pour activer Lite YouTube.
  3. Intégrer la vidéo en utilisant l'option Lite YouTube.

Grâce à ces configurations, vos vidéos YouTube ne se chargeront que lorsque l'utilisateur les fera défiler, ce qui réduira les temps de chargement initiaux et améliorera l'expérience globale de l'utilisateur.

Lecteurs vidéo personnalisés

Screenshot of Video.js homepage

Lorsqu'il s'agit d'intégrer des lecteurs vidéo personnalisés dans un site Drupal, Video.js s'impose comme une option robuste et polyvalente. Video.js est un lecteur vidéo HTML5 mature et bien supporté par une large communauté de développeurs. Il fournit un lecteur visuellement attrayant et interactif qui s'aligne sur la conception et les fonctionnalités de votre site web.

Avantages de l'utilisation de Video.js :
  • Intégration transparente : Video.js peut s'intégrer à des frameworks JavaScript frontaux tels que React et Vue.js, ce qui permet une plus grande flexibilité et une meilleure personnalisation.
  • Prise en charge étendue des plugins : De nombreux plugins sont disponibles pour étendre les fonctionnalités de Video.js, ce qui permet d'économiser du temps de développement.
  • Accessibilité : Video.js donne la priorité à l'accessibilité, garantissant que votre lecteur personnalisé respecte les normes d'accessibilité.
  • Réactivité : Video.js est réactif, ce qui permet un affichage transparent sur différents appareils.
Mise en œuvre de Video.js avec Drupal :
  1. Installez Video.js :

    Ajoutez Video.js à votre site Drupal en téléchargeant la bibliothèque depuis le site officiel de Video.js et en la plaçant dans le répertoire approprié.

  2. Configurez Video.js :

    Ajustez les paramètres en fonction de vos besoins. Des plugins peuvent être ajoutés pour étendre les fonctionnalités du lecteur, comme l'ajout de sous-titres ou de commandes supplémentaires.

  3. Personnalisation de l'apparence et des fonctionnalités :

    Personnalisez le lecteur pour l'adapter à la conception de votre site et à l'expérience utilisateur. Il s'agit notamment de modifier l'apparence, les commandes et d'intégrer d'autres cadres JavaScript si nécessaire.

Exemples de cas d'utilisation de lecteurs vidéo personnalisés :
  • Sources de streaming multiples :
    Utilisation d'un lecteur Video.js personnalisé pour prendre en charge la diffusion en continu à partir de plusieurs services externes tout en conservant une apparence et des fonctionnalités cohérentes.

En exploitant les capacités de Video.js, vous pouvez créer une expérience vidéo transparente et attrayante sur votre site Drupal, améliorant ainsi l'interaction et la satisfaction des utilisateurs.

Répondre aux questions et préoccupations les plus courantes

L'intégration de contenu vidéo dans votre site Drupal peut soulever plusieurs questions et préoccupations. Nous répondons ci-dessous à quelques-unes des plus courantes :

Choisir la bonne plate-forme vidéo externe :

Le choix de la plateforme vidéo externe appropriée dépend de vos besoins spécifiques. Des plateformes comme Vimeo, YouTube et Cloudflare Streams offrent chacune des caractéristiques et des avantages uniques. Par exemple, YouTube est excellent pour la portée et l'exposition, tandis que Vimeo permet un meilleur contrôle de la confidentialité des vidéos et de l'image de marque. Cloudflare Streams offre des fonctions de sécurité robustes et une intégration transparente.

Garantir l'accessibilité des vidéos :

L'accessibilité est cruciale pour le contenu vidéo. Veillez à ce que vos vidéos soient accessibles à tous les utilisateurs en incluant des sous-titres, des transcriptions et des descriptions audio. L'utilisation d'un lecteur comme Video.js peut vous aider à respecter les normes d'accessibilité, car il prend en charge les sous-titres personnalisables et d'autres fonctions d'accessibilité. En outre, des plateformes comme YouTube et Vimeo proposent des options d'accessibilité intégrées.

Assurer la sécurité du contenu vidéo :

La sécurité est une autre préoccupation importante, en particulier lorsqu'il s'agit de contenus propriétaires ou sensibles. Des plateformes telles que Cloudflare Streams offrent des fonctions de sécurité avancées, notamment le cryptage et l'accès sécurisé par jeton, afin de garantir que vos vidéos sont protégées contre tout accès non autorisé.

Tendances récentes et évolutions majeures de Drupal Video :
Tendances récentes :
  • Gestion des médias : Drupal a fait des progrès considérables dans l'amélioration de ses capacités de gestion des médias, en mettant l'accent sur la vidéo. Le module Media Library et ses outils connexes sont devenus plus puissants et plus conviviaux, ce qui facilite le téléchargement, l'organisation et l'intégration de vidéos dans le contenu de Drupal.
  • Drupal sans tête et vidéo : L'essor des architectures Drupal sans tête a ouvert de nouvelles possibilités d'intégration de la vidéo. Drupal peut servir de backend robuste pour gérer le contenu vidéo tout en s'intégrant de manière transparente à des frameworks frontaux tels que React ou Vue.js, offrant ainsi une plus grande flexibilité et des options de personnalisation.
  • Fournisseurs de vidéo à distance : L'intégration de Drupal avec des fournisseurs de vidéos distants comme YouTube, Vimeo et Wistia est devenue plus rationnelle. Des modules tels que Video Embed Field et Media Remote Video permettent d'intégrer facilement des vidéos provenant de ces plateformes dans le contenu de Drupal.
  • Diffusion vidéo en continu : La communauté Drupal s'intéresse de plus en plus à la diffusion de vidéos en direct et à la vidéo à la demande (VOD). Des solutions comme le module Video.js et l'intégration avec des plateformes de streaming comme JW Player ou Brightcove gagnent du terrain.
  • Accessibilité : La communauté Drupal a mis l'accent sur l'accessibilité des vidéos. Des fonctionnalités telles que la génération automatique de sous-titres, l'intégration de transcriptions et les descriptions audio sont de plus en plus répandues, garantissant que le contenu vidéo est accessible à tous les utilisateurs.
Développements majeurs :
  • Drupal 10 et au-delà : Drupal 10, sorti en décembre 2022, renforce encore l'engagement de Drupal en faveur de la vidéo. Le système central de gestion des médias a été affiné, et des travaux sont en cours pour améliorer les performances vidéo et l'intégration avec les technologies vidéo modernes.
  • Media Entity et Media Library : L'introduction du module Media Entity dans Drupal 8 a révolutionné la façon dont Drupal gère les médias, y compris la vidéo. La médiathèque offre un emplacement centralisé pour la gestion des fichiers vidéo, ce qui les rend plus accessibles et plus faciles à utiliser dans le contenu de Drupal.
  • Modules Contrib : La communauté Drupal a développé une multitude de modules contributifs qui étendent les capacités vidéo de Drupal. Ces modules offrent des fonctionnalités telles que des listes de lecture vidéo, des galeries, des boîtes lumineuses et des options d'édition avancées.
Points clés pour l'optimisation de la vidéo dans Drupal :
  • Flexibilité : L'architecture flexible de Drupal lui permet de s'adapter à différents cas d'utilisation de la vidéo, depuis les simples vidéos intégrées jusqu'aux portails vidéo complexes et aux plateformes de streaming.
  • Source ouverte : La nature open-source de Drupal favorise un environnement collaboratif où les développeurs et les créateurs de sites peuvent contribuer à l'écosystème vidéo et l'améliorer.
  • Communauté : La communauté Drupal joue un rôle essentiel dans l'innovation vidéo. Des discussions actives, de la documentation et des ressources d'assistance sont disponibles pour tous ceux qui travaillent avec la vidéo dans Drupal.
  • À l'épreuve du temps : L'engagement de Drupal en faveur d'un développement continu et sa structure modulaire lui permettent d'évoluer en même temps que le paysage en perpétuelle mutation de la technologie vidéo.

About CK Ng

Chin Kiong "CK" has decades of Drupal development experience and has contributed hundreds of code commits to the Drupal community. He possesses a wild, insatiable talent and drive to solve even the most difficult technical problems in a wide range of technologies, and he brings excellence and elegance in his high-level architectural solutions as well as invaluable direction and advice. He has served as the lead architect for a number of high-profile clients and projects, including The Juilliard School, the University of Minnesota, Cornell, HelpSystems, and Estée Lauder. CK is a full-stack...

S'ABONNER À NOTRE BLOG

Abonnez-vous à notre blog ici. Nous partageons aussi régulièrement du contenu sur LinkedIn, Facebook, X, Instagram et YouTube.

ÉCOUTER NOTRE PODCAST

Growth Gears est le seul podcast qui fait le lien entre le marketing, les ventes, l'expérience client et les autres équipes impliquées dans la génération de revenus.

REJOIGNEZ NOTRE COMMUNAUTÉ

Marketing Leaders Connect est l'endroit où vous pouvez vous connecter avec des professionnels comme vous et résoudre ensemble des défis marketing complexes.