Archives pour la catégorie Les coulisses du web

Intégrer des vidéos ou des sites externes dans ses articles

Dans un article, il est courant de vouloir inclure une vidéo une vidéo, une image interactive…

Le moteur WordPress n’est pas toujours adapté à la manipulation de ce type de contenus. Heureusement, Internet offre une solution : les iframes, véritables « cadres » dans l’article permettant d’afficher le contenu d’un autre site au choix dans l’espace indiqué.

Pour insérer un iframe dans son article, il suffit alors d’utiliser la balise [iframe] :

[iframe width="1280" height="850" src="//www.thinglink.com/card/920686387026460674" type="text/html" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen scrolling="no"]

Voici les différentes options utilisées pour cette balise :

  • width : largeur du cadre (en pixels par défaut)
  • height : hauteur du cadre (en pixels par défaut)
  • src : adresse du contenu à afficher dans le cadre (ici, une image cliquable)
  • type : type de contenu à inclure, laisser « text/html » dans le doute
  • frameborder : taille en pixels de la bordure à afficher (0 pour ne pas en avoir)
  • webkitallowfullscreen/mozallowfullscreen/allowfullscreen : autoriser le plein écran dans Chrome, Firefox et les autres navigateurs
  • scrolling : afficher un ascenseur si le contenu ne tient pas dans les dimensions du cadre

Remarque : certains sites proposent déjà des codes tout prêt à insérer dans une page web. La notation <iframe> n’est pas supportée directement pas WordPress, il est nécessaire de la transformer en balise (remplacer « < » et « > » par des crochets et supprimer la partie </iframe>).

Pour une vidéo Mediane, par exemple :

<iframe frameborder="0" width="1330" height="770" src="https://be1d.ac-dijon.fr/mediane/m/338/d/i" webkitAllowFullScreen="true" mozallowfullscreen="true" allowFullScreen="true"></iframe>

devient

[iframe frameborder="0" width="1330" height="770" src="https://be1d.ac-dijon.fr/mediane/m/338/d/i" webkitAllowFullScreen="true" mozallowfullscreen="true" allowFullScreen="true"]

Bonne rédaction 🙂

Guillaume Laville – Responsable des plateformes d’hébergement – DSI du rectorat de Dijon

Et si on prenait le temps de lire le témoignage d’une enseignante de collège !

Vous trouverez ci-dessous le témoignage de Madame Romano, professeur documentaliste du collège St-Cyr à Matour (71). N’hésitez pas à aller voir ici le blog dont elle parle !

Merci encore à elle.

Pour ce qui est du témoignage, je ne sais pas si notre blog peut vous intéresser, mais pour mes élèves et moi, cela a été une belle expérience.

Tout d’abord, contrairement à ce que l’on pourrait imaginer, les élèves sont parfois trop impressionnés pour oser se lancer. C’est petit-à-petit qu’ils prennent conscience qu’ils peuvent valoriser ce qu’ils créent en en parlant, en le montrant. Certains ont ainsi réalisé que leur travail ou leurs activités pouvaient avoir de l’intérêt et ont été encouragés.

Je pense notamment ici aux élèves qui s’étaient lancés dans la création d’un manga. Le fait de raconter les étapes de leur création (toujours en cours) les a aidés à tenir sur le long terme, clarifier leurs idées, poser des jalons intermédiaires et voir en perspective l’avancée de leurs travaux.

Aujourd’hui 3 des 4 élèves désirent poursuivre leur projet et acceptent pleinement l’idée qu’un tel projet demande du temps, du sérieux, le courage de revenir en arrière pour reprendre et modifier ce qui doit l’être. Ils ont convaincu 3 autres de se lancer dans leur propre projet d’adaptation et de transposition d’une série télévisée anglo-saxonne dans l’univers du manga.

D’autres ont appris que pour être valorisés, il fallait « oser » :  oser créer, oser parler, se montrer, qu’il y avait un intérêt à prendre des risques.

