1 / 62

Technologies du web

Technologies du web. Evelyne Broudoux CNAM 2011-12. Plan. Du web 1 au web 3 Du côté des pratiques. Du web1 au web3. Web 1 : read only - le web des documents Web 2 : read/write – le web des gens Web 3 : linked data - le web des objets communicants. Avant le web.

xander
Download Presentation

Technologies du web

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Technologies du web Evelyne Broudoux CNAM 2011-12

  2. Plan • Du web 1 au web 3 • Du côté des pratiques

  3. Du web1 au web3 • Web 1 : readonly - le web des documents • Web 2 : read/write – le web des gens • Web 3 : linked data - le web des objets communicants

  4. Avant le web • Système Augment (« augmentation de l’intelligence humaine ») de Douglas Engelbart • SGML • GeneralizedMarkupLanguage (Charles Goldfarb, Edward Mosher et Raymond Loriev) • Standard GeneralizedMarkupLanguage (langage normalisé de balisage généralisé – SGML) • DTD (définition de type de document) • Permet de structurer logiquement des documents <TITRE> <SOUS-TITRE> <PARAGRAPHE> • Système hypertexte avec Hypercard

  5. Le web 0 à 1 Navigateur scripteur Navigateur lecteur Browser graphique Erwise, 1992 Browser multiplateforme capable d’afficher dans la même fenêtre textes et images Mosaic, 1993 • Browser Nexus, 1990 : éditeur et lecteur de nœuds

  6. Evolution de l’emploi des langages • Web 0 • HTML • Web 0,5 • HTML + Java + Javascript • Scripts Client/Serveur • Web 1 • HTML + ASP + Oracle + VRML • Web 1,5 • XHTML + CSS + PHP + MySQL • Web 2 • XHTML + Javascript + XML + Flash + RSS + OPML • Web 2,5 • HTML5 + CSS3 + GL • Web 3 • RDF + FOAF + SPARQL + ??

  7. Schéma : Bachimont

  8. Vers le web dynamique • Augmentation exponentielle et continue des donnéesstockées • Bases de données • Moteurs de recherche et algorithmes de recherche-indexation • Stockage et miseà jour des données • Javascriptet Java • Séparationcontenu/forme : css • Html dynamique : php et mysql

  9. Web 1 : système de publication • Démocratisation de la publication (pages persos) • Systèmes de gestion de contenu (CMS) • Blogs • Wikis • CMS (Php-nuke, spip, drupal, moodle, joomla, etc. ) • Agrégation de contenus • RSS

  10. Hybridation de la publication avec la com • Exemple de Yahoo (né en 1994) • Annuaire + portail + moteur de recherche • Groupes • Messagerie en ligne • Hybridation de la publication web (html) avec les services de communication • Exemple des “groupes yahoo” : Un groupe de discussion estuneliste de diffusion coupléeà un site web • 2008 : tentative de rachat par Microsoft (45 milliards de dollars en actions) • Sept. 2011 : la dg Carol Bartzlicenciée (valeur Yahoo : 17 milliards de dollars)

  11. Hybridation du web • Construction de modèleséconomiquesspécifiques au web baséssur la publicité • Google (1996) • Moteur de recherche + régiepublicitaire + innovations (google earth, Gmail, etc.) + rachats (YouTube) • AdSense + AdWords • Facebook (2006) • Génération de publicités “adaptées” baséessur les profils, les pages aimées, les applications installées

  12. Dispositifs de publicationsur le web • Définitions • Édition (écriture, choix éditoriaux de filtrage, amélioration par réécritures successives) • Publication (rendre public l’info mise en forme) • Publication centralisée et distribuée • Centralisée : système hiérarchique • Systèmes en entonnoir pour l’amélioration des textes puis « publication définitive » (possibilités de réédition) • Distribuée : système en réseau • Regroupement de « communautés » d’affinités améliorant les textes « après publication », la publication n’est plus définitive

  13. Web2 vs Web1 ? • Publication • Html statique • Hiérarchie éditoriale • Contenu mis-à-jour manuellement • Britannica • Modèle publicitaire basé sur la publication (DoubleClick) • Conversation • Langages dynamiques • Classement utilisateurs • Syndication de contenu • Wikipédia • Modèle publicitaire basé sur la participation (AdSense) et Adwords http://www.journaldunet.com/ebusiness/publicite/video/071010-netbooster-demo-adwords-annonce/index.shtml

  14. Hybridation de la publication avec la com • Microblogging • Twitter : réseau social + système d’échanges de messages <140 caractères • Tumblr : plate-forme en ligne de microblogging préformaté (texte, citation, photo, vidéo, son) avec réseau social

  15. Hybridation de la publication avec la communication

  16. Skype • Éditeur et opérateur de communication • Créé en 2003 par les ex de KaZaA qui inventent une solution gratuite de téléphonie sur IP (VoIP) • + services payants sur abonnement (mobile, SMS, Chat, messagerie instantanée, etc.) • Racheté par e-bay en sept 2005 pour environ 3 milliards de dollars • Mai 2007 : 171 millions d’utilisateurs et fermeture des bureaux européens pour cause de non rentabilité des services payants (SkypeOut) • Concurrence du tél gratuit des FAI • Volume de communication payante : 1,5 milliards de minutes (= 4,5 euros par mois/utilisateur en France)

  17. Skype • Août 2007 : alliance avec Dailymotion et ses « mood channels », séquences vidéos créatives intégrables aux messages skype. Les « motionmakers », réalisateurs de ces vidéos auront accès sur Dailymontion à plus de 220 millions d’utilisateurs de Skype

  18. BitTorrent • Plate-forme P2P • Créée en 2001 par Bram Cohen (né en 1975) • Utilise les postes clients en tant que serveurs pour fragmenter les contenus • Association avec RSS (pour vérifier les mises à jour) fin 2003 • Hybridation vers un modèle payant fin 2006 : une plate-forme améliorée propose des films et de la musique, en mode payant ou gratuit, financés par la publicité. 135 millions d’installations (2007) • Vers OpenBitTorrent (2009)

  19. Les plates-formes de partage-diffusion vidéo • DailyMotion sur le modèle de YouTube • Éditeur et opérateur de communication sur internet, créé en 2005 par Benjamin Bejbaum et Olivier Poitrev • 2e semestre 2007 : + 75% de fréquentation • Juin 2007 : 37,6 millions de visiteurs uniques et 1374 millions de pages vues (source Alexa) • Current.tv: créée par AlGore pour compléter un bouquet de chaines audiovisuelles. Modèle à trois niveaux. • Wat.tv : membre du réseau TF1 network, sélection des meilleures vidéos de jeunes amateurs • Jump.tv : plate-forme de montage et retouches de vidéos en ligne • Lignes de temps : prototype de l’IRI de taguage/commentaires de vidéos

  20. DailyMotion en 2007

  21. DailyMotion en 2007

  22. DailyMotion en 2007 Créer un compte Via webcam S’identifier Tags (mots-clefs) Chaînes (catégories)

  23. Qu’est-ce que le « web2.0 » • En réalité, il n’y a pas vraiment de coupure entre web 1 et 2 • En 2000, la bulle internet éclate (pas de modèle publicitaire viable) • L’industrie logicielle cherche à rebondir • En 2005, les blogs sont en plein essor, les wikis deviennent des outils de gestion de projet, la voix sur ip se démocratise, le p2p sort des utilisations marginales, Google lance AdSense et AdWords

  24. Qu’est-ce que le « web2.0 » ? • Fin 2005, une conférence est organisée par l’éditeur de manuels informatiques O’Reilly Le web comme plate-forme • Tim O’Reilly invente ce terme avec John Battelle pour tenter de définir un nouveau paysage du web qu’il dessine ainsi L’usager crée la valeur

  25. Carte conceptuelle du web2 Le créateur du terme intègre dans une nébuleuse des technologies pré-existantes comme les wikis, les blogs, les fils RSS

  26. Qu’est-ce que le « web2.0 » • Des plate-formes logicielles indépendantes des systèmes d’exploitation • Le conseil du développeur Dave à Microsoft lorsqu’il l’a quitté cette société a été : « Les logiciels utiles qui se libéreront d'une plate-forme spécifique seront des vecteurs de fortes marges pour un bon moment »

  27. Qu’est-ce que le « web2.0 » • Modèle inspiré du p2p • Plus il y a d’utilisateurs, plus le système est performant • Les services mettent en relation des données et des personnes • Architecture de la participation : il faut donner pour recevoir, le système s’améliore au fur et à mesure que les gens l’utilisent

  28. Qu’est-ce que le « web2.0 » 1. Techniques 1.1 Ajax

  29. Qu’est-ce que le « web2.0 » • Ajax = Asynchronous JavaScript and XML, est devenu une des techniques star pour le développement d'applications web interactives. • Ajax est une « technologie » qui combine plusieurs langages qui se développent chacun de leur côté, et dont la synergie donne de nouveaux et puissants résultats.

  30. Qu’est-ce que le « web2.0 » • Ajax comporte • une présentation basée sur les standards XHTML et CSS • un affichage dynamique et interactif grâce à DOM (Document Object Model) • un système d'échange et de manipulation de données utilisant XML et XSLT • un mécanisme de récupération de données asynchrone utilisant XMLHttpRequest JavaScript pour lier le tout

  31. Web services • Portage des applications en ligne • Serveurs • Photos (Flickr) • Signets (Delicious) • Partage des données • Communautarisation • Auto-indexation • Pratiques de collaboration sur contenus

  32. Comparaison des modèles d’application • Le modèle classique est basé sur l’interrogation du serveur par le navigateur client et l’échange d’infos par http • Ajax est un modèle asynchrone qui utilise la description XML des données

  33. Qu’est-ce que le « web2.0 » 1.2 Interfaces riches • Un maximum de calculs se déroule sur le navigateur-client, ce qui libère de la bande passante sur le réseau et fluidifie les actions-utilisateurs sur l’interface

  34. Qu’est-ce que le « web2.0 » 1.3 La gestion des données est au cœur des produits • Les applications sont indépendantes des données qu’elles traitent.

  35. Qu’est-ce que le « web2.0 » 1.4 Mashup : Site internet ou application dont le contenu résulte d’une combinaison entre plusieurs sources d'information 1.5 API (Application programming interface) : interface de programmation d’application autorisant l’extraction et le traitement d’informations

  36. HousingMaps est un site « mashup » mixant Craiglist (site d’annonces) à GoogleMaps (API)

  37. Réalité économique du web2.0 ? • Pour les entreprises, cela représente une externalisation d’une partie des métiers de la création • Utilisation de technologies open-source (logiciels « non propriétaires ») • Faire travailler la « foule » : crowdsourcing • Résultat : une bulle ?

  38. Conséquences pour les usagers ? • Usager ? Interacteur ? Créateur ? Objectif des applications en ligne ? • Permettre aux usagers de • CRÉER • MODIFIER • PARTAGER • du contenu et des relations sociales • CRÉER DES GROUPES • AVOIR UNE VIE SOCIALE VIRTUELLE

  39. La courbe d’innovation du web

More Related