World wide web. PCI Permis de Conduire Informatique L1 1er semestre UFR d Informatique



Documents pareils
INTERNET est un RESEAU D ORDINATEURS RELIES ENTRE EUX A L ECHELLE PLANETAIRE. Internet : interconnexion de réseaux (anglais : net = réseau)

Les sites Internet dynamiques. contact : Patrick VINCENT pvincent@erasme.org

Programmation Internet Cours 4

TIC. Réseau informatique. Historique - 1. Historique - 2. TC - IUT Montpellier Internet et le Web

Bernard Lecomte. Débuter avec HTML

Théorie : internet, comment ça marche?

Les outils de création de sites web

Glossaire. ( themanualpage.org) soumises à la licence GNU FDL.

Utilisation de l éditeur.

E.N.T. Espace Numérique de Travail

3. RÉALISATION ET QUALIFICATION D UN PROTOTYPE 3.1 Réalisation d un prototype CRÉATION D UNE PAGE WEB STATIQUE AU FORMAT HTML

SEO On-page. Avez-vous mis toutes les chances de votre côté pour le référencement de votre site?

Guide Utilisateur ArkadinAnywhere

Le logiciel de création de site internet IZISPOT est un outil très puissant et qui est assez simple après quelques temps d utilisation.

Installation d un serveur HTTP (Hypertext Transfer Protocol) sous Débian 6

Manuel d utilisation de l outil collaboratif

Le Web et Internet. A. Historique : B. Définitions : reliés entre eux via un système d interconnexion.

Module BD et sites WEB

Publier dans la Base Documentaire

Dans nos locaux au 98 Route de Sauve NÎMES. Un ordinateur PC par stagiaire, scanner, imprimante/copieur laser couleur

CRÉER, ROUTER ET GÉRER UNE NEWSLETTER, UN ING

GUIDE D UTILISATION DU BACKOFFICE

Diffuser un contenu sur Internet : notions de base... 13

Maîtrisez votre Navigateur

COMMENT PUBLIER SUR ARIANE?

Services sur réseaux. Trois services à la loupe. Dominique PRESENT Dépt S.R.C. - I.U.T. de Marne la Vallée

MANUEL DE PROCÉDURE POUR LA MISE À JOUR DU SITE DE FIDAFRIQUE. Documentation utilisateur Octobre 2005

Formation Webmaster : Création de site Web Initiation + Approfondissement

HMTL. Exemple de fichier HTML. Structure d un document HTML. Exemple de fichier HTML. Balises HTML. IFT1147 Programmation Serveur Web avec PHP

Les services usuels de l Internet

Initiation à la recherche documentaire LA RECHERCHE SUR INTERNET

Syfadis. > Configuration du poste client. Nous vous aidons à réussir. REFERENCE : Syfadis LMS - 12/09/2008. AUTEUR : Equipe technique Syfadis

Caruso33 : une association à votre service

!" #$%&'(&)'*'+,--./&0'1&23,+2.)$4$%52'&%'6.%&2'

Manuel d utilisation du site web de l ONRN

Syfadis. > Configuration du poste client. Nous vous aidons à réussir. REFERENCE : Syfadis LMS - 20/06/2007. AUTEUR : Equipe technique Syfadis

... Cahier des charges Site Internet Office de Tourisme Lesneven - Côte des Légendes MAITRE D OUVRAGE

FICHE 1 : GENERALITES SUR INTERNET EXPLORER

FORMATION / CREATION DE SITE WEB / 4 JOURNEES Sessions Octobre 2006

Réglages du portail de P&WC

Autour du web. Une introduction technique Première partie : HTML. Georges-André SILBER Centre de recherche en informatique MINES ParisTech

KompoZer. Composition du site : _ une page d'accueil : index.html. _ une page pour la théorie : theorie.html. _ une page pour les photos : photos.

Référencement et visibilité sur Internet Comment améliorer la visibilité de son site internet sur les principaux moteurs de recherche?

NFA016 : Introduction. Pour naviguer sur le Web, il faut : Naviguer: dialoguer avec un serveur web

Introduction à Expression Web 2

Gestion des documents avec ALFRESCO