Pour les élèves de notre collège rural qui manquent parfois de confiance en eux cela a constitué un tremplin vers l’écriture et la communication.

Même si mes élèves sont moins nombreux en clubs cette année, j’espère vivement pouvoir garder cet espace dans lequel ils se racontent et s’exposent, exposent leurs productions.

Bien cordialement,
E. Romano
professeur-documentaliste
Collège St-Cyr à Matour (71)

Vous avez envie de participer ? Venez découvrir le témoignage d’une école.

Je vous propose ici le témoignage de l’école de Los Angeles, du réseau MLF, qui nous raconte comment a été mis en œuvre le concours Blogue ton école dans la classe de CM2.

Le projet autour du blog des Grands hommes et des grandes femmes de Paris s’est inscrit dans le cadre du voyage scolaire en France des CM2.

Etant un établissement français à Los Angeles, les élèves des 5 classes de CM2 du Lycée International ont l’occasion de découvrir la culture française par un voyage d’intégration lors de leur dernière année d’école primaire. Il s’agit d’un projet pédagogique très important qui fait l’objet de séances thématiques en classe tout au long de l’année.  Pour valoriser ce voyage, un travail autour de l’Education aux Médias et à l’Information est mis en place en partenariat avec la Bibliothèque Centre de Documentation.

Dans ce contexte, M Duarte, professeur des CM2 C et Mme Decriem, professeur documentaliste, ont choisi d’organiser un projet de recherche autour de Paris. Pour renforcer l’éducation aux Médias, nous avons travaillé sur la fabrication d’un média et la découverte des métiers du journalisme. Lors de la conférence de rédaction, les élèves de la classe ont donc d’abord réfléchi à la ligne éditoriale de notre média pour trouver un angle original autour de l’étude des grands personnages ayant vécu à Paris. Puis les élèves en sont venus à aborder le thème du support et ont parlé de l’envie de réaliser un blog.

En partenariat avec la Mission Laïque Française, nous avons profité de cette opportunité pour participer au concours « Blogue ton école » organisé par l’Académie de Dijon. Une première partie du projet a donc été consacrée à un travail de journalistes-documentalistes, en réalisant une recherche biographique sur les grands personnages, ce qui a été fait avec beaucoup de sérieux par nos apprentis journalistes. Puis lors du voyage à Paris au mois de mars, les élèves se sont improvisés « reporters de terrain » pour rédiger des comptes rendus journaliers de leurs visites, en rapport avec les différents personnages. La visite de la rédaction d’un grand magazine français a permis aux élèves de comprendre la réalité du terrain. Dès leur retour, les élèves ont donc complété le blog avec leurs reportages et ont demandé l’impression d’une version papier pour pouvoir en conserver un souvenir.

Nous sommes très fiers d’avoir pu participer à ce concours, et très honorés d’avoir remporté le premier prix des écoles. Ce fut vraiment un projet passionnant et très enrichissant et nous pensons déjà à l’année prochaine. Nous vous remercions de cette reconnaissance et espérons que cette aventure donnera d’autres l’envie de participer à ce concours !

La classe de CM2 C du Lycée International de Los Angeles

Fréderic Duarte, professeur des écoles.

Marjorie Decriem, professeur –documentaliste.

Dictionnaire des mots du blog…

Voici un lexique des mots courants du monde des blogs que nous avons construit à partir du glossaire du site CapITyPA, fruit de la collaboration entre participants du MOOC ITyPA 1, premier MOOC francophone. Tous ces éléments sont partagés sous licence libre (CC by-nc-sa).

AGRÉGATEUR DE FLUX
Les agrégateurs de flux sont des outils permettant de rassembler et d’organiser des flux RSS ou ATOM de sources différentes afin d’en faciliter la consultation rapide. Ils font partie intégrante de la veille informationnelle.

ATOM
Format basé sur le standard XML (langage informatique) permettant le partage et la syndication de contenus publiés sur le Web, comme par exemple les articles d’un  blog.

