SlideShare une entreprise Scribd logo
1  sur  36
Télécharger pour lire hors ligne
Intro aux Technologies Web

                                      Everardo REYES
                                 DIMI M1, Université Paris 13




Thursday, January 5, 12
Vannevar Bush
                          [ EUA, 1890-1974 ]
               As We May Think, 1945
                          Système : Memex



Thursday, January 5, 12
Memex, Vannevar Bush, 1945




Thursday, January 5, 12
Theodor Holm Nelson
                                           [ EUA, 1937 ]
                    A file structure for the complex, 1965
   Notions : hypertext, hypermédia, transclusions
                                       Système : Xanadu




Thursday, January 5, 12
Permettez-moi d'introduire le mot hypertexte pour
                signifier un corpus composé de matériels écrits ou
                graphiques interconnectés d'une manière tellement
                complexe qu'il ne serait pas pertinent de le représenter
                sur papier. Il peut contenir des sommaires, ou des cartes
                de son contenu et de ses interrelations ; il peut
                contenir des annotations, des additions et des notes de
                bas de page insérés par les chercheurs qui l'ont examiné.

                 [ Nelson, 1965 ]




Thursday, January 5, 12
Hypertexte

                          Une forme “new media” de l’écriture, de la lecture et de
                          la pensée




Thursday, January 5, 12
Hypermédia

                          La différence est dans les noeuds :
                          images, animations, son, vidéo, applications




Thursday, January 5, 12
Composants de l’             hyperspace

                      Noeuds: unités basiques. Fragments d’information d’un ou plusieurs
                                                         types : texte, graphique, son, etc.


                            Liens : l’element qui organise les documents. Ils permettent de
                          “sauter” entre des documents ou des sous-paries plus spécifiques




Thursday, January 5, 12
Visualisation commune des hypertextes




Thursday, January 5, 12
Visualisation commune des hypermédias




Thursday, January 5, 12
Modèles de navigation




Thursday, January 5, 12
HyperCard, Bill Atkinson, 1987.


Thursday, January 5, 12
XanaduSpace, Ted Nelson, 2007.

Thursday, January 5, 12
Thursday, January 5, 12
Internet


                          1966                    c. 1986




          Échange d’informations            Réseau mondiale

                   Fin militaires            Accès publique

          Réseau privé et protogé   Transfert d’info par petits paquets

                                       Services de communication

                                      Usage du protocole TCP / IP




Thursday, January 5, 12
TCP
                          Transfer Control Protocol
                          Transmet les données


                          IP
                          Internet Protocol
                          Spécifie où vont les données




Thursday, January 5, 12
Connection




               Client / Usager
               demande des données
               envoie des données
               reçoit des données    Serveur
                                     attend des requêtes
                                     offre services Web




Thursday, January 5, 12
Services principales
                          1971 : email
                          1972 : telnet
                          1973 : FTP
                          1988 : IRC [ Internet Relay Chat ]
                          1991 : WWW
                          2008 : Social Network Games




Thursday, January 5, 12
Thursday, January 5, 12
•               Tim Berners-Lee [ UK, 1955 ]
      •                        HTML, HTTP, URL

      •                   W3 Consortium, w3c.org




Thursday, January 5, 12
http://www.google.com/intl/en/about.html




                          protocole                    nom de la route



                                      nom du domaine
                                         l e s e r ve u r         nom du fichier
                                       auquel on se                document ou
                                          co n n ec te            m édi a c o ns ul t é




Thursday, January 5, 12
Navigateurs Web


                   Interprète les langages Web et d’autres technologies en
                   réseau


                   Supporte plusieurs types de médias : texte, audio, vidéo,
                   applications, images




Thursday, January 5, 12
Mosaic, Marc Andressen, 1993
                 affichage d’images



Thursday, January 5, 12
Mosaic         Netscape 1.0   IE 4.0    Mozilla   Konqueror   Safari   Firefox 2   Chrome



             1993            1995         1997      1999       2000      2003       2007       2008


                                         Trident   Gecko      KHTML      KHTML     Gecko      WebKit
                                         Tasman




                                                                         2009
                                                                         WebKit