On trouvera sur le site du CCDMD un exemple d album construit avec Cantare. (

Présentation de Firefox

145A, avenue de Port Royal, Bonaventure (Québec) G0C 1E0 Sans frais :

Sessions en ligne - QuestionPoint

FICHIERS ET DOSSIERS

Foire aux questions. C est un programme d exploitation et de recherche sur le Web. Exemple : Internet Explorer, Firefox, Opera et Netscape.

<Créer un site Web. avec/> Suzanne Harvey

Internet. DNS World Wide Web. Divers. Mécanismes de base Exécution d'applications sur le web. Proxy, fire-wall

Manuel d utilisation

Logiciels de référencement

Mise en place d un intranet de travail collaboratif. Guide utilisateur

Programmation Web. Madalina Croitoru IUT Montpellier

Publier un Carnet Blanc

GUIDE D UTILISATION CRÉER SON SITE WEB - PROJET RESCOL

L3 informatique TP n o 2 : Les applications réseau

La navigation sur le Web avec Internet Explorer 6 Première approche

Créer et partager des fichiers

HTML. Notions générales

creer votre site internet en html/css

LANGAGUE JAVA. Public Développeurs souhaitant étendre leur panel de langages de programmation

Présentation Internet

MAILING KOMPOZER... 2 CREEZ UNE PAGE... 2 FORMAT DE LA PAGE... 2 AJOUTER DU TEXTE SUR UNE PAGE... 4

Atelier Le gestionnaire de fichier

1 ère Université WEB. Courbevoie Samedi 21 octobre Votre site interactif sur internet.

Point 3.7. Publier des contenus dans un portail e-sidoc. Janvier 2013 Documentation détaillée V 2.2

Gestion collaborative de documents

Gestion de contenu d un site web avec TYPO3 Manuel de l administrateur

Formation Web (Internet Explorer 7)

Guide de l utilisateur. Faites connaissance avec la nouvelle plateforme interactive de

Groupe Eyrolles, 2003, ISBN : X

Formation Site Web. Menu du jour. Le web comment ça marche? Créer un site web Une solution proposée pour débuter La suite?

Répondre à un courrier - Transférer un courrier 20

iil est désormais courant de trouver sur Internet un document

OSIRIS/ Valorisation des données PORTAIL BO MANUEL UTILISATEUR

Atelier Internet de base ( Internet I ) ... JB 14 septembre 2008 (Canevas original : Marcel Pouliot)

LES TABLETTES : EN PRATIQUE

Architectures web/bases de données

Plan. Avant de créer son site. Quelques logiciels complémentaires

Guide d utilisation 2012

Documentation Honolulu 14 (1)

Bureautique Initiation Excel-Powerpoint

E-Remises Paramétrage des navigateurs

INTERNET, C'EST QUOI?

Créer un diaporama avec OpenOffice.org Impress

L accès à distance du serveur

Magento. Magento. Réussir son site e-commerce. Réussir son site e-commerce BLANCHARD. Préface de Sébastien L e p e r s

Optimiser moteur recherche

ENVOI EN NOMBRE DE Mails PERSONNALISES

DÉFINITION DE LA NEWSLETTER : OUVERTURE DU LOGITIEL ETARGET

< Atelier 1 /> Démarrer une application web

Évaluation des compétences. Identification du contenu des évaluations. Septembre 2014

FileMaker Server 11. Publication Web personnalisée avec XML et XSLT

CMS Modules Dynamiques - Manuel Utilisateur

Sommaire. Images Actives Logiciel libre développé par le CRDP de l académie de Versailles 2 Rue Pierre Bourdan Marly le Roi

Transcription:

World wide web PCI Permis de Conduire Informatique L1 1er semestre UFR d Informatique

Objectifs du cours et des 3 TP 1. Objectifs du cours Découvrir ce qu est le Web et comment ça marche Être capable de personnaliser un navigateur Connaître les différentes sources d information et les moyens de rechercher des informations sur le Web Être capable de créer une page Web simple introduction au langage XHTML notions de droit du Web PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 2

Le Web : historique rapide 1. Objectifs du cours 2. Principes généraux 1946 invention de la notion d hypertexte 1970 développement de l Internet 1989-91 application de la notion d hypertexte à Internet : CERN, Tim Berners-Lee 1993 diffusion universitaire (navigateur Xmosaic) 50 serveurs dans le monde création du W3C pour normaliser le Web 1994-95 navigateurs privés (Netscape puis IE) 1998 : 2,2 millions de sites 2000 : 20 millions de sites (2,5 milliards de pages) 2002 : 3 / 550 milliards de pages (web de surface / web profond) 2005 : Google prétend indexer 8 milliards de pages PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 3

Le Web en un schéma 1. Objectifs du cours 2. Principes généraux Internet Navigateur = Client Web HTTP Serveur Web Serveur Web HTML PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 4

Différents médias 1. Introduction 1. Objectifs du cours 2. Principes généraux Différentes formes pour l utilisateur texte image (photo, dessin, graphique) son (musique, voix) vidéo (images animées + son) Différents formats de fichiers texte simple : ASCII (.txt) images : JPEG (.jpg), GIF (.gif) sons : WAVE (.wav), MPEG3 (.mp3) vidéo : MPEG (.mpg), AVI (.avi), Quicktime (.qt) Différentes applications permettant de «lire» les fichiers (ouvrir les documents) éditeur de texte visualisateur d images lecteur de son, de vidéo PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 5

Document multimédia 1. Introduction 1. Objectifs du cours 2. Principes généraux Combinaison de différents médias textes + images + sons + vidéos Deux caractéristiques principales «ça bouge» : le document se déroule temporellement (vidéo, son, objets animés) «c est interactif» : on peut cliquer sur un bouton, suivre un lien hypertexte, remplir une zone texte... Exemples d utilisations cours, jeux interactifs, logiciels éducatifs, encyclopédies interactives, bornes dans les lieux publics, pages Web, films DVD PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 6

1. Objectifs du cours 2. Principes généraux Plusieurs façons de décrire un document Représenter un document Ceci est du texte. Ceci est du texte. Ceci est du texte. Ceci est du texte. Ceci est du texte. Description «par points» coordonnées couleur Document = titre + image + paragraphe Titre = Texte + Position Texte = "Le titre" Position = Haut ET Centré Paragraphe = Texte + Position Texte = "Blablah " Position = Gauche Image = Fichier + Position Fichier = "logo-ucbl.gif" Position = ADroite Paragraphe Description «par éléments» document décomposé en zones, puis zones décrites en détaillant petit à petit les éléments PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 7

Page Web - définitions Une page Web, c est un document multimédia images, textes, possibilité d interaction décrit élément par élément titre, morceaux de texte, images... avec un langage de description HTML (1992) ou XHTML (2002) stocké dans un fichier.html (ou.htm,.xhtml) Une page Web 1. Introduction 1. Objectifs du cours 2. Principes généraux est calculée et affichée par un navigateur se trouve à un endroit sur Internet décrit par une adresse (URL) permet d accéder à d autres pages en suivant des liens PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 8

URL (Uniform Resource Locator) Permet d identifier une ressource sur le réseau, c est-à-dire : une page Web une image (seule ou utilisée dans une page Web) un programme un fichier à télécharger Indique 1. Introduction un protocole (langage de communication entre deux programmes sur deux machines). Exemple: FTP (File Transfert Protocol), HTTP (HyperText Transfert Protocol) une adresse et un chemin 1. Objectifs du cours 2. Principes généraux forme générale : protocole://adresse exemple : http://www.univ-lyon1.fr/ PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 9

Différents types d URL 1. Objectifs du cours 2. Principes généraux Forme principale (protocole HTTP) http://pci.univ-lyon1.fr/c2i/annonce.html Protocole Adresse machine Chemin fichier Forme pour désigner les fichiers locaux Chemin relatif : fichier.html ou dossier/toto.html Sur un disque : file://c:/chemin/fichier.htm Forme pour le transfert de fichiers ftp://ftp.inria.fr/inria/tech-reports/rr-5645.pdf Forme pour l envoi de courrier électronique mailto:jean.durand@univ-lyon1.fr PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 10

Présentation d une page (X)HTML dans un navigateur Page Web fichier html Navigateur (browser, butineur) logiciel qui demande des fichiers (X)HTML, les reçoit, les interprète et les présente à l utilisateur Principaux navigateurs Mozilla Firefox, Netscape Communicator, Opera, Microsoft Internet Explorer Fichier HTML 1. Introduction Navigateur 1. Objectifs du cours 2. Principes généraux Utilisateur <html> <head> <title>université Claude Bernard Lyon 1</title> <meta httpequiv="content-type" content="text/html; charset=iso-8859-1"> </head> </html> Description du document Calcul Présentation à l utilisateur PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 11

Un élément est une partie significative d un document TITRE, AUTEUR, PARAGRAPHE, IMAGE, LIEN, TABLEAU peut être composé d autres éléments un DOCUMENT est composé d un TITRE et d une suite de PARAGRAPHE un TABLEAU est composé de LIGNEs une LIGNE est composé de CASEs peut avoir des attributs 1. Introduction 1. Généralités 2. Balises 3. Tableaux Un document comme composition d éléments un attribut "nom du fichier" pour un élément IMAGE un attribut "URL de destination" pour un élément LIEN Pour les pages Web 40 éléments de description dans les langages (X)HTML (PCI : quelques éléments de base, syntaxe XHTML) PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 12

HTML permet de décrire des pages Web dans des fichiers textuels (ASCII) en utilisant des balises Balises mots-clés simples pour délimiter des descriptions d éléments (title, img, p...) balises ouvrantes (<title>), fermantes (</title>), vides (<hr />) balises avec attributs (<a href="http://pci.univ-lyon1.fr">) Un élément est en général délimité par deux balises <p>un paragraphe...</p> 1. Généralités 2. Balises 3. Tableaux HTML (HyperText Markup Language) peut être décrit par une balise, avec des attributs <img src="zebre.jpg" alt="image de zèbre" /> peut en contenir un autre (récursivement) <p>un paragraphe avec un mot en <b>gras</b> (bold).</p> (= l élément p contient l élément b) PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 13

1. Généralités 2. Balises 3. Tableaux Exemple de description dans le langage à balise HTML Balise ouvrante <html> <head> <title>merveilles du monde</title> </head> Élément avec contenu Balise d élément vide (une seule balise) Balise fermante <body> <p>dans l image ci-après <img src="zebre.jpg" alt="image de zèbre" /> nous présentons un zèbre vivant dans la savane. </p> <p> Attributs de l élément Image <img src="lion.gif" alt="image de lion" /> Le lion n est pas vraiment son ami </p> </body> </html> html head body title p p img img Arborescence PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 14

Structuration de documents <html> Élément titre <head> <title>ceci est le titre</title> </head> 1. Généralités 2. Balises 3. Tableaux En-tête balise de corps avec attribut couleur de fond (ici blanc) commentaire <body bgcolor="#ffffff"> <!- - ou "white" - -> <p>paragraphe A</p> Paragraphes <p>paragraphe B</p> <h1>titre de niveau 1</h1> <p>paragraphe C</p> <h2>titre de niveau 2</h2> <h3>titre de niveau 3</h3> <h4>titre de niveau 4</h4> <p>...</p> <h6>titre de niveau 6</h6> </body> </html> 6 niveaux de titres Corps Titre de niveau 6 PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 15

1. Généralités 2. Balises 3. Tableaux Mise en forme : gras, italiques, souligné et listes Ceci est en gras (bold). Ceci est en italique et gras. <p>ceci est en <b>gras</b> (bold).</p> <p>ceci en <b><i>italique et gras</i></b>.</p> Ceci est souligné (underlined). Voici une ligne dans une liste à puces et une autre ligne. <p>ceci est <u>souligné</u> (underlined).</p> <p>voici une</p> <ul> Élément liste non numérotée (Unordered list) <li>ligne dans une liste à puces</li> <li>et une autre ligne.</li> </ul> Élément item de liste (List Item) PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 16

Insertion de liens 1. Introduction 1. Généralités 2. Balises 3. Tableaux Syntaxe générale : <a href="url_du_lien">texte du lien</a> «a» pour «anchor» (ou ancre de lien). <p><a href="http://www.univ-lyon1.fr/">ceci est un lien vers le serveur Web de Lyon 1. </a></p> <p>voici <a href="fichier.html">un lien</a> vers fichier.html situé dans le même dossier que le fichier en cours.</p> <p>voici un lien qui permet de <a href="ftp://wwwcrig.univlyon1.fr/livret/cycle1/deugsv.pdf">télécharger</a> un fichier par FTP.</p> <p>si je clique <a href="mailto:jean.durand@univlyon1.fr">ici</a>, j'envoie un courrier électronique à Jean Durand.</p> PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 17

Insertion d images 1. Introduction 1. Généralités 2. Balises 3. Tableaux Syntaxe générale : <img src="url_de_l_image" alt="texte alternatif" />... <p>voici une photo aérienne de Lyon (chemin relatif): <img src="vue-du-ciel.jpg" alt="lyon aérien" /></p> Élément image <p>voici une photo de Fourvière (URL distant) : <img src="http://www.lyoncity.org/static/vdl/contenu/decouverte/au_fil_des_q uartiers/s_odeon.jpg" alt="fourvière" />.</p> <p>cliquer sur le logo <a href="http://www.univlyon1.fr/"><img src="logo-ucbl-3d.png" alt="site web de Lyon 1" /></a> pour visiter le site Web de Lyon 1.</p> L élément lien contient un élément image PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 18

Tableaux 1. Introduction 1. Généralités 2. Balises 3. Tableaux attribut «épaisseur de bordure» <table border="1"> <tr> <td>haut gauche</td> <td>haut droite</td> </tr> <tr> <td>milieu gauche</td> <td>milieu droite</td> </tr> <tr> <td>bas gauche</td> <td>logo UCBL <img </td> </tr> </table> Élément cellule de tableau Élément ligne de tableau src="logo-ucbl-3d.png" alt="logo" /> PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 19

1. Principes de base 2. Publication d un site Web 3. Fonctionnalités des navigateurs 4. Naviguer sur le Web Technologie Web : une description plus formelle navigateur le Web un site Web Ensemble de pages HTML formant un réseau (ou une toile : web en anglais) sur lequel il est possible de naviguer WWW = World Wide Web Navigateur outil permettant d afficher des pages HTML et de passer d une page à l autre au moyen de liens hypertextes navigation Site Web regroupement de pages Web, accessible à partir d une URL PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 20

Serveur Web 1. Introduction 1. Principes de base 2. Publication d un site Web 3. Fonctionnalités des navigateurs 4. Naviguer sur le Web Application dont le rôle est de fournir des ressources Web aux clients (navigateurs) qui les demandent Par extension, machine sur laquelle s exécute cette application Requête HTTP = demande d une ressource (URL) Internet Navigateur = client Web Serveurs Web Réponse = envoi de ressource (fichier HTML, image...) PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 21

Caractéristiques de la connexion Temps d affichage d une page Web lié à la charge du serveur réponse à n clients en même temps temps nécessaire au serveur pour «calculer» la page à envoyer à l encombrement du réseau à la vitesse de la machine cliente à la possibilité de présenter une page avant que toutes les données soient arrivées (ex. texte avant images, chargement asynchrone ) Deux possibilités pour fournir une page à partir de fichiers existants sur le serveur 1. Introduction 1. Principes de base 2. Publication d un site Web 3. Fonctionnalités des navigateurs 4. Naviguer sur le Web en générant la page HTML au moment de la requête PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 22

1. Principes de base 2. Publication d un site Web 3. Fonctionnalités des navigateurs 4. Naviguer sur le Web Mécanisme de requête / réponse HTTP Cas simple : le fichier demandé est présent sur le serveur, il suffit de renvoyer au client Requête du client : URL de la ressource en général, le nom du fichier apparaît explicitement dans l url : URL finissant en.html,.htm,.jpg... Réponse du serveur : code de statut / d erreur + ressource (éventuellement) tout s est bien passé : «OK» (code de statut : 200) pas le droit d accéder : «forbidden» (code d erreur : 403) la ressource n existe pas : «not found» : (code d erreur : 404) Exemple de transaction Client 5- calcul de la présentation à l utilisateur 1- demande ressource fichier HTML 3- analyse du fichier et demande ressource image 2- envoi fichier HTML 4- envoi fichier image Serveur PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 23

Transactions pour un fichier HTML 1. Principes de base 2. Publication d un site Web 3. Fonctionnalités des navigateurs 4. Naviguer sur le Web fichier.html <html> <head> <title>insertion IMAGES</title> </head> <body bgcolor="#ffffff"> <p>voici une photo aérienne de Lyon (chemin relatif) : <img src= "vue-duciel.png" alt="vue du ciel" />.</p> <p>voici une autre photo (URL distante) : <img src="http://www.lyoncity.org/static/vdl/conten u/decouverte/au_fil_des_qu artiers/s_odeon.jpg" alt="odeon" />..</p> <p>cliquer sur le logo <a href="http://www.univlyon1.fr/"><img src="logo-ucbl-3d.png" alt="logo UCBL" /></a> pour visiter le site Web de Lyon 1.</p> </body> </html> Client 3- calcul de la page décrite dans "fichier.html", début d affichage 5- affichage de "vue-du-ciel.png" dans la page 8- affichage de "s_odeon.jpg" dans la page 11- affichage de "logoucbl-3d.png" dans la page, fin d affichage de la page 1- demande ressource "fichier.html" 2- envoi "fichier.html" Serveur local 3 - demande ressource "vue-du-ciel.png" 4- envoi "vue-du-ciel.png" 6- demande ressource "s_odeon.jpg" 7- envoi "s_odeon.jpg" 9- demande ressource "logo-ucbl-3d.png" 10- envoi "logo-ucbl-3d.png " Serveur www.lyon-city.org Quelques millisecondes PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 24

Pages générées dynamiquement Client 1. Introduction 1- demande page 3- envoi 1. Principes de base 2. Publication d un site Web 3. Fonctionnalités des navigateurs 4. Naviguer sur le Web Cas plus complexe : il faut créer une page à partir d informations indiquées par le client (formulaires, cookies) présentes sur le serveur (fichiers de données, pages statiques) présentes sur d autres serveurs (web ou bases de données) : le serveur considéré est le client d autres serveurs Le mécanisme de requête / réponse reste le même Le serveur doit calculer la ressource avant de la renvoyer utilisation d un langage de programmation côté serveur (PHP, ASP, Java, Python, Perl ) Serveur Exemple infos Serveur 2- accès autres serveurs, calcul de la page Serveur Météo Serveur Publicité Informations client sur base de données locale PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 25

Conception, transfert et accès 1. Principes de base 2. Publication d un site Web 3. Fonctionnalités des navigateurs 4. Naviguer sur le Web Site Web local, sur votre machine Site Web mis à disposition sur le serveur Internet Client Web (navigateurs) 1- Mise au point, modifications, tests 2- Transfert de fichiers 3- Mise à disposition 4- Accès Web PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 26

Plusieurs situations type 1. Principes de base 2. Publication d un site Web 3. Fonctionnalités des navigateurs 4. Naviguer sur le Web Cas d un particulier site chez le Fournisseur d Accès Internet conception en local à la maison transfert des fichiers chez le FAI par FTP site sur la machine à la maison conception en local sur une partie du disque copie de fichiers sur le site publié Cas d une entreprise site externalisé (conception, mise à disposition) site conçu en interne et mis à disposition sur un serveur de l entreprise Cas de votre page à l Université (site mis à disposition sur le serveur Web du Bureau Virtuel) publication automatique d un dossier particulier de votre lecteur réseau Unix (U:) par un serveur web du BV transfert soit par copie de fichiers (de l intérieur de la fac), soit par FTP via le BV PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 27

Organisation d URL par signets 1. Principes de base 2. Publication d un site Web 3. Fonctionnalités des navigateurs 4. Naviguer sur le Web Signets (marque-pages, favoris, bookmarks) stocker des URL pour pouvoir retrouver des pages Web plus tard (possibilité d ajouter des commentaires) organiser ses signets Exemple arborescence (hiérarchie) de «dossiers» Mes favoris Moteurs de recherche Loisirs Travail URL Altavista Cinéma Télé URL Arte URL France 3 URL Site Lyon 1 URL Programme cinéma PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 28

1. Principes de base 2. Publication d un site Web 3. Fonctionnalités des navigateurs 4. Naviguer sur le Web Organisation d URL dans l historique Historique pendant une navigation, on consulte une suite de pages Web, le navigateur en garde trace comme liste d URL possibilité d aller en arrière, en avant, ou directement à une page URL1 Page de départ Accès direct à une page de l historique Page courante URL2 URL3 URL4 Accès à la page précédente Accès à la page suivante PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 29

Impression de pages Web 1. Principes de base 2. Publication d un site Web 3. Fonctionnalités des navigateurs 4. Naviguer sur le Web Une page Web n est en général pas prévue pour l impression attention au gaspillage de papier plus un document est complexe, moins il a de chances de s imprimer de façon satisfaisante Quelques conseils attention aux couleurs de fond et de texte si seul le texte est intéressant copier / coller vers un éditeur de texte, remettre en page, puis imprimer les sites les mieux faits proposent des pages prévues pour l impression (ex. bouton «Pour imprimer») PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 30

Scripts éléments de programmes (identifiés par l élément <script>) à l intérieur des pages HTML ou dans des fichiers séparés écrits dans des langages de programmation spécifiques (JavaScript, VBScript) exécutés (interprétés) par le navigateur de l ordinateur client soumis à des restrictions de sécurité (pas d accès aux fichiers du client, pas d exécution d autres programmes ) Exemples 1. Introduction Interpréteurs de scripts 1. Principes de base 2. Publication d un site Web 3. Fonctionnalités des navigateurs 4. Naviguer sur le Web gestion du navigateur (lancer des fenêtres, créer des info-bulles ) gestion de la navigation (vérifier qu un formulaire est bien rempli avant de l envoyer ) documents plus interactifs et dynamiques qu avec (X)HTML seul Il est possible de désactiver l interpréteur Javascript du navigateur PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 31

Exécution d applets Java 1. Principes de base 2. Publication d un site Web 3. Fonctionnalités des navigateurs 4. Naviguer sur le Web Java langage de programmation qui peut fonctionner sur tout type de machine (matériels et systèmes d exploitation différents) doit être installé sur la machine avant de pouvoir exécuter des programmes Applet élément de programme Java restrictions de sécurité au niveau des fonctionnalités autorisées Utilisation dans une page Web, on spécifie le nom de l applet à exécuter dans un élément <applet> l applet s exécute dans une portion de la page présentée à l utilisateur La page Web est calculée et présentée L applet s exécute Serveur Fichier HTML Fichier JAVA PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 32

Plug-in Principe étendre les possibilités du navigateur pour présenter des éléments HTML (décrits par l élément <object>) non gérés par le navigateur le navigateur donne toute ou une portion de la page Web à un programme «branché» (plug-in) qui prend en charge l exécution ou l affichage (cf. applet Java) S il n est pas disponible, on peut en général le télécharger et l installer Exemples 1. Introduction Flash / Shockwave : documents multimédias Real Audio / Vidéo : sons ou vidéos Acrobat : documents PDF Oh! le plug in 1. Principes de base 2. Publication d un site Web 3. Fonctionnalités des navigateurs 4. Naviguer sur le Web Client Fichier HTML + fichier flash, PDF... affichage géré par le plug-in affichage géré par le navigateur Serveur PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 33

Qu est-ce que naviguer sur le Web? 1. Principes de base 2. Publication d un site Web 3. Fonctionnalités des navigateurs 4. Naviguer sur le Web Navigation proprement dite aller directement à une page en tapant son URL aller d une page à une autre en suivant un lien remplir et envoyer des formulaires Activités liées à la navigation arrêter des chargements trop longs (bouton Stop) recharger une page qui a été modifiée (bouton Reload) mener plusieurs navigations en parallèle (plusieurs fenêtres / onglets) définir et organiser ses signets envoyer des courriers électroniques en cliquant sur des liens télécharger des fichiers Attention à la communication de vos données personnelles l échange de données peut être sécurisé (ex. paiement par Carte Bleue) mais vos informations arrivent toujours quelque part avez-vous confiance en la personne ou l entreprise qui les réceptionne? PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 34

Le Web : une définition étendue 1. Principes de base 2. Publication d un site Web 3. Fonctionnalités des navigateurs 4. Naviguer sur le Web World Wide Web (WWW, Toile) Définition ensemble des données disponibles sur les serveurs accessibles sur le réseau Internet pouvant être visualisées et/ou utilisées à partir d un navigateur Web Attention : Web Internet Internet = support de communication général Web = une partie des contenus circulant sur l Internet PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 35

Droit du Web - Les états et le Web 1. Principes de base 2. Publication d un site Web 3. Fonctionnalités des navigateurs 4. Naviguer sur le Web Surveillance police, services secrets Le point de vue de la justice (en France) la loi qui s applique est celle du pays où un contenu est lu et/ou fourni responsabilité de la personne qui créé et diffuse un contenu les FAI ne sont responsables des contenus délictueux que s ils contribuent à les créer, ou refusent de collaborer avec la justice le FAI accède à toute demande de renseignements de la Justice PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 36

1. Principes de base 2. Publication d un site Web 3. Fonctionnalités des navigateurs 4. Naviguer sur le Web Droit du Web - Quelques règles de bon sens Toute activité informatique peut être enregistrée l anonymat n existe pas Mettre à disposition une page Web, c est la publier ( courrier électronique) le droit s applique diffamation, respect de la vie privée droits d auteur (ex. images) : demander l autorisation des ayants-droit avant d utiliser PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 37

Rechercher des informations? 1. Considérations générales 2. Moteurs de recherche 3. Portails 4. Avenir Nous passons notre temps à le faire exemple : s inscrire à la fac trouver les formulaires, les bureaux On fait plus ou moins confiance aux informations suivant les enjeux plus ou moins grand besoin de fiabilité suivant la source de l information (confiance) document officiel prospectus publicitaire extrait de conversation entendue PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 38

Sources d information sur Internet 1. Considérations générales 2. Moteurs de recherche 3. Portails 4. Avenir - Pérennité, fiabilité? + Pages personnelles Un particulier met un ensemble de connaissances à disposition du reste du monde (coin à champignons, mécanique, comment faire une page Web...) Pages d organisations Un groupe d individus met à disposition des informations. Pages institutionnelles Une institution de l État joue son rôle en mettant des informations à disposition des citoyens (Ministère des Finances, Journal Officiel...) Organisations à but non lucratif (Amicale des Boulistes de Villeurbanne, Médecins du Monde ) Organisations à but lucratif (Casse-auto 69, Infogrames, Total-Elf) PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 39

Différents types de documents sur le Web Pages Web personnelles document libre FAQ 1. Introduction Foire Aux Questions, Frequently Asked Questions ensemble de questions/réponses classiques sur des sujets très variés (science, vie pratique...) lié à des communautés How-to description de la manière de faire une certaine action (ex. comment installer un logiciel) Articles (cf. journaux, documents d information) forme ± standard et figée (auteur, titre, date...) Tableaux synoptiques, listes réponse à une requête (offres d emplois...) Cartes et plans 1. Considérations générales 2. Moteurs de recherche 3. Portails 4. Avenir PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 40

Confiance en l information disponible sur le Web Quelle information sur le Web? à peu près tout, sur tout et son contraire (fiabilité discutable) Il faut analyser l information en fonction de sa source de sa forme (type de document) de la confiance que vous lui accordez Questions auteur identifié? auteur identifiable? institution? 1. Introduction 1. Considérations générales 2. Moteurs de recherche 3. Portails 4. Avenir importance de la validité (puis-je utiliser l information comme preuve)? date de rédaction? durée de validité de l information? PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 41

Recherche d information sur le Web Recherche d information navigation simple (plus ou moins au hasard) en accédant directement à des URL connues en naviguant de lien en lien assistance à la recherche : outils annuaires moteurs de recherche portails 1. Introduction 1. Considérations générales 2. Moteurs de recherche 3. Portails 4. Avenir PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 42

Indexation 1. Introduction 1. Considérations générales 2. Moteurs de recherche 3. Portails 4. Avenir Index quelque chose permettant d accéder à autre chose marque-page, table des matières ex. des bibliothèques : Auteur, Titre, ISBN, Mot-clés... Sur le Web, un index c est une description du site ex. «Ce site est le site officiel de l UCBL, il présente les diverses composantes de la faculté...» un identifiant qui permet l accès au site : son URL Index Description URL http://www.univ-lyon1.fr quelque chose permettant d accéder à autre chose quelque chose permettant d accéder à autre chose quelque chose permettant d accéder à autre Page Web indexée Problème sur le Web, comment indexer (décrire) des documents pour aider un utilisateur à les trouver? PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 43

Annuaires Web - Principe 1. Considérations générales 2. Moteurs de recherche 3. Portails 4. Avenir Principe des documentalistes professionnels indexent une partie du Web classification des sites créer une hiérarchie (arborescence) de thèmes de plus en plus spécifiques description de documents en quelques lignes Actualités et médias Art et culture Commerce et économie Actualités personnalisées (8) Annuaires et guides Web (20) Chroniques (9) Documentaires (6) AP Mail - Le service personnalisé de l'associated Press pour recevoir les dépêches par email. dernières.com - Revue de presse quotidienne. Moteur de recherche dans la presse. Actualités personnalisées par e-mail. Diora - Sélection d'actualités radiophoniques en politique, économie, sport, musique, cinéma, bourse et voyages. PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 44

Annuaires Web - Exemples 1. Considérations générales 2. Moteurs de recherche 3. Portails 4. Avenir Lycos Voila Google PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 45

Indexation «en texte intégral» Principe un texte est un ensemble de mots ces mots peuvent décrire le texte donc un texte contient ses propres index Application chercher automatiquement dans un texte les mots-clés qui vont le décrire, puis les stocker comme index du texte Traitements statistiques chercher les mots les plus pertinents (ceux qui n apparaissent pas trop souvent) éliminer les «mots vides» (est, au, le, la ) Texte différent des répertoires : au lieu de considérer qu un humain indexe un document, on prend appui sur le fait qu un texte est un ensemble de mots, et que ces mots peuvent décrire le texte : un texte est sa propre indexation 1. Introduction Mots du texte différent annuaire considérer humain document 1. Considérations générales 2. Moteurs de recherche 3. Portails 4. Avenir Indexation différer différent différemment Textes décrits par «différent» Différe dd d d d d ddnt des répert PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 46 Différe dd d d d d ddnt des répert Différe dd d d d d ddnt des répert

Définitions Principe des «robots» (logiciels spécifiques) parcourent le Web, lisent le texte des pages, les indexent automatiquement et stockent les résultats Moteur de recherche serveur Web permettant de rechercher dans les index mis en place Interrogation Réponse requête : ensemble de mots fournis au moteur grâce à un formulaire pour l interroger ensemble de pages Web répondant à la requête, classées par pertinence décroissante (ex. nombre de mots-clés justes) Cycle de recherche 1. Introduction 1. Considérations générales 2. Moteurs de recherche 3. Portails 4. Avenir si trop de réponses, ou réponses non satisfaisantes, modifier la requête pour affiner les résultats Requêtes Client Réponses Moteur de recherche PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 47

Syntaxe des requêtes (1/2) OU certains des termes doivent faire partie des index des documents trouvés l ordre des réponses dépend du nombre de termes trouvés syntaxe ET recherche OR information les termes doivent tous faire partie des index des documents trouvés syntaxes +recherche +information recherche AND information utilisé par défaut par la majorité des moteurs NON le terme ne doit pas faire partie des index des documents trouvés syntaxes sert généralement à affiner une requête -internet NOT internet 1. Introduction 1. Considérations générales 2. Moteurs de recherche 3. Portails 4. Avenir PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 48

Syntaxe des requêtes (2/2) 1. Considérations générales 2. Moteurs de recherche 3. Portails 4. Avenir Recherche avancée pour préciser la requête pour limiter les domaines de recherche (sites, pays, dates de modification...) Accents / majuscules ete permet de retrouver été, Eté, ETE... Ete permet de retrouver Eté mais pas été, ni eté été permet de retrouver été mais pas ete Mots composés, morceaux de phrases : entre guillemets "guy marchand" ne permet pas de retrouver une page avec le texte : «Guy Béart, en visite chez le marchand de guitares, acheta des cordes». PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 49

Autres indexations 1. Introduction 1. Considérations générales 2. Moteurs de recherche 3. Portails 4. Avenir Indexation utilisant les liens entre pages plus il y a de liens vers une page, plus celle-ci est considérée comme importante («vote») description d une page en cherchant les mots-clés dans les pages qui pointent vers elle Utilisation du contexte indexer des documents non textuels (vidéo, son, image) avec les mots-clé trouvés dans les pages textuelles alentour Indexation «par le contenu» chercher des images qui «ressemblent» à d autres images taux de couleurs, textures, formes... pas encore au point PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 50

Qu est-ce qu un portail? Principe proposer un ensemble de services pour une communauté sur un site Web exemples de communauté générale (Yahoo!) liée à un fournisseur d accès Internet (Infonie, Voilà) thématique (santé, enfants)... exemples de services : moteur de recherche, annuaires, météo, informations, jeux, publicité, accès courrier électronique, forums, discussion... Modèle économique 1. Introduction 1. Considérations générales 2. Moteurs de recherche 3. Portails 4. Avenir fournir un nombre de services suffisants pour que le portail devienne l accès principal au Web de certains utilisateurs proposer des publicités ciblées Nécessite une appréciation critique pour ne pas rester bloqué dans la sous-partie du Web accessible depuis le portail PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 51

Exemple : etu.univ-lyon1.fr 1. Considérations générales 2. Moteurs de recherche 3. Portails 4. Avenir PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 52

Quelle problématique? 1. Considérations générales 2. Moteurs de recherche 3. Portails 4. Avenir Partage d informations entre utilisateurs et communautés exemple : partager ses favoris, ses annotations, accéder à ceux des autres Agents de recherche d information robots qui cherchent pour vous sur Internet Visualisation de l information : cartes représenter l organisation des sources d information de la meilleure façon possible PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 53

Visualisation de l information 1. Considérations générales 2. Moteurs de recherche 3. Portails 4. Avenir PCI PCI 2006 2006 CM 03 Découverte World wide web de l environnement 54