vishnou-cc-by-sa-d_villafruela
Vishnou, CC-BY-SA D. Villafruela

AVATAR
Dans la religion hindoue, désigne chacune des incarnations du dieu Vishnou.
Représentation virtuelle créée par un internaute dans le cyberespace. Apparence que prend une personne dans un environnement graphique informatique : image dans un forum sur internet, un clavardoir, sur un compte de média social ou objet 3D dans un univers virtuel. Cette image peut illustrer autre chose que l’utilisateur lui-même.

BALISE (HTML)
Une balise est l’étiquette utilisée pour marquer le début et la fin d’un élément en langage HTML. Les éléments donnent la structure d’un document HTML (une page web) et indiquent comment nous voulons que le navigateur présente notre site Web. En général, les éléments se composent d’une balise ouvrante, d’un contenu et d’une balise fermante. Par exemple, les balises  <li>contenu</li> vont servir à établir des éléments de listes à puces ou numérotées.

BILLET
Dans un blog, on appelle « billet » un article posté, quelle que soit sa longueur. Synonyme de “post” en anglais.

BLOG
Le mot « blog » est une contraction de Weblog. Un blog est un carnet en ligne, appelé cybercarnet au Québec ou journal de bord. Les articles ou « billets » d’un blog sont datés, signés du pseudonyme du blogueur et se succèdent en général dans un ordre antéchronologique, du plus récent au plus ancien.

COOKIE
Petit fichier texte stocké par le serveur Web sur le disque dur du visiteur servant (entre autres) à enregistrer des informations sur le  visiteur ou encore sur son parcours dans le site Web permettant ainsi de reconnaître les habitudes d’un visiteur et de personnaliser sa présentation lors d’une prochaine visite.

CSS  – CASCADING STYLE SHEET
Feuille de style. CSS  est un code qui a été développé pour le langage HTML  et contient les propriétés attachées à un élément (les styles). Les styles définissent comment visualiser une page HTML (police de caractère, taille de police, couleur,mise en page, ..etc.)
Cela permet  :

  • d’avoir automatiquement le même aspect pour toutes les pages.
  • de changer l’habillage de tout un site en ne modifiant qu’un seul fichier (la feuille de style).

Le CSS vient compléter le HTML pour gérer la mise en forme d’un site.

EMBED
Intégrer, embarquer dans un site web  un « objet » réalisé sur un autre site. Consiste à recopier le code HTML de « l’objet » . Par exemple, une vidéo, une carte mentale, un fil twitter peuvent être intégrés sur un site ou un blog.

FAVICON
Un favicon est une icône informatique symbolisant un site web. Ces icônes sont créées par les propriétaires des sites. Les navigateurs web utilisent les favicons dans la barre d’adresse, la barre de titre, les favoris, les onglets et autres raccourcis. Il correspond à l’image affichée dans la barre d’adresse , juste avant l’URL.

FIL ou FLUX
Suite de publications par ordre chronologique (au fil du temps) d’une personne ou d’un blog. abréviation de « fil de discussion », enchaînement des commentaires à un article donné (On parle notamment de fil ou flux RSS). Suite des échanges sur un sujet, dans un forum.

FOLLOWER
Abonné en français, c’est un internaute qui en suit un autre sur un réseau social ou un blog. Cette relation n’est pas forcément réciproque (contrairement aux amis sur Facebook, par exemple). Ce terme s’est largement répandu avec Twitter.

HEBERGEUR WEB
Un hébergeur est une entreprise qui possède des ordinateurs dits serveurs de grande capacité, connectés à  Internet 24h/24. La fonction principale de ces ordinateurs est d’héberger le contenu de sites web. Les services d’hébergement sont en général  payants.

HTML – HyperText Mark-up Language
HTML est un langage qui permet de présenter / formater des informations sur Internet. Ce que vous voyez quand vous regardez une page sur Internet est l’interprétation par votre navigateur du code HTML. Le langage HTML est composé de BALISES et permet de  créer  des LIENS HYPERTEXTES.

