Technologies Web et travail collaboratif

Présentation au sujet: "Technologies Web et travail collaboratif"— Transcription de la présentation:

1 Technologies Web et travail collaboratif
François Boutin

2 Plan du cours Technologies web Travail collaboratif Web Statique 1.0
Web Dynamique 1.5 Web Social 2.0 Futur : Web Sémantique 3.0 ? Travail collaboratif Communiquer Partager des documents Gérer un projet

3 Evolution du web sur un exemple http://web.archive.org/
2007 2004 2000 1996

4 Technologies Web Web Statique 1.0 Web Dynamique 1.5 Web Social 2.0
Futur : Web Sémantique 3.0 ?

5 Web Statique 1.0 Des pages statiques Avantages Inconvénients
Créées en HTML (par un « gourou »…) … ou avec un logiciel de création web Mises en forme (ou non…) par des feuilles de styles Avantages Une seule personne est « responsable » du site Le site peut être librement personnalisé (graphique, ergo)  Utilisation typique : site vitrine d’une petite structure Inconvénients Difficile de créer et mettre à jour de nombreuses pages Installation d’un logiciel FTP pour mettre les pages en ligne

6 Création d’une page Web en HTML
Code HTML

7 Feuille de style CSS Feuille CSS Page Web Code HTML

8 Mise en ligne du site avec FTP
Disque local Serveur Web

9 Web Dynamique 1.5 Des pages dynamiques Une édition décentralisée
Créées « à la demande » À partir d’une base de données Une édition décentralisée Des contributeurs formant une chaîne éditoriale Information saisie au plus prêt de sa source ( workflow) Gestion de contenus grâce à une interface web Avantages L’information est structurée (et facilement interrogeable) Séparation entre « contenu » et « mise en forme » Utilisation typique : gros site de vente (ex : Amazon…)

10 Accès Base de données: PHP / MySQL
Navigateur Web  Retour de la page résultat  Construction de la page résultat PHP Envoi de la requête au serveur   Requête SQL Select nom, cout FROM Produits WHERE origine = ‘France’ AND produit = ‘Fruit’ ORDER BY cout Interrogation de la base SQL  Navigateur Web Base de données MySQL Serveur Web

11 Circuit de l’information : Workflow
Formulaire Internet de saisie Formulaire de consultation / résultat Base de données Validation

12 Structuration de l’information : site UM1
Administration du site

13 Système de gestion de contenu : CMS

14 Édition d’une page

15 Web Social 2.0 L’internaute : créateur de contenu
Wiki, blogs, réseaux sociaux, partage de photos, vidéos… Annotation de page, évaluation, marque pages collaboratif, étiquetage  Objectif : fidéliser l’internaute (ex : Yahoo!) Des technologies innovantes XML, XSL, Fil RSS, trackback (rétro lien) AJAX Services Web (météo, bourse, carte routière) Nouveau modèle économique Des services gratuits qui génèrent de l’audience Des contenus rédigés par les internautes … qui induisent des revenus publicitaires Risque : détournement d’informations personnelles (ex : Facebook)

16 Wiki : Wikipedia Encyclopédie collaborative

17 Création d’un Blog Journal personnel en ligne

18 Blog : choix du modèle (template)

19 Blog : publication d’un message

20 Blog : code HTML du message

21 Blog : ajout d’une image

22 Blog : publication du message

23 Partage de photos avec Picasa & Flickr
Dossiers photos Contenu dossier Outils disponibles Association de tags (mots clés) aux photos

24 Annotation de pages Web: Fleck

25 Évaluation de pages web
L’utilisateur évalue la qualité d’une page Par un simple clic (sur + ou –) il participe au calcul du rang Il peut bannir une page (si elle ne lui convient pas)

26 Partage de marques pages
Rendre publique une référence

27 Google Bloc-notes : étiquetage

28 Structuration du contenu : XML
Exploration sans feuille de style dans un navigateur Document XML

29 Mise en forme XSL Sélection, tri et affichage XML + XSL Document XML
HTML Résultat HTML Feuille de style XSL

30 Abonnement à un fil RSS Choisir un agrégateur de flux
S’abonner à un flux sous Firefox

31 Agrégation de contenu: Google Reader
Gérer mes abonnements

32 Code RSS basé sur le langage XML
Code de la page Page RSS

33 AJAX: Asynchronous JavaScript & XML
Récupère uniquement l’information nécessaire Base de données Recherche des parcours du master 2 Biologie Santé, spécialité Biotechnologies

34 Futur : Web Sémantique 3.0 ? Web Sémantique
Interprétation du sens de requêtes en langage naturel Organisation automatique de documents Intelligence artificielle, analyse réseaux Information personnalisé : one to one Publicités ciblées (AdWords / AdSense) Prise en compte de l’historique Problèmes Récupération d’info à notre insu Interprétation de ces informations

35 Moteur de recherche graphique
Meta moteur Organise les sites pertinents concernant une requête En fonction des liens et mots clés qu’ils partagent Analyse réseau & sémantique

36 AdWords Publicités Google dans la page de résultats
Des liens commerciaux apparaissent suivant les mots clés Les mots clés sont vendus aux enchères L’entreprise paie au clic

37 Nature des requête Adwords / Overture
Requêtes relatives au mot clé dentaire

38 AdSense Publicité Google intégrée aux sites personnels
Les publicités sont associées automatiquement Le propriétaire du site est payé au clic Le coût par clic (ou pour 1000 clics) dépend d’enchères

39 Historique Google Historique en ligne
Indépendant du poste sur lequel travaille l’internaute Risque : l’individu peut être « fiché » suivant sa navigation Historique stocké sur un serveur de Google

40 Communiquer Partager des documents Gérer un projet
Travail collaboratif Communiquer Partager des documents Gérer un projet

41 Travail collaboratif avec Google Apps

42 Communiquer Communication asynchrone Communication synchrone
Travail collaboratif Communiquer Communication asynchrone Communication synchrone

43 Communication asynchrone
Courrier électronique Les champs A, CC, Cci, Objet, Texte Gérer contacts et boîtes mails Gérer le spam

44 Communication synchrone
Messagerie instantanée Texte, son, vidéo Échange de fichiers, photos… Google Talk msn Skype

45 Partager des documents Tableur Traitement de texte Présentation
Travail collaboratif Partager des documents Tableur Traitement de texte Présentation

46 Tableur en ligne Avantages
Les documents peuvent être partagés ou publiés Exportation au format xls, pdf, open office, txt, html

47 Publication du graphique sur un blog

48 Partage de document

49 Documents partagés

50 Modification du document partagé

51 Historique d’un document : Révisions

52 Traitement de texte en ligne

53 Comparaison de versions

54 Suivi des modifications sous Word

55 Création d’une présentation

56 Versions du document

57 Gérer un projet Agenda Gestion de groupe Planifier les tâches
Travail collaboratif Gérer un projet Agenda Gestion de groupe Planifier les tâches

58 Agenda

59 Demande de partage

60 Autorisation de partage

61 A ajoute un événement sur l’agenda B

62 Vue de l’agenda B

63 Gérer un groupe avec Google Groupes

64 Planifier les tâches : diagramme de Gantt