Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

of

Utiliser le code embarqué en formation Slide 1 Utiliser le code embarqué en formation Slide 2 Utiliser le code embarqué en formation Slide 3 Utiliser le code embarqué en formation Slide 4 Utiliser le code embarqué en formation Slide 5 Utiliser le code embarqué en formation Slide 6 Utiliser le code embarqué en formation Slide 7 Utiliser le code embarqué en formation Slide 8 Utiliser le code embarqué en formation Slide 9 Utiliser le code embarqué en formation Slide 10 Utiliser le code embarqué en formation Slide 11 Utiliser le code embarqué en formation Slide 12 Utiliser le code embarqué en formation Slide 13 Utiliser le code embarqué en formation Slide 14 Utiliser le code embarqué en formation Slide 15 Utiliser le code embarqué en formation Slide 16 Utiliser le code embarqué en formation Slide 17 Utiliser le code embarqué en formation Slide 18 Utiliser le code embarqué en formation Slide 19 Utiliser le code embarqué en formation Slide 20 Utiliser le code embarqué en formation Slide 21 Utiliser le code embarqué en formation Slide 22 Utiliser le code embarqué en formation Slide 23 Utiliser le code embarqué en formation Slide 24 Utiliser le code embarqué en formation Slide 25 Utiliser le code embarqué en formation Slide 26
Upcoming SlideShare
What to Upload to SlideShare
Next
Download to read offline and view in fullscreen.

2 Likes

Share

Download to read offline

Utiliser le code embarqué en formation

Download to read offline

Optimiser la réutilisation et la multidiffusion des ressources pédagogiques avec l'utilisation du code embarqué (embed code)

Related Audiobooks

Free with a 30 day trial from Scribd

See all

Utiliser le code embarqué en formation

  1. 1. Utiliser le ”embed code” en formation Auteur : Idremeau Consultante-formatrice Digital Learning Avril 2017
  2. 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. 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. 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. 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. 6. ▸ Pour tout type de ressources Vidéos, Diaporamas, Sites, Documents Images Quiz Exercices Tableau blanc Animations
  7. 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. 8. Les avantages en formation ▹ Présence de 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. 9. Où le trouver ? Identification et repérage 3 clics !!
  10. 10. 1. Repérer le logo 2. Outil de personnalisation (taille, couleur, cadre,… ) ▸ la balise « embed » <embed> signifie - insérer - intégrer
  11. 11. 1. Cliquer sur « partager » 2. Cliquer sur « intégrer » ▸ Exemple 3. Copier le code
  12. 12. ▸autre exemple 1. Cliquer sur « intégrer » 2. Copier le code
  13. 13. Attention ! l’URL du lien 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. 14. < OBJECT … <DIV … <EMBED … ▸ Comment le reconnaître ?
  15. 15. Que dit le droit ? Utilisation et réutilisation des ressources
  16. 16. en France et en Europe* ▸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. 17. Par Audrey Ego (Doctorante en droit privé à 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. 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. 19. Comment l’utiliser? Procédure en 4 étapes
  20. 20. ▸ Se placer en 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. 21. ▸ Etape 2 et 3 Copiez le code Collez dans l’éditeur html ouvert
  22. 22. Rebasculez en mode mode d’édition normal ▸ Etape 4 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. 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. 24. http://www.gettyimages.fr/resources/embed# * Sur sites non 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. 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. 26. Merci ! Contact ▸ idremeau@wanadoo.fr Site ▸http://e-learningbretagne.blogspirit.com/ PresentationtemplatebySlidesCarnival
  • AmyRoberts99

    Nov. 23, 2021
  • lnajap

    May. 20, 2017

Optimiser la réutilisation et la multidiffusion des ressources pédagogiques avec l'utilisation du code embarqué (embed code)

Views

Total views

1,451

On Slideshare

0

From embeds

0

Number of embeds

713

Actions

Downloads

15

Shares

0

Comments

0

Likes

2

×