Thursday, January 5, 12
Web Dynamique


                  Interface : DHTML [ HTML + CSS + JavaScript ], AJAX, XUL
                  BDD : PHP + MySQL
                  Multimédia : SWF, SVG + SMIL, Canvas, Java
                  Services Web : RSS, WSDL, SOAP
                  3D: WebGL




Thursday, January 5, 12
http://evolutionofweb.appspot.com/




Thursday, January 5, 12
Web comme sujet              de recherche

                            Exemple d’outil pour amplifier nos capacités cognitives

                               Exemple du concept rhizome [ Deleuze et Guattari ]

                                               Approche des sciences de réseaux




Thursday, January 5, 12
Qu’est-ce qu’un réseau ?


                     Un ensemble de noeuds connectés pas des liens

                     Noeuds : unités, personnes, institutions, pages Web

                     Liens : connections entre des noeuds : relations sociales, hyperliens




                     Exemple : un réseau d’amis




Thursday, January 5, 12
Thursday, January 5, 12
Propriétés communes aux réseaux

                          Haut degré de clustering

                          Haute variété de degrés

                          Structure basée sur des hubs




Thursday, January 5, 12
Modèle : Small-World Networks


                          Il n’y a pas beaucoup de liens entre les noeuds

                          généralement 6 sauts

                          exemple : réseau de Kevin Bacon




Thursday, January 5, 12
•   Réseau simple


                                             •   Chaque noeud a deux connections


                                             •   Path length : no. de liens sur la route la
                                                 plus courte entre deux noeuds


                                             •   Avg. Path Length : la moyenne de path
                                                 lengths entre tous les pairs de noeuds
                                                 d’un réseau
                             Noeuds = 60
                          Path length = 01
                    Av. Path Length = 15




Thursday, January 5, 12
•   Si l’on ajoute 3 connections aléatoires, le
                              Avg. Path Length se réduit à 9


                          •   Un réseau de 1000 noeuds = 250 ALP.
                              Avec 5% de liens re-connectés
                              aléatoirement, le ALP est de 20




Thursday, January 5, 12
theyrule.net

Thursday, January 5, 12
Touchgraph sur Facebook


Thursday, January 5, 12
Thursday, January 5, 12

Contenu connexe

Tendances (8)