HTTP – HYPER TEXT TRANSFER PROTOCOL
Protocole de communication CLIENT-SERVEUR développé pour le Web et utilisé pour le transfert de fichiers hypertextes ( pages web)

HTTPS – HTTP SECURE
Version sécurisée du protocole HTTP. La sécurisation se fait par cryptage ou chiffrement des données. Ce protocole est censé garantir l’identification du site internet qui l’utilise et favoriser la confidentialité des données transmises par l’utilisateur. Vérifiez-bien que vous êtes en HTTPS (la page est marquée par un cadenas) lorsque vous réalisez une transaction financière sur un site commercial.

HYPERLIEN ou LIEN HYPERTEXTE
Dans un document électronique (page web, mail, doc traitement texte…), un lien désigne un morceau de texte ou une image qui, une fois sélectionné (cliqué), permet d’accéder à une autre partie du document ou à une autre page web (autre fichier) suivant le protocole hypertexte. A l’origine, lorsqu’il s’agit de texte, les liens sont bleus et soulignés par défaut mais ils peuvent être personnalisés.

JAVASCRIPT
Le Javascript est un langage de programmation qui permet d’apporter des améliorations au langage HTML pour rendre les pages web interactives en permettant d’exécuter des commandes au niveau du navigateur (coté client) et non du coté serveur web.

NETIQUETTE
Netiquette est un mot-valise issu de la contraction de Net (forme tronquée de Internet) et de étiquette.
(Informatique) Désigne l’ensemble des conventions de bienséance régissant le comportement  des internautes dans le réseau, notamment lors des échanges dans les  forums ou par courrier électronique. Autrement dit c’est un code de savoir-vivre sur internet.

PERMALIEN ou PERMALINK
Lien permanent. Un permalien est constitué d’une chaîne de caractères qui représente la date, et parfois l’heure, de sa publication, et des identifiants particuliers (incluant un URL de base, et souvent qui identifient l’auteur, le membre ou le département d’où provient l’item). Généralement utilisé pour les blogs, un permalien n’est jamais modifié, même si un item est changé, renommé, ou déplacé. Par contre s’il est effacé, son permalien ne peut pas être utilisé à nouveau.

PLUG-IN ou EXTENSION
Greffon en français, petit programme, généralement téléchargé à partir d’un site web, qui vient s’implanter au cœur d’un logiciel hôte pour lui permettre de supporter des fonctionnalités supplémentaires (par exemple : flash, shockwave, real audio,  …). Des extensions peuvent par exemple être ajoutées à un navigateur internet pour le personnaliser.

RETROLIEN, PING ou TRACKBACK
Trackback en anglais, est un système de liens inter-blogs, semi-automatisé. Il permet aux auteurs de relier des billets de blogs différents et parlant du même sujet ou se faisant référence.

TAG
Etiquette ou mot-clef, utilisé pour indexer des ressources afin d’en faciliter la recherche.

TAG CLOUD
Nuage de mots-clés. Représentation visuelle des mots-clés les plus utilisés dans un  site Web, triés alphabétiquement, dans laquelle on affecte aux mots une  taille d’affichage proportionnelle à leur popularité, qui permet d’avoir  une vision d’ensemble du contenu du site et un accès rapide aux pages associées à chaque mot-clé. Le nuage de mots-clés permet de prendre connaissance du contenu d’un site Web en un clin d’œil et de voir les principaux thèmes abordés.

TROLL
Personne qui dépose des commentaires après un billet de blog ou sur tout autre site, avec l’unique objectif de critiquer, voire calomnier l’auteur, et de créer la dissension. Le trollage est la pratique du troll. Vous pouvez en savoir plus sur cet article : qu’est-ce qu’un troll ?

URL
Uniform Resource Locator. Ce qu’on appelle l’adresse web. Dénomination unique à caractère universel qui permet de localiser une ressource ou un document sur l’Internet

WIDGET
Petite application spécialisée pour une tâche et permettant d’accéder rapidement à des informations.

