UE 719 et Enseigner avec le numérique Médiatisation : les techniques de base du web

UE 719 et Enseigner avec le numérique … Médiatisation : les techniques de base du web  16h  Formateurs  Isabelle Debled-Rennesson -  Gilles Grateau - …

UE Enseigner avec le numérique Objectif : Acquérir les connaissances théoriques et techniques permettant de construire des modules d’apprentissage  Les techniques de base du web Notions de base sur les types d’architectures, les types de communication, les types d’outils Ecriture de pages web Evaluation : projet + une partie de l’examen écrit  Note sur 40 TIC 10 points Médias 14 points Techniques du web 16 points : 12+4

Contenu du module  Pré-requis : C2I1  7 séances : 17 nov - Principes du web – Web 2.0 : Outils de publication rapide : l’exemple du blog 24 nov - Publication rapide : CMS, … 25 nov - Création de pages web - bases d’HTML 1er dec 2 dec 8 dec (3h) 15 dec (3h) - Feuilles de style - - Projet -

Objectifs des Séances 1 et 2 Présenter et prendre en main certains des « nouveaux » outils de publication sur le web. Présenter quelques usages pédagogiques. Connaître certains services proposés sur le web qui ne nécessitent aucune connaissance technique informatique approfondie, aucune installation de logiciel sur un ordinateur personnel. Réflexion autour du concept du Web 2.0. 

 Inscription sur le site  Aller chercher le fichier de cette présentation de la séance 1 sur l’ENT (ou sur le site

I. Généralités Internet - web - serveurs - clients - web web 2.0

Internet Ordinateurs connectés les uns aux autres Possibilités  Echanges de fichiers  Echanges de messages (instantanés, électroniques)  Application la plus connue : le web Pages multimédia connectées les unes aux autres avec des hyperliens Un ordinateur = un numéro IP Analogie : numéro de téléphone

Serveurs web Dépositaires de pages web et autres ressources  Une page web = un fichier  Autres ressources : images, vidéos, fichiers son... Reçoivent des demandes de ressources  Exemples : demandes de ressources au serveur web de l'IUFM de Lorraine = accès à la page d’accueil du site web de l’IUFM (ie le fichier index.html ou index.php) mages/etoile_verte.jpghttp:// mages/etoile_verte.jpg = accès au fichier etoile_verte.jpg présent dans le dossier ressources/tice_pour_enseigner/squelettes/images/ Répondent à ces requêtes en envoyant sur le réseau internet le fichier voulu vers l’ordinateur demandeur (client)

Ordinateurs clients web Envoient des requêtes web sur Internet Les requêtes sont acheminées vers le serveur indiqué Outils de visualisation : navigateur web  Internet Explorer, Firefox, Chrome,…

URL Uniform Resource Locator Adresse d’une ressource sur le web images/etoile_verte.jpg  http : protocole de communication utilisé  lorraine.iufm.fr : nom du serveur  Permet de retrouver le numéro IP du serveur  ressources/tice_pour_enseigner/squelettes/images/ : dossier où chercher la ressource demandée  etoile_verte.jpg : ressource (fichier) demandée

Protocole Internet : communication entre des ordinateurs Communiquer  langage commun = protocole en informatique Plusieurs protocoles  http : communiquer pour transférer des ressources pour affichage dans navigateur web  ftp : transfert de fichiers  https : transfert sécurisé (données cryptées) Idéal pour la messagerie électronique, passer son code de carte bleue …

13 Le “Web 1.0” création de pages web (free.fr)‏ (wanadoo.fr)‏ (monhebergeur.com)‏ ftp http Outil de création de page web Ressources du site web Serveur web Internautes sur navigateurs web

Diffusion d’une ressource sur le web  Créer la ressource (fichier local sur ordi personnel)  Transférer la ressource sur un serveur web – Utilisation d’un logiciel client FTP permettant de se connecter à un autre ordinateur et d’échanger des fichiers

“Web 1.0” : caractéristiques Les pages web sont une « vitrine » Contenu essentiellement informatif, statique Internaute : lit et clique pour accéder à une autre page Peu de mises à jour car  elles doivent être faites manuellement ;  à chaque modification il est nécessaire de télécharger (uploader) la nouvelle version de la page L'auteur doit gérer :  Les aspects techniques (rédaction, publication)‏  La présentation Nécessite des compétences (informaticien, designer,...) Tout est possible – personnalisation – design …

Le Web 2.0 création de pages web  L'utilisateur se concentre sur le contenu  Un programme à distance assiste l'auteur dans la création des pages  Moins de marge de manœuvre car interface simplifiée

Nouvelle approche : “Web 2.0” (google,skyblog...)‏ http

Le “Web 2.0” création de pages web  Interaction : la page est composée directement sur le serveur  Le serveur – Reçoit les requêtes – Réagit en conséquence  Modification de fichier – Renvoie une page tenant compte des modifications – Les pages ne sont plus statiques mais construites à la volée  Pages dynamiques

Le Web 2.0 : l’approche générale Le Web est utilisé comme plate-forme  Un site web peut être un outil aussi efficace qu'un logiciel Exemple : le tableur de Google  Ne nécessite pas d'installation de logiciel, et peut donc être utilisé dans toutes les lieux d’un établissement  Permet d'accéder en permanence aux travaux réalisés Les outils du Web 2 sont des activateurs sociaux  Production de contenus par les utilisateurs, exemples : Ajout d'une vidéo sur Dailymotion Rédaction de blogs Commentaire sur un livre ou un dvd sur Amazon Commentaire sur une information sur

Quelques outils du Web 2.0 Les Blogs  Outils pour créer des journaux sur internet Les Wikis  Outils de publication permettant à plusieurs personnes de travailler sur un même texte Le Podcasting  Francisé en baladodiffusion, moyen de diffusion de fichiers audio ou vidéo (ou autres) sur Internet, les podcasts

Quelques outils du Web 2.0 Les CMS  Contents Management System. "Système intégré et multi plate- forme permettant aux entreprises et aux organisations de gérer rapidement et facilement le contenu dynamique et rédactionnel d'un site Web". Sera développé en séance 2 Les flux RSS  Flux de contenus en provenance de sites Internet. Ils incluent les titres des articles, des résumés et des liens vers les articles intégraux à consulter en ligne.  Moyen simple d’être informé du nouveau contenu d’un site, sans consulter ce site D'autres outils …  Création de pages web en ligne  Logiciels tableurs, traitements de texte en ligne (Etherpad), …

II. Un outil du Web 2.0 : le Blog Utilisation - Impacts pédagogiques Création

Le Blog Abréviation de weblog (issu d'une contraction de web et log)  weblog est fréquemment raccourci en blog ou francisé en "blogue"  Site web sur lequel une ou plus rarement plusieurs personnes s'expriment de façon libre, sur la base d'une certaine périodicité  Contenu diffusé sous forme d'articles  Journal en ligne qui encourage une interaction auteur-lecteur

Le Blog Différentes expressions sont possibles : Différentes expressions sont possibles :   un journal intime ;  un journal en ligne tenu par un journaliste, par le témoin d’un évènement ;  des textes, des sons, des vidéos, toutes créations artistiques ;  des textes politiques, écologiques, ….  Le blog catalyse la constitution  Le blog catalyse la constitution de petites communautés, qui laissent des commentaires, des liens vers d’autres blogs,....

Caractéristiques d'un Blog  Site internet consultable en ligne  Mise en ligne d’articles et de billets réalisable de n’importe quel ordinateur connecté à internet  Aspect collaboratif : plusieurs auteurs peuvent contribuer (en fonction des droits accordés à chacun)  Mise à jour régulière voire journalière, les articles sont classés de façon ante chronologique (le plus récent au début), La consultation des archives permet de suivre le fil d’une thématique  Possibilité de répondre aux articles publiés de les commenter (les modalités diffèrent selon l’auteur du blog) interactivité avec l’auteur (feedback), des échanges avec d’autres internautes autour d’un thème  possibilité de se tenir au courant de l’évolution du blog biais d'un fil RSSfil RSS

Avantages Publication facile et simple Réactivité immédiate dans le cas de mise en ligne d’informations Possibilité de mise à jour non dépendante du lieu (il suffit d’être connecté à internet) Interaction possible entre les lecteurs et les auteurs par le biais des commentaires Aspect collaboratif

Quelques exemples Exemples de blogs généralistes :  Les blogs du Monde : 0,48-0,0.htmlhttp:// 0,48-0,0.html  Les blogs de Libération : Exemples de blogs pédagogiques (profs ou formateurs) :  Un enseignant écrit sur l’intérêt d’avoir un blog pédagogique :  Le web pédagogique :  WebLettres :  Enseignants Web 2.0 et les langues :

Quelques exemples (suite) Le blog de la formation : proposes/ A l’école : Activité : Explorer différents sites et proposer pour l’école Des pistes d’usages (pédagogiques) d’un blog Des objectifs (pédagogiques) favorisés par l’usage du blog

Pistes d'usages Voir également ici : Blogs du parcours P2Blogs du parcours P2

Déontologie  Quelques règles à respecter ou écueils à éviter   Memotice Bog-notes publié par le CRDP de Versailles en direction des jeunes créateurs de blogs  versailles.fr/achat/produit_details.php?id=171&derniereRecherch e#details versailles.fr/achat/produit_details.php?id=171&derniereRecherch e#details Différence entre blog et site perso ou pages perso  et-un-weblog-_a1472.html et-un-weblog-_a1472.html

Comment créer son blog ?  Deux solutions  Utiliser les services d'un hébergeur de blogs Remplir un formulaire, puis un identifiant et un mot de passe est fourni  Attention, on s'engage sur les conditions d'utilisation !  Se méfier des publicités intempestives  Installer sur son propre site les outils nécessaires à la création d'un blog Quelques compétences techniques sont nécessaires Exemples :  

Créer son blog avec un hébergeur (Google) (conseillé par l’association EPI) EPI …

Définir le « scénario » de son blog  Objectif ?  A qui est-il destiné ?  Qui le gère ?  Nature des articles, contenus ?  Fréquence de mise à jour ? Cf.

Activité proposée  Imaginer un scénario  En fonction de celui-ci, – Donner un titre à votre blog – Faire un menu avec au moins 2 pages – Rédiger 2 articles dont un avec une image libre de droit – Mettre un lien sur le blog de vos voisins – Autoriser un élève à publier un article soumis à votre approbation - tester – Poster un commentaire sur le blog de vos voisins – Ajouter un widget