Téléchargé 15 fois
Téléchargé parIsabelle Dremeau
Utiliser le code embarqué en formation
Le document explique l'utilisation du 'code embarqué' pour intégrer divers types de ressources numériques sur des sites internet. Il souligne l'importance du partage et de la réutilisation des ressources tout en respectant les droits d'auteur. La procédure d'intégration est décrite en plusieurs étapes et des exemples de ressources à intégrer sont également fournis.
Utiliser le code embarqué en formation
- 1. Utiliser le ”embed code” enformation Auteur : Idremeau Consultante-formatrice Digital Learning Avril 2017
- 2. Définition Le "code embarqué"est un code d'intégration (html) qui permet de lire du contenu d'un site sur un autre site en faisant un simple copié-collé d'un code à insérer dans l'éditeur de code du site web cible.
- 3. Principe 1 <iframe width="560" height="315" src="https://www.youtube.com /embed/_PF-7KxOsgc?rel=0" frameborder="0" allowfullscreen></iframe> «Derrière toute ressource se cache du code »
- 4. Principe 2 ▹ Participerà l’intelligence collective en publiant des ressources re-diffusables ▹ Accessibilité aux ressources facilitée ▹ Multi-diffusion de la ressource « Le partage des ressources créées par les internautes est la philosophie du Web 2.0 » Illustration : CC BY SA Ja458vier
- 5. du partageà la réutilisation « Il ne s’agit plus simplement de partager sur les réseaux, mais d’intégrer, de réutiliser et de scénariser les ressources » <Embed> Illustration : CC -By Martial Red insérer isoler réutiliser scénariser
- 6. ▸ Pour touttype de ressources Vidéos, Diaporamas, Sites, Documents Images Quiz Exercices Tableau blanc Animations
- 7. Images cliquables(ThingLink, ..) Des fichiers word, excel, pdf .. (Box.com, Google Drive …) Des vidéos (Youtube, Dailymotion …) Des diaporamas (Slideshare, Voicethread ..) Des outils interactifs (Answergarden, Padlet, …) Des sites de musiques (Soundcloud, …) Vidéo-quizz, sondages (Playposit) Bandes dessinées (Pixton) Cartes mindmap (Mindomo, Popplet) … Une grande variété de ressources Des ressources créées avec des services et des outils 2.0
- 8. Les avantages en formation ▹ Présencede la ressource dans un espace apprenant neutre (pas de publicité ni de distractions) ▹ Créer facilement des parcours avec des ressources en ligne ▹ Lecteur interactif associé à la ressource (pdf, doc) et possibilité de modifier les paramètres d’intégration ▹ Pas de connaissances informatiques requises
- 9. Où le trouver? Identification et repérage 3 clics !!
- 10. 1. Repérer lelogo 2. Outil de personnalisation (taille, couleur, cadre,… ) ▸ la balise « embed » <embed> signifie - insérer - intégrer
- 11. 1. Cliquer sur «partager » 2. Cliquer sur « intégrer » ▸ Exemple 3. Copier le code
- 12. ▸autre exemple 1. Cliquersur « intégrer » 2. Copier le code
- 13. Attention ! l’URL dulien n’est pas le code embarqué https://www.youtube.c om/watch?v=_PF- 7KxOsgc <embed width="560" height="315" src="https://www.yout ube.com/embed/_PF- 7KxOsgc?rel=0" frameborder="0" allowfullscreen></emb ed> lien embed code ▸ Ne pas confondre !
- 14. < OBJECT … <DIV… <EMBED … ▸ Comment le reconnaître ?
- 15. Que dit ledroit ? Utilisation et réutilisation des ressources
- 16. en France et enEurope* ▸Une autorisation de l’auteur est requise pour sa réutilisation, modification, traduction … ▸ Cas particulier des ressources « embed » *Cour Européenne de justice ▸Sans mention particulière tout contenu diffusé sur internet est protégé par le droit d’auteur. ▸Propriété intellectuelle
- 17. Par Audrey Ego (Doctorante en droitprivé à l'Université de Lille 2) Le « embed » et droit d’auteur • Donner l’origine de la source et le nom de l’auteur • S’assurer que la ressource respecte les droits d’auteur « (…) Autorisation incluse dans les Conditions d’Utilisation des services » https://www.youtube.com/watch?v=9prY5VVBR_A
- 18. « Embed »et droit d’auteur ▸Streaming (vidéo) ▸Pas de téléchargement de la ressource ▸Copie et intégration du lecteur permettant de visualiser la ressource ▸ Autorisation de l’auteur (désactivation possible)
- 19.
- 20. ▸ Se placeren mode édition html sur le site cible, site de « réception » Le code copié ne peut être reconnu que par un éditeur « html » en ligne ! ▸ Etape 1 Cliquer sur le mode « html »
- 21. ▸ Etape 2et 3 Copiez le code Collez dans l’éditeur html ouvert
- 22. Rebasculez en mode mode d’édition normal ▸ Etape4 La ressource apparaît telle qu’elle était sur le site source : Elle est visionnable entièrement et interactive. ▸ Editeur de texte en mode édition normal
- 23. Testez votre code en ligne! http://htmledit.squarefree.com/ Coller le code embarqué dans l’espace bleu On voit ensuite apparaître la ressource au- dessous
- 24. http://www.gettyimages.fr/resources/embed# * Sur sitesnon marchands Image embarquée Cliquez ici pour accéder au code Embarquez des images de qualité ! • Page dédiée à la recherche d’images « à embarquer »* sur le site Gettyimages • Utilisable sur des sites non marchands • Choix entre plus de 66 millions d’images ! • Possibilité d’embarquer un diaporama de plusieurs images
- 25. Tutoriels & Liens Intégrer un avatar «VOKI » dans un LMS http://fr.calameo.co m/read/001055084d 21c873774cf Autres exemples de widget- ressources : http://outils- reseaux.org/Cont enuWidget Intégrer une carte géographique https://www.embed- map.com/ Intégrer un quiz de type « Ed-Puzzle » (pdf; p.6)
- 26.