WYSIWYG
Signifie « What You See Is What You Get » : « Vous aurez ce que vous voyez » ou » tel écran tel écrit »). Ce terme utilisé pour faire  référence aux interfaces graphiques qui affichent directement le rendu final du document. Ce type d’application est utilisé pour les traitements de texte bureautiques et aussi par les applications de  courrier électronique, de blog ou de CMS qui utilisent des éditeurs de HTML.

Par où commencer ?

Pour bien commencer le concours de blog, il est important de bien comprendre ce qu’est un « blog », connaître la signification de certains termes récurrents et savoir où trouver de l’aide. C’est ce que vous propose cet article.

Définition d’un blog

Le terme blog provient d’une contraction anglophone : Web + Log = Blog. En français, nous pouvons le traduire par journal (log) en ligne (web).
À la manière d’un journal, un blog est constitué d’articles, parfois appelés billets, écrits au fur et à mesure, et apparaissant dans un ordre antéchronologique, c’est-à-dire du plus récent au plus ancien.
Le plus souvent, un blog contient des articles sur un même thème, écrit par un  auteur exprimant son point de vue et définissant ainsi son identité.

Il n’est pas possible d’opposer site internet et blog. Le blog est un type de site internet qui a vocation à évoluer, à s’enrichir régulièrement de nouveaux articles et à traduire une identité, une opinion ou encore une actualité.

La plupart des blog sont créés à l’aide d’outils permettant de travailler le contenu et l’apparence séparément. Ces outils, conçus pour permettre aux auteurs de se concentrer davantage sur le contenu, sont dénommés Système de Gestion de Contenu, dont l’acronyme anglais CMS signifie Content Management System.

Logo officiel de WordPress

WordPress est un CMS parmi les plus populaires pour commencer son blog. C’est l’outil utilisé dans le cadre de ce concours de blog.
Comme la plupart des CMS, il est constitué d’une partie publique, visible de tous les internautes, et d’une partie privée, réservée aux auteurs pour leur permettre d’écrire les articles et paramétrer l’apparence et les fonctionnalités du blog.

 

Demander l’ouverture d’un blog

Afin de participer au concours, vous devez avoir un blog mis en place à cet effet. Plusieurs cas peuvent se présenter.

Pour les écoles élémentaires

Les écoles élémentaires peuvent bénéficier d’un blog d’école antérieur au concours. dans ce cas, elles indiqueront dans le formulaire d’inscription si elles souhaitent utiliser ce blog ou si elles préfèrent demander la création d’un nouveau blog dédié au concours. Les écoles n’ayant pas encore de blog d’école en feront la demande auprès de leur Animateur Tice (via le serveur d’assistance).

Blog-ecole-3cas

Pour les collèges et lycées

Pour les établissements secondaires, les professeurs porteurs de projet demanderont la création d’un blog dédié au concours en précisant le texte qu’ils souhaitent voir apparaître dans l’adresse internet du blog.

Dans tous les cas, il est nécessaire de procéder à votre inscription au concours par l’intermédiaire de ce formulaire. En cas de création d’un nouveau blog, une convention d’hébergement devra être signée par le directeur ou le chef d’établissement.

Pour les établissements qui veulent renouveler l’aventure, un avenant à la convention est disponible.
avenant_a_la_convention_2017-2018

Où trouver de l’aide

Bien que WordPress soit relativement simple à prendre en main, certains apprécieront de trouver de l’aide afin de les aider à se familiariser à ce nouvel outil.

WordPress étant un système largement diffusé, une large documentation est disponible. Néanmoins, certains passages de cette documentation officielle ne sont pas encore traduits :

En outre, pour accompagner les écoles bénéficiant d’un blogue d’école fourni par l’Académie de Dijon , un site d’aide propose des articles d’aide pour les opérations les plus courantes.

Enfin, de nombreux sites proposent des tutoriels pour aider les utilisateurs de WordPress, que ce soit à propos de questions techniques ou de conseils à la rédaction. En voici quelques-uns :