Remerciez-le!

Remerciez @Admin pour avoir partagé cet document gratuitement, de la manière la plus simple, en partageant sur les réseaux sociaux.

1 1 UNIVERSITE IBN ZOHR FACULTE DES SCIENCES AGADIR Technologies du web F.A. AM

1 1 UNIVERSITE IBN ZOHR FACULTE DES SCIENCES AGADIR Technologies du web F.A. AMAZAL Département informatique 2016-2017 F.A. AMAZAL Technologies du web 2016-2017 F.A. AMAZAL Technologies du web 2 2 Plan du cours • Chap. 1: Introduction au Web • Chap. 2: HTML • Chap. 3: Mise en forme et mise en page avec CSS • Chap. 4: JavaScript 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 3 3 Chapitre 1: Introduction au web • Internet et web • Fonctionnement du web • Evolution du Web 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 4 4 Internet et web Le web • Principe original : accéder à des documents textuels Situés sur des machines accessibles par Internet Reliés entre eux par un mécanisme de lien « hypertexte » • Actuellement : servir des ressources De différentes natures : texte, image, son, vidéo, contenu applicatif… Permettant à l’utilisateur d’accéder à un service donné : rechercher de l’information, acheter un objet, accéder à ses mails, consulter ses comptes en banque… 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 5 5 Internet et web Web ≠ Internet • Internet Réseau mondial d’ordinateurs permettant aux utilisateurs de communiquer (courrier électronique), de publier des informations (Web), de transférer des données (FTP), de travailler à distance (telnet). . . • Web (ou World Wide Web, Toile, WWW, W3) Système hypertexte public : système contenant des documents liés entre eux par des hyperliens permettant de passer automatiquement d’un document à l’autre. • Internet = support de communication • Web = une partie des contenus circulant sur l’Internet 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 6 6 Internet et web Internet • Un réseau de réseaux : ordinateurs interconnectés • Réseau informatique mondial constitué d'un ensemble de réseaux nationaux, régionaux et privés qui sont reliés par le protocole de communication TCP/IP et qui coopèrent dans le but d'offrir une interface unique à leurs utilisateurs. • «Internet» a été dérivé du concept d'internetting (en français : «interconnecter des réseaux») 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 7 7 Internet et web Services d’Internet 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 8 8 Internet et web Services d’internet Email • Utiliser l’Internet comme la poste: déposer un message dans la boîte aux lettres de son correspondant, qu’il soit ou non devant une machine. le correspondant sera capable de le lire à sa prochaine connexion. 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 9 9 Internet et web Services d’internet Messagerie • Msn Messenger, yahoo messenger … Internet Telephony • Voice-over Internet Protocol (VoIP) • Utiliser l’ordinateur comme un téléphone • Logiciels permettant la transmission de voix • Très économique 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 10 10 Internet et web Services d’internet Telnet • Permet à un utilisateur d’Internet de se connecter et donc d’utiliser à distance une machine comme s’il se trouvait face à elle. 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 11 11 Internet et web Services d’internet World Wide Web • Développé par Tim-Berners Lee et Robert Cailliau à la fin des années 1980. • Un système hypertexte public fonctionnant sur Internet et qui permet de consulter, avec un navigateur, des pages mises en ligne dans des sites. • Service le plus connu de l’Internet 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 12 12 Internet et web Hypertext • Référence à la capacité d’inclure dans un document du texte, des images, des sons, des vidéos, etc…, bref du multimédia des liens non-ambigus vers d’autres documents, qui permettent de les trouver automatiquement et les ouvrir • Le Navigateur est l’outil qui permet de visualiser les documents et ouvrir les liens 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 13 13 Internet et web Hypertext • L’idée des liens hypertexte: a été proposée au début dans les années 40 par Vannevar Bush. • En 1989 : Tim Berners-Lee du European Particle Physics Laboratory (CERN) a conçu un système d’hypertexte pour connecter des documents sur le Net. • Il l a conçu un langage pour spécifier le contenu des documents. Devenu par la suite : HyperText Markup Language (HTML). • Il a conçu un protocole pour télécharger et interpréter le contenu des documents devenu par la suite HTTP. • Il a implémenté le premier navigateur Mozaïc : seulement du texte, PAS d’objet multimédia. 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 14 14 Fonctionnement du web Fonctionnement du web • Utilisation d’une architecture client/serveur • Lorsque l'internaute tape l'adresse (URL) d'un site dans son navigateur (client), celui-ci envoie une requête au serveur qui héberge ce site. • Le serveur transmet alors la page demandée au navigateur qui l'affiche. • Afin de se comprendre, client et serveur Web utilisent pendant leurs échanges un protocole commun : HTTP 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 15 15 Fonctionnement du web Fonctionnement du web • Client C'est le navigateur Internet de l'internaute Identifie les serveurs sur Internet Demande les ressources aux serveurs Affiche les ressources aux utilisateurs 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 16 16 Fonctionnement du web Fonctionnement du web • Navigateur C’est un logiciel qui permet d’analyser le code (X)HTML et CSS des pages web et d’en produire un résultat visuel, facile à lire pour un humain Exemples: Mozilla Firefox, Microsoft IE, Apple Safari, Google Chrome, Opera etc 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 17 17 Fonctionnement du web Fonctionnement du web • Serveur web (serveur http) Ensemble ordinateur/logiciel paramétré pour pouvoir traiter certains types de pages et notamment celles qui contiennent des instructions de programmation. Il reconnaît ces pages grâce à l'URL qu'il reçoit, effectue les traitements demandés et transmet le résultat au format html au browser de l'internaute Attend les requêtes HTTP et y répond Deux façons de fournir des ressources statique : le serveur renvoie les ressources dont il dispose dynamique : la ressource est générée à la réception de la requête Exemples: Apache HTTP Server développé par Apache Software Foundation, Internet Information Services (IIS) développé par Microsoft 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 18 18 Fonctionnement du web Fonctionnement du web • Protocole Ensemble normalisé de règles décrivant la manière de transmettre des informations, par exemple sur un réseau comme Internet entre un client et un serveur. • HTTP (HTTP HyperText Transfer Protocol) Le plus utilisé des protocoles de communication sur le WWW. Permet à un client Web d’indiquer quelle page il veut obtenir, et au serveur Web de lui répondre en lui donnant cette page. 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 19 19 Fonctionnement du web Fonctionnement du web • URL (Uniform Resource Locator) Identifie l’endroit où se trouve une ressource sur le Web. Exemple http://www.exemple.com/chemin/page.html?q=req https://www.google.com/?gws_rd=ssl#q=Web – http :protocole – www.exemple.com :hôte – /chemin/ :chemin absolu sur le service – page.html :nom de la page Web – q=req :chaine de requête, transmise à la page 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 20 20 Fonctionnement du web Fonctionnement du web • Page web Une ressource du World Wide Web Peut contenir du texte, des images, des tableaux, des formulaires et autres éléments multimédias Créée par des webmasters à l’aide des langages HTML/XHTML et CSS Possède une adresse Web Visualisée par les internautes grâce à des navigateurs Web 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 21 21 Evolution du web Evolution du web Degré de connectivité sociale Degré de connectivité des connaissances • Caractérisé par des pages Web statiques, rarement mises à jour • Considéré principalement comme un outil de diffusion et de visualisation de données. • Période:1991-1999 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 22 22 Evolution du web Evolution du web Degré de connectivité sociale Degré de connectivité des connaissances • Un nouvelle interactivité et un travail collaboratif: L’ internaute= ‘créateur de contenu’ et ‘consommateur de contenu’ Les blogs, réseaux sociaux… • “Trop d’information tue l’information” Le Web ne s’arrêtera jamais de grandir exponentiellement (1 trilliard de pages web) • Période: 2000-2009 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 23 23 Evolution du web Evolution du web Degré de connectivité sociale Degré de connectivité des connaissances • “La sémantique est une branche de la linguistique qui étudie les signifiés” • vise à créer, gérer et exploiter des métadonnées systématiques pour chaque page web • Les informations ne seraient plus stockées mais "comprises" par les ordinateurs afin d'apporter à l'utilisateur ce qu'il cherche vraiment. • Période:2010-xx 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 24 24 Evolution du web Evolution du web Degré de connectivité sociale Degré de connectivité des connaissances 2016-2017 F.A. AMAZAL Technologies du web Introduction au web 25 25 Création d’un site web Et pour créer? • Connaitre et utiliser langages du Web (ex. HTML, CSS) • Utiliser un éditeur. Il en existe deux types : Éditeurs WYSIWYG (What You See Is What You Get): Permettent de rédiger le contenu uploads/Science et Technologie/ amazal-tech-web.pdf