Intégrer une vidéo sur son site internet avec YouTube (Tuto)

Vous souhaitez mettre une vidéo sur votre site web, c’est une très bonne idée ! En effet c’est toujours un bon moyen pour présenter une entreprise, un produit, une activité… Mais côté technique, ce n’est pas toujours évident de mettre en ligne une vidéo. Une bonne méthode est de passer par YouTube. Suivez ci-dessous le tutoriel en vidéo  et en images (cliquez sur les vignettes des captures d’écran pour les afficher en grand) !

Tutoriel vidéo : comment mettre une vidéo YouTube sur son site internet

 

Les bonnes raisons d’utiliser YouTube pour mettre des vidéos sur son site

La première bonne raison, surtout si vous n’êtes pas webmaster (ou pas encore !), c’est la simplicité technique. Tout se passe sur YouTube via une interface graphique et intuitive. Pas besoin de « mettre les mains dans le cambouis », YouTube vous mâche le travail en générant quelques lignes de code HTML à insérer dans votre page web.

Une autre bonne raison, c’est que cela soulage votre serveur web. Comme les vidéos sont hébergées sur YouTube, cela n’encombre pas l’espace alloué par votre hébergeur web et votre serveur web n’est pas surchargé si un grand nombre de visiteurs visionne votre vidéo. Ce sont les serveurs de YouTube  qui travaillent pour votre site !

Enfin, mettre ses vidéos sur YouTube, c’est potentiellement une source de trafic pour votre site web. Savez-vous que YouTube est le 2^ème moteur de recherche le plus utilisé après Google ! Alors pourquoi se priver de nouveaux visiteurs et cela gratuitement !

Tutoriel pour mettre une vidéo sur YouTube puis sur son site web

1 – Envoyer sa vidéo sur la plateforme YouTube

Si vous n’en avez pas encore, vous devez vous créer un compte YouTube, un compte Google en fait ! YouTube appartient à Google. Pour créer un compte Google, voici le lien : https://accounts.google.com/SignUp. Si vous avez déjà un compte associé à un service Google (Gmail, Google+…), votre compte est alors compatible avec le service YouTube.

Une fois connecté à  YouTube, cliquez sur le bouton en haut à droite « Mettre en ligne » ; vous avez la possibilité de parcourir vos dossiers en cliquant  sur la flèche rouge « Sélectionner les fichiers à importer » ou alors simplement de faire un glisser-déposer pour « uploader » (télécharger) votre vidéo. YouTube accepte la plupart des formats vidéos, que ce soit un montage professionnel ou une séquence prise avec votre smartphone. Une barre de progression permet de se rendre compte visuellement de l’état d’avancé du transfert. Plus votre vidéo sera longue et volumineuse, plus sa durée sera importante. Dans certains cas, il pourra être intéressant d’alléger ou segmenter sa vidéo au préalable.

Dès le transfert commencé, pour pourrez renseigner les informations générales relatives à la vidéo ; une fois le transfert terminé, vous accéderez à davantage de paramètres. Cette étape n’est pas obligatoire (sauf la saisie du titre) mais recommandée pour optimiser la vidéo à répondre à une recherche YouTube.

N’hésitez pas à renseigner tous les champs en portant une attention particulière au titre qui est un des éléments les plus importants. Pour vous aider, pensez à ce que pourraient taper les « youtubers » pour trouver votre vidéo et renseignez :

• Le titre
• La description
• Les tags : liste des mots-clés pertinents séparés par des virgules
• La miniature : image qui illustrera votre vidéo dans les pages de YouTube

Un paramètre important à connaitre est la visibilité de la vidéo, vous avez le choix entre :

• Publique (par défaut) : la vidéo sera accessible par tout le monde et ressortira dans les résultats de recherche de YouTube (voire de Google)
• Non répertoriée : la vidéo est accessible uniquement par le lien de la page (exemple : https://www.youtube.com/watch?v=ApSxWct23a8)
• Privée : la vidéo n’est accessible qu’à la liste de personnes que vous autorisez en renseignant leur adresse email ou compte Google

Pour pouvoir intégrer une vidéo YouTube sur son site internet, il faut choisir la visibilité « Publique » ou « Non répertoriée ».

Ensuite, vous pouvez modifier les paramètres avancés si vous le souhaitez, par exemple gérer les commentaires, sélectionner une catégorie, préciser une langue… Veillez bien à avoir de coché le paramètre « Autoriser l’intégration » pour permettre l’intégration de la vidéo sur un site web.

Enfin cliquez sur « Publier » si la vidéo est en mode publique ou « OK » si la vidéo est non répertoriée.

2 – Paramétrer et générer le code HTML YouTube du lecteur de la vidéo

A cette étape, votre vidéo est désormais accessible sur une page YouTube via une adresse « http://youtu.be/Xarw8rQVW2w. » et « https://www.youtube.com/watch?v=Xarw8rQVW2w ».

Rendez-vous sur celle-ci (faites « pause » si vous ne souhaitez pas être déconcentré !) et affichez  l’onglet « Partager » qui se trouve sous le lecteur (également appelé « player »).

Cliquez ensuite sur « Intégrer ». YouTube vous propose alors un code HTML sélectionnable qui commence par « <iframe… ».

Cliquez sur « PLUS » juste en dessous pour visualiser l’aperçu du lecteur avec votre vidéo et accéder à ses options. Il vous est proposé différents paramètres pour personnaliser votre lecteur :

• La taille : largeur et hauteur en pixel
• L’affichage des suggestions de vidéos à la fin de la lecture
• L’affichage des commandes du lecteur
• L’affichage du titre de la vidéo et des actions du lecteur

3 – Insérer la vidéo dans sa page web

Une fois que vous avez terminé le paramétrage de votre lecteur YouTube, copiez le code HTML (clic droit « Copier » ou Ctrl C) qui est de la forme

<iframe src="//www.youtube.com/embed/Xarw8rQVW2w" width="640" height="360" frameborder="0" allowfullscreen="allowfullscreen"></iframe>.

Ouvrez maintenant l’éditeur de votre page web dans laquelle vous souhaitez intégrer la vidéo. Si vous utilisez un CMS comme WordPress, ouvrez dans un nouvel onglet (pratique pour garder dans un premier onglet les paramètres de votre vidéo YouTube) la page ou l’article dans lequel vous voulez placer la vidéo.

Parcourez le code HTML de votre page (onglet « Texte » dans WordPress) et recherchez dans le code l’emplacement souhaité pour la vidéo et faites « coller » (clic droit « Coller » ou Ctrl V) pour intégrer le code YouTube. Veillez à placer correctement le code de la vidéo en évitant de l’imbriquer dans des balises paragraphes (<p>texte…</p>) ou titres (<h2>…</h2>).

Enregistrez vos modifications et testez le rendu de votre page enrichie de votre vidéo. Procédez éventuellement à des corrections (emplacement de la vidéo dans le code, modifications du code YouTube) et enregistrez à nouveau les modifications. Votre vidéo est maintenant en ligne sur votre site internet !