Les technologies du Web appliquées aux données structurées (2ème partie : Rel...
Les technologies du Web appliquées aux données structurées (2ème partie : Rel...Les technologies du Web appliquées aux données structurées (2ème partie : Rel...
Les technologies du Web appliquées aux données structurées (2ème partie : Rel...
 
Photos pc-mobile
Photos pc-mobilePhotos pc-mobile
Photos pc-mobile
 
Chap14 extrait
Chap14 extraitChap14 extrait
Chap14 extrait
 
Internet initiation
Internet initiation Internet initiation
Internet initiation
 
Cloud.pratique.2018
Cloud.pratique.2018Cloud.pratique.2018
Cloud.pratique.2018
 
Normes standards (numériques)
Normes standards (numériques)Normes standards (numériques)
Normes standards (numériques)
 
Création de collection numérique avec Greenstone (reloaded)
Création de collection numérique avec Greenstone (reloaded)Création de collection numérique avec Greenstone (reloaded)
Création de collection numérique avec Greenstone (reloaded)
 
Diapo Dropbox
Diapo DropboxDiapo Dropbox
Diapo Dropbox
 

En vedette

Preguntasdeemprendimiento
PreguntasdeemprendimientoPreguntasdeemprendimiento
Preguntasdeemprendimientoalejixx14
 
Vision
VisionVision
Visionviepe
 
Projet r12 peme 20 1-12
Projet r12 peme 20 1-12Projet r12 peme 20 1-12
Projet r12 peme 20 1-12Franck Dupont
 
MI TARJETA DE PRESENTACION
MI TARJETA DE PRESENTACIONMI TARJETA DE PRESENTACION
MI TARJETA DE PRESENTACIONForjando Valores
 
Act 2.3 cuadro comparativo equipo1
Act 2.3 cuadro comparativo equipo1Act 2.3 cuadro comparativo equipo1
Act 2.3 cuadro comparativo equipo1yeyavargas
 
Act 3.9 proyecto de innovación curricular equipo1
Act 3.9 proyecto de innovación curricular equipo1Act 3.9 proyecto de innovación curricular equipo1
Act 3.9 proyecto de innovación curricular equipo1yeyavargas
 
Act1.8 equipo1 final
Act1.8 equipo1 finalAct1.8 equipo1 final
Act1.8 equipo1 finalyeyavargas
 
Guideutilisateur
GuideutilisateurGuideutilisateur
GuideutilisateurCorporama
 
Municipio escuela cepad
Municipio escuela cepadMunicipio escuela cepad
Municipio escuela cepadCIDES UMSA
 
Presentacin intelliwebsearch (1)
Presentacin intelliwebsearch (1)Presentacin intelliwebsearch (1)
Presentacin intelliwebsearch (1)Alba Ortiz Núñez
 
שמונה ניסיונות העלייה לקרקע של גרעין אלון מורה 1974-1975
שמונה ניסיונות העלייה לקרקע של גרעין אלון מורה 1974-1975שמונה ניסיונות העלייה לקרקע של גרעין אלון מורה 1974-1975
שמונה ניסיונות העלייה לקרקע של גרעין אלון מורה 1974-1975ארכיון עפרה
 
Japonu daile
Japonu daileJaponu daile
Japonu daileSofija J.
 
Masque Iniciativas
Masque IniciativasMasque Iniciativas
Masque Iniciativasmesquetv
 

En vedette (20)

Preguntasdeemprendimiento
PreguntasdeemprendimientoPreguntasdeemprendimiento
Preguntasdeemprendimiento
 
Vision
VisionVision
Vision
 
Projet r12 peme 20 1-12
Projet r12 peme 20 1-12Projet r12 peme 20 1-12
Projet r12 peme 20 1-12
 
Microsoft Picture Manager
Microsoft Picture ManagerMicrosoft Picture Manager
Microsoft Picture Manager
 
MI TARJETA DE PRESENTACION
MI TARJETA DE PRESENTACIONMI TARJETA DE PRESENTACION
MI TARJETA DE PRESENTACION
 
Politicos y pp
Politicos y ppPoliticos y pp
Politicos y pp
 
Act 2.3 cuadro comparativo equipo1
Act 2.3 cuadro comparativo equipo1Act 2.3 cuadro comparativo equipo1
Act 2.3 cuadro comparativo equipo1
 
Act 3.9 proyecto de innovación curricular equipo1
Act 3.9 proyecto de innovación curricular equipo1Act 3.9 proyecto de innovación curricular equipo1
Act 3.9 proyecto de innovación curricular equipo1
 
Gastronomades
GastronomadesGastronomades
Gastronomades
 
Plaquette Réseaux Sociaux
Plaquette Réseaux SociauxPlaquette Réseaux Sociaux
Plaquette Réseaux Sociaux
 
Act1.8 equipo1 final
Act1.8 equipo1 finalAct1.8 equipo1 final
Act1.8 equipo1 final
 
Iea stabarbara
Iea stabarbaraIea stabarbara
Iea stabarbara
 
Guideutilisateur
GuideutilisateurGuideutilisateur
Guideutilisateur
 
Municipio escuela cepad
Municipio escuela cepadMunicipio escuela cepad
Municipio escuela cepad
 
Presentacin intelliwebsearch (1)
Presentacin intelliwebsearch (1)Presentacin intelliwebsearch (1)
Presentacin intelliwebsearch (1)
 
שמונה ניסיונות העלייה לקרקע של גרעין אלון מורה 1974-1975
שמונה ניסיונות העלייה לקרקע של גרעין אלון מורה 1974-1975שמונה ניסיונות העלייה לקרקע של גרעין אלון מורה 1974-1975
שמונה ניסיונות העלייה לקרקע של גרעין אלון מורה 1974-1975
 
La casita de chocolate
La casita de chocolateLa casita de chocolate
La casita de chocolate
 
FUTBOL II
FUTBOL IIFUTBOL II
FUTBOL II
 
Japonu daile
Japonu daileJaponu daile
Japonu daile
 
Masque Iniciativas
Masque IniciativasMasque Iniciativas
Masque Iniciativas
 

Plus de Everardo Reyes-García

L’image-interface : Approche sémio-technique des objets hypermédia
L’image-interface : Approche sémio-technique des objets hypermédiaL’image-interface : Approche sémio-technique des objets hypermédia
L’image-interface : Approche sémio-technique des objets hypermédiaEverardo Reyes-García
 
Experimental categorization and deep visualization
 Experimental categorization and deep visualization Experimental categorization and deep visualization
Experimental categorization and deep visualizationEverardo Reyes-García
 
A distant reading of Greimas' Dictionnaire
A distant reading of Greimas' DictionnaireA distant reading of Greimas' Dictionnaire
A distant reading of Greimas' DictionnaireEverardo Reyes-García
 
Enjeux des cultural analytics et sémiotique visuelle
Enjeux des cultural analytics et sémiotique visuelleEnjeux des cultural analytics et sémiotique visuelle
Enjeux des cultural analytics et sémiotique visuelleEverardo Reyes-García
 
Computer Art Congress 2016 [CAC.5] - Opening slides
Computer Art Congress 2016 [CAC.5] - Opening slidesComputer Art Congress 2016 [CAC.5] - Opening slides
Computer Art Congress 2016 [CAC.5] - Opening slidesEverardo Reyes-García
 
Méthodes pour l’analyse des images numériques
Méthodes pour l’analyse des images numériquesMéthodes pour l’analyse des images numériques
Méthodes pour l’analyse des images numériquesEverardo Reyes-García
 
Greimas.exe: digital code in the generative trajectory of expression
Greimas.exe: digital code in the generative trajectory of expressionGreimas.exe: digital code in the generative trajectory of expression
Greimas.exe: digital code in the generative trajectory of expressionEverardo Reyes-García
 
Design d’interface en contexte : une approche organogénétique
Design d’interface en contexte : une approche organogénétiqueDesign d’interface en contexte : une approche organogénétique
Design d’interface en contexte : une approche organogénétiqueEverardo Reyes-García
 
Motion Structures: opacity and translation
Motion Structures: opacity and translationMotion Structures: opacity and translation
Motion Structures: opacity and translationEverardo Reyes-García
 
Traitement d’images et média visualisation
Traitement d’images et média visualisationTraitement d’images et média visualisation
Traitement d’images et média visualisationEverardo Reyes-García
 
Présentation du cours Culture numérique
Présentation du cours Culture numériquePrésentation du cours Culture numérique
Présentation du cours Culture numériqueEverardo Reyes-García
 
Introducing digital humanities through the analysis of cultural productions
Introducing digital humanities through the analysis of cultural productionsIntroducing digital humanities through the analysis of cultural productions
Introducing digital humanities through the analysis of cultural productionsEverardo Reyes-García
 
Semiotics, software and media visualization
Semiotics, software and media visualizationSemiotics, software and media visualization
Semiotics, software and media visualizationEverardo Reyes-García
 

Plus de Everardo Reyes-García (20)

Faire Image / What Makes An Image?
Faire Image / What Makes An Image?Faire Image / What Makes An Image?
Faire Image / What Makes An Image?
 
L’image-interface : Approche sémio-technique des objets hypermédia
L’image-interface : Approche sémio-technique des objets hypermédiaL’image-interface : Approche sémio-technique des objets hypermédia
L’image-interface : Approche sémio-technique des objets hypermédia
 
Experimental categorization and deep visualization
 Experimental categorization and deep visualization Experimental categorization and deep visualization
Experimental categorization and deep visualization
 
A distant reading of Greimas' Dictionnaire
A distant reading of Greimas' DictionnaireA distant reading of Greimas' Dictionnaire
A distant reading of Greimas' Dictionnaire
 
Enjeux des cultural analytics et sémiotique visuelle
Enjeux des cultural analytics et sémiotique visuelleEnjeux des cultural analytics et sémiotique visuelle
Enjeux des cultural analytics et sémiotique visuelle
 
Computer Art Congress 2016 [CAC.5] - Opening slides
Computer Art Congress 2016 [CAC.5] - Opening slidesComputer Art Congress 2016 [CAC.5] - Opening slides
Computer Art Congress 2016 [CAC.5] - Opening slides
 
Méthodes pour l’analyse des images numériques
Méthodes pour l’analyse des images numériquesMéthodes pour l’analyse des images numériques
Méthodes pour l’analyse des images numériques
 
Greimas.exe: digital code in the generative trajectory of expression
Greimas.exe: digital code in the generative trajectory of expressionGreimas.exe: digital code in the generative trajectory of expression
Greimas.exe: digital code in the generative trajectory of expression
 
Design d’interface en contexte : une approche organogénétique
Design d’interface en contexte : une approche organogénétiqueDesign d’interface en contexte : une approche organogénétique
Design d’interface en contexte : une approche organogénétique
 
Motion Structures: opacity and translation
Motion Structures: opacity and translationMotion Structures: opacity and translation
Motion Structures: opacity and translation
 
Traitement d’images et média visualisation
Traitement d’images et média visualisationTraitement d’images et média visualisation
Traitement d’images et média visualisation
 
Présentation du cours Culture numérique
Présentation du cours Culture numériquePrésentation du cours Culture numérique
Présentation du cours Culture numérique
 
On Media Art Software
On Media Art SoftwareOn Media Art Software
On Media Art Software
 
Explorations in media visualization
Explorations in media visualizationExplorations in media visualization
Explorations in media visualization
 
Introducing digital humanities through the analysis of cultural productions
Introducing digital humanities through the analysis of cultural productionsIntroducing digital humanities through the analysis of cultural productions
Introducing digital humanities through the analysis of cultural productions
 
Semiotics, software and media visualization
Semiotics, software and media visualizationSemiotics, software and media visualization
Semiotics, software and media visualization
 
La visualité de Nirvana
La visualité de NirvanaLa visualité de Nirvana
La visualité de Nirvana
 
Esthétique des médias
Esthétique des médiasEsthétique des médias
Esthétique des médias
 
Disrupting 3D Models
Disrupting 3D ModelsDisrupting 3D Models
Disrupting 3D Models
 
Quelques principes du design web
Quelques principes du design webQuelques principes du design web
Quelques principes du design web
 

Dernier

Àma Gloria.pptx Un film tourné au Cap Vert et en France
Àma Gloria.pptx   Un film tourné au Cap Vert et en FranceÀma Gloria.pptx   Un film tourné au Cap Vert et en France
Àma Gloria.pptx Un film tourné au Cap Vert et en FranceTxaruka
 
Fiche de vocabulaire pour faire une appréciation
Fiche de vocabulaire pour faire une appréciationFiche de vocabulaire pour faire une appréciation
Fiche de vocabulaire pour faire une appréciationLeBaobabBleu1
 
Nathanaëlle Herbelin.pptx Peintre française
Nathanaëlle Herbelin.pptx Peintre françaiseNathanaëlle Herbelin.pptx Peintre française
Nathanaëlle Herbelin.pptx Peintre françaiseTxaruka
 
Texte avec différentes critiques positives, négatives ou mitigées
Texte avec différentes critiques positives, négatives ou mitigéesTexte avec différentes critiques positives, négatives ou mitigées
Texte avec différentes critiques positives, négatives ou mitigéesLeBaobabBleu1
 
ilide.info-cours-recherche-d-emploi-pr_aa839df7439dd234c803551c86e0197c.pdf
ilide.info-cours-recherche-d-emploi-pr_aa839df7439dd234c803551c86e0197c.pdfilide.info-cours-recherche-d-emploi-pr_aa839df7439dd234c803551c86e0197c.pdf
ilide.info-cours-recherche-d-emploi-pr_aa839df7439dd234c803551c86e0197c.pdfssuser6041d32
 
GHASSOUB _Seance 4_ measurement and evaluation in education_-.pptx
GHASSOUB _Seance 4_ measurement and evaluation in education_-.pptxGHASSOUB _Seance 4_ measurement and evaluation in education_-.pptx
GHASSOUB _Seance 4_ measurement and evaluation in education_-.pptxAbderrahim GHASSOUB
 
Un petit coin etwinning- Au fil des cultures urbaines
Un petit coin  etwinning- Au fil des cultures urbainesUn petit coin  etwinning- Au fil des cultures urbaines
Un petit coin etwinning- Au fil des cultures urbainesSocratis Vasiopoulos
 
Neuvaine de la Pentecôte avec des textes de saint Jean Eudes
Neuvaine de la Pentecôte avec des textes de saint Jean EudesNeuvaine de la Pentecôte avec des textes de saint Jean Eudes
Neuvaine de la Pentecôte avec des textes de saint Jean EudesUnidad de Espiritualidad Eudista
 
complement de agri cours irrigation.pptx
complement de agri cours irrigation.pptxcomplement de agri cours irrigation.pptx
complement de agri cours irrigation.pptxIbrahimBasallam
 
Saint Damien, missionnaire auprès des lépreux de Molokai, Hawaï.pptx
Saint Damien, missionnaire auprès des lépreux de Molokai, Hawaï.pptxSaint Damien, missionnaire auprès des lépreux de Molokai, Hawaï.pptx
Saint Damien, missionnaire auprès des lépreux de Molokai, Hawaï.pptxMartin M Flynn
 
Chapitre3-Classififcation des structures de chaussu00E9e.pptx
Chapitre3-Classififcation des structures de  chaussu00E9e.pptxChapitre3-Classififcation des structures de  chaussu00E9e.pptx
Chapitre3-Classififcation des structures de chaussu00E9e.pptxModesteTiemele
 
CALENDRIER ET COMPTE RENDU REUNION DIRECTION
CALENDRIER ET COMPTE RENDU REUNION DIRECTIONCALENDRIER ET COMPTE RENDU REUNION DIRECTION
CALENDRIER ET COMPTE RENDU REUNION DIRECTIONfrizzole
 
Réunion des directeurs de Jonzac - 15 mai 2024
Réunion des directeurs de Jonzac - 15 mai 2024Réunion des directeurs de Jonzac - 15 mai 2024
Réunion des directeurs de Jonzac - 15 mai 2024IEN_Jonzac
 
GHASSOUB _Seance 3_ measurement and evaluation in education.pptx
GHASSOUB _Seance 3_ measurement and evaluation in education.pptxGHASSOUB _Seance 3_ measurement and evaluation in education.pptx
GHASSOUB _Seance 3_ measurement and evaluation in education.pptxAbderrahim GHASSOUB
 

Dernier (14)

Àma Gloria.pptx Un film tourné au Cap Vert et en France
Àma Gloria.pptx   Un film tourné au Cap Vert et en FranceÀma Gloria.pptx   Un film tourné au Cap Vert et en France
Àma Gloria.pptx Un film tourné au Cap Vert et en France
 
Fiche de vocabulaire pour faire une appréciation
Fiche de vocabulaire pour faire une appréciationFiche de vocabulaire pour faire une appréciation
Fiche de vocabulaire pour faire une appréciation
 
Nathanaëlle Herbelin.pptx Peintre française
Nathanaëlle Herbelin.pptx Peintre françaiseNathanaëlle Herbelin.pptx Peintre française
Nathanaëlle Herbelin.pptx Peintre française
 
Texte avec différentes critiques positives, négatives ou mitigées
Texte avec différentes critiques positives, négatives ou mitigéesTexte avec différentes critiques positives, négatives ou mitigées
Texte avec différentes critiques positives, négatives ou mitigées
 
ilide.info-cours-recherche-d-emploi-pr_aa839df7439dd234c803551c86e0197c.pdf
ilide.info-cours-recherche-d-emploi-pr_aa839df7439dd234c803551c86e0197c.pdfilide.info-cours-recherche-d-emploi-pr_aa839df7439dd234c803551c86e0197c.pdf
ilide.info-cours-recherche-d-emploi-pr_aa839df7439dd234c803551c86e0197c.pdf
 
GHASSOUB _Seance 4_ measurement and evaluation in education_-.pptx
GHASSOUB _Seance 4_ measurement and evaluation in education_-.pptxGHASSOUB _Seance 4_ measurement and evaluation in education_-.pptx
GHASSOUB _Seance 4_ measurement and evaluation in education_-.pptx
 
Un petit coin etwinning- Au fil des cultures urbaines
Un petit coin  etwinning- Au fil des cultures urbainesUn petit coin  etwinning- Au fil des cultures urbaines
Un petit coin etwinning- Au fil des cultures urbaines
 
Neuvaine de la Pentecôte avec des textes de saint Jean Eudes
Neuvaine de la Pentecôte avec des textes de saint Jean EudesNeuvaine de la Pentecôte avec des textes de saint Jean Eudes
Neuvaine de la Pentecôte avec des textes de saint Jean Eudes
 
complement de agri cours irrigation.pptx
complement de agri cours irrigation.pptxcomplement de agri cours irrigation.pptx
complement de agri cours irrigation.pptx
 
Saint Damien, missionnaire auprès des lépreux de Molokai, Hawaï.pptx
Saint Damien, missionnaire auprès des lépreux de Molokai, Hawaï.pptxSaint Damien, missionnaire auprès des lépreux de Molokai, Hawaï.pptx
Saint Damien, missionnaire auprès des lépreux de Molokai, Hawaï.pptx
 
Chapitre3-Classififcation des structures de chaussu00E9e.pptx
Chapitre3-Classififcation des structures de  chaussu00E9e.pptxChapitre3-Classififcation des structures de  chaussu00E9e.pptx
Chapitre3-Classififcation des structures de chaussu00E9e.pptx
 
CALENDRIER ET COMPTE RENDU REUNION DIRECTION
CALENDRIER ET COMPTE RENDU REUNION DIRECTIONCALENDRIER ET COMPTE RENDU REUNION DIRECTION
CALENDRIER ET COMPTE RENDU REUNION DIRECTION
 
Réunion des directeurs de Jonzac - 15 mai 2024
Réunion des directeurs de Jonzac - 15 mai 2024Réunion des directeurs de Jonzac - 15 mai 2024
Réunion des directeurs de Jonzac - 15 mai 2024
 
GHASSOUB _Seance 3_ measurement and evaluation in education.pptx
GHASSOUB _Seance 3_ measurement and evaluation in education.pptxGHASSOUB _Seance 3_ measurement and evaluation in education.pptx
GHASSOUB _Seance 3_ measurement and evaluation in education.pptx
 

Séance 01. Introduction aux technologies Web

  • 1. Intro aux Technologies Web Everardo REYES DIMI M1, Université Paris 13 Thursday, January 5, 12
  • 2. Vannevar Bush [ EUA, 1890-1974 ] As We May Think, 1945 Système : Memex Thursday, January 5, 12
  • 3. Memex, Vannevar Bush, 1945 Thursday, January 5, 12
  • 4. Theodor Holm Nelson [ EUA, 1937 ] A file structure for the complex, 1965 Notions : hypertext, hypermédia, transclusions Système : Xanadu Thursday, January 5, 12
  • 5. Permettez-moi d'introduire le mot hypertexte pour signifier un corpus composé de matériels écrits ou graphiques interconnectés d'une manière tellement complexe qu'il ne serait pas pertinent de le représenter sur papier. Il peut contenir des sommaires, ou des cartes de son contenu et de ses interrelations ; il peut contenir des annotations, des additions et des notes de bas de page insérés par les chercheurs qui l'ont examiné. [ Nelson, 1965 ] Thursday, January 5, 12
  • 6. Hypertexte Une forme “new media” de l’écriture, de la lecture et de la pensée Thursday, January 5, 12
  • 7. Hypermédia La différence est dans les noeuds : images, animations, son, vidéo, applications Thursday, January 5, 12
  • 8. Composants de l’ hyperspace Noeuds: unités basiques. Fragments d’information d’un ou plusieurs types : texte, graphique, son, etc. Liens : l’element qui organise les documents. Ils permettent de “sauter” entre des documents ou des sous-paries plus spécifiques Thursday, January 5, 12
  • 9. Visualisation commune des hypertextes Thursday, January 5, 12
  • 10. Visualisation commune des hypermédias Thursday, January 5, 12
  • 12. HyperCard, Bill Atkinson, 1987. Thursday, January 5, 12
  • 13. XanaduSpace, Ted Nelson, 2007. Thursday, January 5, 12
  • 15. Internet 1966 c. 1986 Échange d’informations Réseau mondiale Fin militaires Accès publique Réseau privé et protogé Transfert d’info par petits paquets Services de communication Usage du protocole TCP / IP Thursday, January 5, 12
  • 16. TCP Transfer Control Protocol Transmet les données IP Internet Protocol Spécifie où vont les données Thursday, January 5, 12
  • 17. Connection Client / Usager demande des données envoie des données reçoit des données Serveur attend des requêtes offre services Web Thursday, January 5, 12
  • 18. Services principales 1971 : email 1972 : telnet 1973 : FTP 1988 : IRC [ Internet Relay Chat ] 1991 : WWW 2008 : Social Network Games Thursday, January 5, 12
  • 20. Tim Berners-Lee [ UK, 1955 ] • HTML, HTTP, URL • W3 Consortium, w3c.org Thursday, January 5, 12
  • 21. http://www.google.com/intl/en/about.html protocole nom de la route nom du domaine l e s e r ve u r nom du fichier auquel on se document ou co n n ec te m édi a c o ns ul t é Thursday, January 5, 12
  • 22. Navigateurs Web Interprète les langages Web et d’autres technologies en réseau Supporte plusieurs types de médias : texte, audio, vidéo, applications, images Thursday, January 5, 12
  • 23. Mosaic, Marc Andressen, 1993 affichage d’images Thursday, January 5, 12
  • 24. Mosaic Netscape 1.0 IE 4.0 Mozilla Konqueror Safari Firefox 2 Chrome 1993 1995 1997 1999 2000 2003 2007 2008 Trident Gecko KHTML KHTML Gecko WebKit Tasman 2009 WebKit Thursday, January 5, 12
  • 25. Web Dynamique Interface : DHTML [ HTML + CSS + JavaScript ], AJAX, XUL BDD : PHP + MySQL Multimédia : SWF, SVG + SMIL, Canvas, Java Services Web : RSS, WSDL, SOAP 3D: WebGL Thursday, January 5, 12
  • 27. Web comme sujet de recherche Exemple d’outil pour amplifier nos capacités cognitives Exemple du concept rhizome [ Deleuze et Guattari ] Approche des sciences de réseaux Thursday, January 5, 12
  • 28. Qu’est-ce qu’un réseau ? Un ensemble de noeuds connectés pas des liens Noeuds : unités, personnes, institutions, pages Web Liens : connections entre des noeuds : relations sociales, hyperliens Exemple : un réseau d’amis Thursday, January 5, 12
  • 30. Propriétés communes aux réseaux Haut degré de clustering Haute variété de degrés Structure basée sur des hubs Thursday, January 5, 12
  • 31. Modèle : Small-World Networks Il n’y a pas beaucoup de liens entre les noeuds généralement 6 sauts exemple : réseau de Kevin Bacon Thursday, January 5, 12
  • 32. Réseau simple • Chaque noeud a deux connections • Path length : no. de liens sur la route la plus courte entre deux noeuds • Avg. Path Length : la moyenne de path lengths entre tous les pairs de noeuds d’un réseau Noeuds = 60 Path length = 01 Av. Path Length = 15 Thursday, January 5, 12
  • 33. Si l’on ajoute 3 connections aléatoires, le Avg. Path Length se réduit à 9 • Un réseau de 1000 noeuds = 250 ALP. Avec 5% de liens re-connectés aléatoirement, le ALP est de 20 Thursday, January 5, 12