Généralités et concepts des applications web - Administration des sites web et veille 2ème année Master MMI - Département d ...
←
→
Transcription du contenu de la page
Si votre navigateur ne rend pas la page correctement, lisez s'il vous plaît le contenu de la page ci-dessous
Université Moustafa BEN BOULAID -Batna 2- Faculté des mathématiques et d’informatique Département d’Informatique Généralités et concepts des applications web Administration des sites web et veille 2ème année Master MMI Année universitaire : 2020/2021
2 Introduction Qu’est-ce que le 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. Le premier usage du web: Le web a été créé pour faciliter la communication entre des chercheurs scientifiques (physique des particules). 1/7/2021
3 Introduction Différence entre le web et l’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 et ssh). . . Le Web: n’est qu’une des applications d’Internet ; distincte d’autres applications comme le courrier électronique, la messagerie instantanée, et le partage de fichiers en pair à pair. 1/7/2021
4 Principes de fonctionnement 1/7/2021
5 terminologie Abréviations et synonymes ? o WWW ou W3 o La Toile ou Toile mondiale o Information Mesh (maillage d’informations) Ressources du World Wide Web ? Est une entité informatique (texte, image, boîte aux lettres électronique, etc.) accessible indépendamment d’autres ressources. 1/7/2021
6 HTTP Hypertext Transfer Protocol ? Est un protocole de communication client-serveur développé pour le W3. Le but du protocole HTTP est de permettre un transfert de fichiers (essentiellement au format HTML) localisés grâce à une chaîne de caractères appelée URL entre un navigateur (le client) et un serveur Web (appelé d'ailleurs httpd sur les machines UNIX). 1/7/2021
7 HTTP Principe de fonctionnement du protocole HTTP ? 1/7/2021
8 HTTP Le navigateur effectue une requête HTTP Le serveur traite la requête puis envoie une réponse HTTP Requête HTTP Une requête HTTP est un ensemble de lignes envoyé au serveur par le navigateur. Elle comprend : Une ligne de requête: c'est une ligne précisant le type de document demandé, la méthode qui doit être appliquée, et la version du protocole utilisée. 1/7/2021
9 HTTP Les champs d'en-tête de la requête: il s'agit d'un ensemble de lignes facultatives permettant de donner des informations supplémentaires sur la requête et/ou le client (Navigateur, système d'exploitation, ...). Chacune de ces lignes est composée d'un nom qualifiant le type d'en-tête, suivi de deux points (:) et de la valeur de l'en-tête . Le corps de la requête: c'est un ensemble de lignes optionnelles devant être séparées par une ligne vide et permettant par exemple un envoi de données par une commande POST lors de l'envoi de données au serveur par un formulaire. 1/7/2021
10 HTTP Une requête HTTP a donc la syntaxe suivante ( signifie retour chariot ou saut de ligne) : 1/7/2021
11 HTTP Voici donc un exemple de requête HTTP : 1/7/2021
12 HTTP Commandes HTTP ? 1/7/2021
13 HTTP En-têtes HTTP ? 1/7/2021
14 HTTP En-têtes HTTP ? 1/7/2021
15 HTTP En-têtes HTTP ? 1/7/2021
16 HTTP Réponse HTTP Une réponse HTTP est un ensemble de lignes envoyées au navigateur par le serveur. Elle comprend : Une ligne de statut: c'est une ligne précisant la version du protocole utilisé et l'état du traitement de la requête à l'aide d'un code et d'un texte explicatif. La ligne comprend trois éléments devant être séparés par un espace : La version du protocole utilisé Le code de statut La signification du code 1/7/2021
17 HTTP Les champs d'en-tête de la réponse: il s'agit d'un ensemble de lignes facultatives permettant de donner des informations supplémentaires sur la réponse et/ou le serveur. Chacune de ces lignes est composée d'un nom qualifiant le type d'en- tête, suivi de deux points (:) et de la valeur de l'en-tête . Le corps de la réponse: il contient le document demandé. 1/7/2021
18 HTTP Syntaxe d’une réponse HTTP ? 1/7/2021
19 HTTP Exemple d’une réponse HTTP : 1/7/2021
20 HTTP En-têtes d’une réponse HTTP : 1/7/2021
21 HTTP Les codes de réponse HTTP : o Ce sont les codes que vous voyez lorsque le navigateur n'arrive pas à vous fournir la page demandée. o Le code de réponse est constitué de trois chiffres : le premier indique la classe de statut et les suivants la nature exacte de l'erreur. 1/7/2021
22 HTTP Les codes de réponse HTTP : 1/7/2021
23 HTTP Les codes de réponse HTTP : 1/7/2021
24 HTTP Les codes de réponse HTTP : 1/7/2021
25 HTTP Les codes de réponse HTTP : 1/7/2021
26 URL Uniform Resource Locator ? L’URL (Uniform Resource Locator « localisateur uniforme de ressource »), auquel se substitue informellement l'expression adresse web, désigne une chaîne de caractères utilisée pour adresser les ressources du World Wide Web Les URL ont été inventées pour pouvoir indiquer avec une notation (d'où l'adjectif «uniforme ») aux navigateurs web comment accéder à toutes les ressources d'Internet. 1/7/2021
27 URL Hyperliens ? Chaque hyperlien du web est construit avec l'URL de la ressource pointée, insérée dans un document source (ou dans un programme ou dans une interface utilisateur) pour indiquer la localisation d'une autre ressource. Lorsqu'on active un hyperlien, le navigateur web peut présenter son URL dans une barre d'adresse. 1/7/2021
28 URL Fonctionnement ? Une URL est une chaîne de caractères combinant les informations nécessaires pour indiquer à un logiciel comment accéder à une ressource Internet. Ces informations peuvent notamment comprendre: le protocole de communication, un nom d'utilisateur, un mot de passe, une adresse IP ou un nom de domaine, un numéro de port TCP/IP, un chemin d'accès, une requête. 1/7/2021
29 URL URL absolue ? Une URL absolue permet d'indiquer comment accéder à une ressource indépendamment de tout contexte où elle peut être précisée ou transmise. L’URL absolue commence par l'indication d'un schéma de représentation (spécifique au protocole de communication utilisé pour accéder à cette ressource), • suivi de l'ensemble des paramètres permettant de localiser sur le réseau le service hébergeant la ressource, • puis permet de préciser à ce service le nom d'une ressource à traiter, transmettre des données de traitement, acheminer et récupérer les résultats, • puis de préciser éventuellement quelle partie de ce résultat sera utilisée. 1/7/2021
30 URL Exemple : http://Admin:Passe@www.example.com:8888/chemin/d/acc%C3%A8s.php?q=req&q2 =req2#signet Protocole, normalement obligatoire (mais certains clients web peuvent tenter de déterminer le protocole) : o http - protocole de communication, en l’occurrence ici HTTP pour accéder à un serveur web. o : - caractère de séparation obligatoire si le protocole est précisé. 1/7/2021
31 URL Exemple : http://Admin:Passe@www.example.com:8888/chemin/d/acc%C3%A8s.php?q=req&q2 =req2#signet Localisation complète de la ressource: o // - chaîne de caractères pour les protocoles dont la requête comprend un chemin d'accès, permettant de préciser et localiser le service avant ce chemin. 1/7/2021
32 URL Exemple : http://Admin:Passe@www.example.com:8888/chemin/d/acc%C3%A8s.php?q=req&q2 =req2#signet o Données d’authentification (optionnelles, le service peut les demander séparément de façon plus sécurisée que via l’URL): • Admin - nom d’utilisateur, notamment utile pour accéder à des parties non publiques d'un site web • : - caractère de séparation si un mot de passe est indiqué. • Passe - mot de passe de l'utilisateur, indiqué ici en clair. • @ - caractère terminant les données d'identification présentes avant le nom du service. 1/7/2021
33 URL Exemple http://Admin:Passe@www.example.com:8888/chemin/d/acc%C3%A8s.php?q=req&q2 =req2#signet www.example.com - nom de domaine du service, on peut parfois utiliser plutôt son adresse IP. Si le nom de service ou l’adresse peuvent contenir des caractères réservés comme :, le nom de service ou l'adresse sera encadré de crochets doubles [[ ]]. Lui-même se décompose en: o www: sous-domaine (par défaut www). o example : nom de domaine de deuxième niveau o com : nom de domaine de premier niveau 1/7/2021
34 URL Exemple : http://Admin:Passe@www.example.com:8888/chemin/d/acc%C3%A8s.php?q=req&q 2=req2#signet Indication optionnelle d’un numéro de port (au cas où le même serveur possède des services n’utilisant pas le port par défaut pour le protocole de communication) o : - caractère indiquant qu’un numéro de port est précisé en suffixe o 8888 - numéro de port TCP/IP du serveur HTTP, doit être précisé lorsqu’il ne s’agit pas du port standard pour le protocole utilisé (qui est 80 pour HTTP, 21 pour FTP…). o [1234:abcd::1234]:8888 - Dans le cas d'une adresse IPv6, si on veut spécifier le port, il est obligatoire de mettre l'adresse entre crochets pour ne pas confondre le port et l'adresse. 1/7/2021
35 URL Exemple : http://Admin:Passe@www.example.com:8888/chemin/d/acc%C3%A8s.php?q=req&q2= req2#signet Nom complet de la ressource à demander sur le service une fois connecté o /chemin/d/ - chemin absolu (commençant par un /) sur le service contenant la page web, obligatoire pour les services à chemin d’accès (par défaut ce chemin sera /). o acc%C3%A8s.php - nom de la page web, optionnel (de nombreux services web déterminent un nom de ressource par défaut pour chaque chemin indiqué); On remarque qu’un caractère non ASCII comme « è » est codé en «%C3%A8 ». 1/7/2021
36 URL Exemple : http://Admin:Passe@www.example.com:8888/chemin/d/acc%C3%A8s.php?q=req&q 2=req2#signet Données supplémentaires optionnelles, transmises au service lors de la demande à la ressource: o ? - caractère de séparation obligatoire pour indiquer que des données complémentaires suivent. o q=req&q2=req2 - chaîne de requête, traitée par la page web sur le serveur. 1/7/2021
37 URL Exemple : http://Admin:Passe@www.example.com:8888/chemin/d/acc%C3%A8s.php?q=req& q2=req2#signet Données supplémentaires optionnelles, pour l’exploitation de la ressource après son obtention par le logiciel client : o # - caractère de séparation obligatoire pour indiquer un signet (ou une balise). o signet - identificateur du signet ou de la balise, il s’agit d’un emplacement à l’intérieur de la page web retournée par le service, cette donnée sera traitée par le navigateur web. 1/7/2021
38 URL URL relative Une URL relative ne contient ni protocole ni nom de domaine. sont souvent utilisées pour les hyperliens à l'intérieur d'un même site web. Les URL relatives sont directement inspirées de la syntaxe des systèmes de fichiers Unix. L'usage d'URL relatives permet de ne pas avoir à reprendre l'ensemble des liens lors du changement d'adresse d'un site., o ./ correspond au dossier actuel ; o ../ correspond au dossier parent ; o / correspond au dossier racine. 1/7/2021
39 Serveur HTTP Un serveur HTTP est un logiciel utilisé pour servir des ressources à travers le protocole HTTP. Un serveur HTTP ou daemon HTTP ou HTTPd (HTTP daemon) ou (moins précisément) serveur Web est un logiciel servant des requêtes respectant le protocole de communication client-serveur HyperText Transfer Protocol (HTTP), qui a été développé pour le World Wide Web. 1/7/2021
40 Serveur HTTP Liste de serveurs HTTP C : Apache, Zeus Web Server, nginx, lighttpd, Cherokee, Hiawatha Webserver ASP/ASP.Net(C#, VB.net) : IIS Java : Tomcat, Jetty, GlassFish, JBoss, JOnAS, Vert.x Python : Zope Pike : Caudium Ruby : WEBrick, Mongrel, Thin Erlang : Yaws Javascript : Node.js 1/7/2021
Serveur HTTP 41 Port utilisé pour accéder à un serveur HTTP ? Le port par défaut pour accéder à un serveur http, le port est le 80. Mais, les navigateurs sont capables de dialoguer avec un serveur http sur des ports différents. Cette technique avec des ports différents est utilisée pour atteindre les serveurs de manière différente : o Avec le port par défaut, vous consultez les pages mises à disposition par le serveur. o Avec un port différent, vous accédez à d’autres pages, non accessibles directement comme des pages d’administration du serveur par exemple. Il est également possible d’avoir plusieurs sites sur le même serveur. L’accès à l’un ou l’autre des sites se fera en fonction du port adressé. 1/7/2021
Serveur HTTP 42 Exemple Cas standard : port utilisé 80 (rien n’est spécifié sur la barre d’adresse) 1/7/2021
Serveur HTTP 43 Exemple : port spécifique Pour utiliser un port spécifique, il suffit d’ajouter le numéro du port derrière l’adresse du serveur (en ajoutant les « : »). webmin est un outil d’administration des serveurs Linux via des pages web. Par défaut, l’accès à Webmin se fait par le port 10000). 1/7/2021
44 Client HTTP C’est quoi ? Un client HTTP est un outil permettant d’utiliser les ressources fournies par un serveur HTTP. Fonctions d’un client HTTP: • Faire traduire le nom d’hôte en adresse IP par un DNS, • Rentrer en contact avec le serveur HTTP, et de lui fournir différentes informations telles que: Le nom du site, La ressource désirée, ainsi que ses capacités (gestion de différents types de ressource, capacité d’affichage, possibilité de compression de données, etc.) Sa volonté dans l’utilisation des données fournies (choix des langues, protection de la vie privée). 1/7/2021
45 Client HTTP Navigateur web Un navigateur web est un type de logiciel client HTTP à interface homme- machine et conçu pour accéder aux ressources du web. • Sa fonction de base est de permettre la consultation des documents HTML disponibles sur les serveurs HTTP. • Le support d’autres types de ressources et d’autres protocoles de communication dépend du type de navigateur. 1/7/2021
46 Client HTTP Robot d’indexation (web crawler ou web spider) Un type de logiciel client HTTP, utilisé pour indexer les différentes ressources de sites web. • Il est généralement conçu pour collecter les ressources (pages Web, images, vidéos, documents Word, PDF ou PostScript, etc.), afin de permettre à un moteur de recherche de les indexer. • Pour indexer de nouvelles ressources, un robot procède en suivant récursivement les hyperliens trouvés à partir d'une page. Par la suite, il est mémorise l'URL de chaque ressource récupérée. 1/7/2021
47 Client HTTP Agrégateur Web L'agrégateur est une sorte de « facteur » qui va chercher le courrier à l'extérieur, puis le dépose chez l'utilisateur, dispensant ce dernier d'aller régulièrement aux nouvelles en visitant de nombreux sites internet. • Il prévient de la mise à jour d'un site web ou des actualités qu'il publie (par notification sonore, visuelle, etc.). • Également, il importe le contenu nouveau en question et il le fait pour un ensemble de sites. 1/7/2021
48 Client HTTP Aspirateur de site web Logiciel qui télécharge toutes les données contenues par un site Web pour les sauvegarder sur un support de mémoire local, ce qui permet de consulter les pages correspondantes sans être connecté à Internet. • Un index des éléments composant chacune d'elles est établi (texte HTML de la page, images, sons, vidéos, animations, etc.) • La profondeur d'analyse peut aussi être paramétrée pour télécharger plus ou moins de fichiers. 1/7/2021
49 Page web Page web ? Une page web (ou page) est un document destiné à être consulté avec un navigateur web. Une page web est toujours constituée d’une ressource centrale (généralement un document HTML ou XHTML) et d’éventuelles ressources liées, automatiquement accessibles (par exemple, des images, des feuilles de style, des scripts javascript ou des fontes de caractères). 1/7/2021
50 Le web profond ou web invisible Le web profond ou web invisible Est la partie du web qui n’est pas indexée et donc introuvable avec les moteurs de recherche généralistes. Une étude publiée en 2001 indiquait que la partie invisible du web représente plus de 99 % du web Le web profond comprend notamment les ressources suivantes : les ressources inaccessibles au public, notamment les pages administratives ou payantes, protégées par un mot de passe ; les ressources qui ne sont pas communiquées par des protocoles de communication pris en charge par les robots (souvent ils ne prennent en charge que HTTP et HTTPS) ; les ressources dont le format de données n’est pas pris en charge par le robot ; les ressources listées dans un fichier d’exclusion des robots ; 1/7/2021
51 Le web profond ou web invisible Le web profond comprend notamment les ressources suivantes : les ressources exclues par le robot car elles sont conçues pour abuser du référencement (spamdexing) ; les ressources exclues par le robot car elles sont considérées comme trop peu pertinentes; les ressources vers lesquelles les hyperliens sont créés dynamiquement en réponse aux interrogations des visiteurs. Ces dernières ressources proviennent généralement de bases de données et constituent la partie la plus importante du web profond. 1/7/2021
52 Intranets et web privé Intranets et web privés Un site web mis en ligne sur un intranet est privé, car le public ne peut pas accéder à un intranet. En outre, si l’on met en ligne un site web sur Internet en oubliant de créer des liens depuis au moins une page existante du World Wide Web, alors ce site constitue un web isolé. Il est virtuellement privé, car le public ne peut pas le découvrir en suivant des hyperliens. 1/7/2021
53 Type de ressources Les divers types de ressource du web ont des usages assez distincts : Les ressources constituant les pages web : documents HTML, images JPEG ou PNG ou GIF, scripts JavaScript, feuilles de style CSS, sons, animations, vidéo ; Les ressources accessibles depuis une page web mais consultables avec une interface particulière : applet ; Les ressources conçues pour être consultées séparément : documents (PDF, PostScript, Word, etc.), fichier texte, images de tout type, morceaux de musique, vidéo, fichiers à sauvegarder ; Les ressources appartenant à des systèmes qui ont une existence indépendante du web, mais vers lesquelles il est possible de créer un hyperlien : forums Usenet, boîtes aux lettres électronique, fichiers locaux. 1/7/2021
54 Technologie web Technologies pré-existantes Le web repose sur les technologies d’Internet, notamment: o TCP/IP pour assurer le transfert des données, o DNS pour convertir les noms d’hôte en adresses IP o et MIME pour indiquer le type des données. Les standards de codage de caractères et les formats d’image numérique GIF et JPEG ont été développés indépendamment. 1/7/2021
55 Technologie web Technologies spécifiques Trois technologies ont dû être développées pour le World Wide Web : o les URL pour pouvoir identifier toute ressource dans un hyperlien ; o le langage HTML pour écrire des pages web contenant des hyperliens; o le protocole de communication HTTP utilisé entre les navigateurs et les serveurs web. 1/7/2021
56 Technologie serveur plusieurs techniques propres au Web sont mises en œuvre pour faire fonctionner les serveurs HTTP (ou serveurs web) Serveur HTTP Le serveur HTTP est chargé d’assurer la communication entre le poste client et les ressources des sites. 1/7/2021
57 Technologies serveur Langages d’application dynamiques côté serveurs En pratique, CGI et fastCGI permettent d’utiliser n’importe quel langage, cependant, certains langages de script populaires utilisent d’autre technique pour communiquer avec le serveur. Le langage de programmation PHP (PHP: Hypertext Preprocessor) jouit d’une forte intégration avec le serveur HTTP et les langages HTML. C’est aujourd’hui le langage le plus utilisé côté serveur. ASP (Active Server Pages) a été développé par Microsoft pour interpréter du langage de script dans le serveur IIS (Internet Information Services), Le langage Java, dont les pages sont servies par Apache Tomcat En Ruby, Phusion Passenger, fonctionnant avec Apache et Nginx 1/7/2021
58 Technologie serveur Bases de données Les bases de données sont également une partie importante de la génération des sites à contenu dynamique. Les principaux types de base de données sont : De type SQL ; MySQL est la plus populaire, suivie de Microsoft SQL Server, PostgreSQL, SQLite, Berkeley DB et Oracle. De type NoSQL ; MongoDB est la plus utilisée, mais on peut également citer CouchDB, Amazon SimpleDB ou BigTable utilisé par Google. 1/7/2021
59 Programmation web La programmation web peut prendre différentes formes : de la simple page statique à la page dynamique avec connexion à une base de données différentes technologies possibles dans la programmation côté client ou côté serveur: • Langage HTML , XML ou XHTML • Langages de Script • Langage de programmation (Java, PHP…) 1/7/2021
60 Langages de balisage HTML est un langage de balisage qui définit essentiellement la structure de la page web (titres, tableaux, paragraphes, etc.). C'est un langage qui permet de créer des hyperliens. Depuis sa version 4, le langage HTML s'accompagne des CSS (Cascading Style Sheets - Feuilles de style en cascade) Le langage de balisage XML peut également servir de base à une page web. Le fichier XML contiendra le contenu de la page web. Ce fichier sera lié à un fichier XSL (Feuilles de style XML) qui mettra en forme les données du fichier XML. Le XHTML est une évolution du HTML basée sur XML. 1/7/2021
61 Langages de script Animation flash Flash (de Adobe Systems - Macromedia) est un programme qui permet de créer des animations dans un format vectoriel propriétaire relativement léger L'utilisation de Flash dans une page web nécessite l'installation du plug-in "Flash player" qui n'est pas disponible pour tous les systèmes. Applet Java (Appliquette) Applets ou appliquettes sont des petits programmes avec interface en java Ils sont téléchargés avec la page web et exécutés par l'ordinateur client. Active X Les ActiveX sont une solution de création d'applications développée par Microsoft. La programmation peut se faire avec plusieurs langages (C++, Visual Basic, Java) mais nécessite de bonnes connaissances en programmation 1/7/2021
62 Programmation web côté client La programmation côté client sera utilisée essentiellement dans le cas de validation de formulaires (champs obligatoires, petits calculs, ...) et dans la création de petites animations (menus déroulants...). La programmation côté client utilise des langages de scripts. À la différence d'autres langages de programmation, ces langages ne sont pas compilés. Ils sont interprétés par le navigateur web du visiteur, et leur syntaxe est moins stricte que celle des langages de développeurs (variables non-typées a priori, le point-virgule à la fin des instructions est optionnel...). 1/7/2021
63 Programmation web coté client JavaScript est le plus utilisé des langages de programmation web côté client. Il est reconnu par tous les navigateurs (dans les versions actuelles). Il se base sur le langage normalisé ECMAScript. JScript, fort proche du JavaScript est simplement une adaptation de celui-ci par Microsoft. VBScript est le langage de script développé par Microsoft sur base du Visual Basic. Ce langage n'est interprété que par les navigateurs basés sur ceux développés par Microsoft (soit Internet Explorer et Maxthon). DHTML n'est PAS un langage de script mais simplement la combinaison, dans une page web, de JavaScript, de HTML 4 ou de XHTML et de CSS. 1/7/2021
64 Programmation web coté client Avantages et inconvénients Avantages : La programmation côté client est légère et relativement simple à implémenter (syntaxe pas trop complexe). Inconvénients : Le code est envoyé tel quel au client, et donc visible par celui- ci (s'il regarde les sources de sa page) et donc peu sécurisé. • Le bon déroulement du programme dépend entièrement du navigateur du client, de sa configuration et de son niveau de sécurité. Il n'est donc pas question ici de lier le site web à une base de données. 1/7/2021
65 Programmation web coté serveur Lors de l'insertion de programmation côté serveur dans une page, lorsque le visiteur demande la page, le serveur va d'abord lire celle-ci, il va interpréter le code serveur et encapsuler le résultat dans la page HTML. Cette dernière sera expédiée au visiteur sans aucune trace du code serveur. Le visiteur reçoit donc une pure page html (avec éventuellement encore du code client). De ce processus, on gagne énormément en sécurisation du code. On a aussi un grand nombre de possibilité d'interactions avec d'autres systèmes ou applications comme les bases de données. 1/7/2021
66 Programmation web coté serveur Technologies Microsoft ASP (Active Server Pages): Technologie développée par Microsoft à partir de 1996 dans le but de créer des pages dynamiques. Langages utilisés : VBScript (langage par défaut) ou JScript. Utilisation : Tout site web dynamique peut être créé en ASP. ASP.NET: Technologie développée par Microsoft sur base du Framework.Net. L'évolution est importante par rapport à ASP et les possibilités deviennent quasi infinies. Utilisation : Tout type d'application web peut être créé avec ASP.NET. 1/7/2021
67 Programmation web coté serveur PHP PHP: Hypertext Preprocessor est un langage de script interprété côté serveur. Le code PHP est lu par le serveur et interprété pour produire une page HTML à chaque fois que la page sera demandée. PHP travaille généralement avec une base de données MySQL. 1/7/2021
68 Programmation web coté serveur Technologies Java JSP (JavaServer Pages) : Technologie développée par Sun Microsystems dans le but de créer des pages dynamiques avec le langage Java. Les JSP permettent d'ajouter du code Java dans la page HTML qui sera interprété par le serveur. Servlets: Le nom vient d'une analogie possible à faire avec les applets. Il s'agit donc de programmes créés en Java et tournant sur le serveur web. L'exécution du programme génère les pages web renvoyées au client. 1/7/2021
69 Programmation web coté serveur Technologies Java JSP (JavaServer Pages) : Technologie développée par Sun Microsystems dans le but de créer des pages dynamiques avec le langage Java. Les JSP permettent d'ajouter du code Java dans la page HTML qui sera interprété par le serveur. Servlets: Le nom vient d'une analogie possible à faire avec les applets. Il s'agit donc de programmes créés en Java et tournant sur le serveur web. L'exécution du programme génère les pages web renvoyées au client. 1/7/2021
70 Programmation web coté serveur ColdFusion ColdFusion est une technologie de création de pages dynamiques développée par Macromedia. Les pages d’application sont des pages web contenant des instructions de programmation écrite à l’aide d’un langage propriétaire, le CFML (ColdFusion Markup Language). Ajax Ajax (Asynchronous JavaScript And XML) est une technologie, avec ses avantages et inconvénients, qui combine plusieurs éléments : XHTML, CSS, JvaScript, XML, XSLT et XMLHttpRequest, À la base, cette technologie permet d'effectuer une requête HTTP asynchrone (en parallèle) au serveur web (effectuer une action, mettre à jour une information...). 1/7/2021
71 Site web C’est quoi un site web? Un site web (ou site) est un ensemble de pages web et d’éventuelles autres ressources, liées dans une structure cohérente, publiées par un propriétaire et hébergées sur un ou plusieurs serveurs web. L'adresse web d'un site correspond en fait à l'URL d'une page web, prévue pour être la première consultée : la page d'accueil. Techniquement, rien ne distingue la page d'accueil d'une autre page.. 1/7/2021
Sites web statiques 72 C’est quoi ? Ces sites ont le mécanisme de fonctionnement le plus simple : les URL correspondent à un fichier renvoyé par le serveur web. Le contenu des pages d'un site statique ne dépend donc pas de variables telles que la date ou de bases de données. Pour changer le contenu d'une page, il est nécessaire de changer le contenu du fichier. Pour les réaliser, seuls les langages dits de d'interface utilisateur (frontend) sont nécessaires, c'est-à-dire HTML, CSS et JavaScript (en théorie, il est toutefois possible d'utiliser uniquement le HTML). Le HTML permet d'écrire le contenu de sa page Le CSS permet de la décorer ; JavaScript permet d'ajouter du dynamisme, mais uniquement du côté du navigateur (par exemple des animations graphiques). 1/7/2021
Sites dynamiques 73 Sites dynamiques Ces sites offrent un contenu qui peut évoluer dans le temps. Des programmes tournent du côté des serveurs, à l'arrière plan, (backend) pour générer les pages du site. Ces programmes peuvent se servir de bases de données ou autres sources de données pour composer les pages qui seront affichées dans le navigateur. Ce dynamisme apporte des fonctionnalités que ne peuvent offrir les sites dits statiques. Il existe plusieurs langages pour créer ces pages : PHP, Java, C#, Ruby, voire d'autres comme C++, Python et Visual Basic via l'interface CGI. Leur temps de chargement est généralement plus long que pour les pages statiques, toutefois il est possible d'obtenir des valeurs proches en stockant les pages dynamiques déjà appelées dans une mémoire cache, qui les réaffichera plus vite. 1/7/2021
74 SGC ou CMS SGC ou CMS Les systèmes de gestion de contenu (initiales SGC, CMS en anglais) permettent de fabriquer des sites web en utilisant des modèles pré établis. Ces logiciels sont disponibles pour les débutants et simplifient certaines étapes comme la programmation informatique ou l'architecture du site. Les procédures de demande du nom de domaine, d'hébergement du site et de référencement sont semblables aux sites personnalisés classiques. Quelques SGC : Academic , Agora, Apache Jetspeed, Bizy-Nova, Calker CMS, Caméléon CMS, Joomla!, CMS++ , CMS chronosite , CMSimple 1/7/2021
75 Organisation d'un projet web Les différentes étapes de la conduite d'un projet web ? LANCEMENT: étude des besoins, de la concurrence et de l'existant pour l'établissement d'un cahier des charges CONCEPTION: élaboration de la structure (arborescence), du contenu des pages web, du graphisme, qui font partie du cahier des charges fonctionnel ; 1/7/2021
76 Organisation d’un projet web RÉALISATION: L'étape de réalisation comprend : • la réservation et gestion d'un nom de domaine (l’adresse web à laquelle le site est accessible) ; • la mise en œuvre d'une infrastructure d'hébergement du site (serveurs web, base de données...) ; • le développement de l'interface utilisateur (frontend), la partie visible dans le navigateur ; les différentes pages sont décrites en langages connus des navigateurs web, principalement HTML, CSS et JavaScript. • le développement de l'arrière plan (backend), la partie qui fonctionne côté serveur. 1/7/2021
77 Organisation d’un projet web PRODUCTION : le site est mis en ligne, devient accessible au public ciblé Exploitation : phase de maintenance et de promotion du site, avec notamment le référencement naturel (Netlinking) ou payant (Google Adwords, Microsoft Adcenter, ou autres) 1/7/2021
78 Maintenance d’un site web La maintenance d’un site web consiste en général à s’assurer de son bon fonctionnement ; On peut distinguer quatre types de maintenances : La maintenance corrective: • Elle consiste à corriger les problèmes et les défauts de fonctionnement ayant survenu d’une manière inattendue La maintenance préventive: • Un problème a été identifié, mais n’est pas apparu; alors, pour prévenir le dysfonctionnement d’un site web, on va corriger le bug à l’avance. 1/7/2021
79 Maintenance d’un site web La maintenance évolutive: • La maintenance évolutive consiste à améliorer les services d’un site web et d’ajouter de nouvelles fonctionnalités pour qu’il soit adapté aux nouvelles exigences des utilisateurs. La maintenance adaptative: • La maintenance adaptative consiste à améliorer le contenu d’un site web pour qu’il soit compatible avec les nouvelles contraintes technologiques (navigateurs, taille des écrans…). 1/7/2021
80 Portail web Portail web Un portail web est un site web qui offre une porte d'entrée commune à un large éventail de ressources et de services accessibles sur Internet et centrés sur un domaine d'intérêt ou une communauté particulière. Les ressources et services dont l'accès est ainsi rassemblé peuvent être des sites ou des pages web, des forums de discussion, des adresses de courrier électronique, espaces de publication, moteur de recherche, etc.. Les portails web sont apparus durant la décennie des années 1990. Durant la fin de cette décennie, certains ont été vendus à un prix très élevé (grâce au trafic web dont ils bénéficiaient). Parmi les plus visités, les firmes Google et Yahoo! proposent des portails Web. 1/7/2021
81 Le Web design dans les smartphones Via les terminaux mobiles, on ne vise pas les mêmes objectifs en matière de Web design. Et cela peut pousser à refaire tout le processus de conception si l'on change de public (passage d'un site web vers le mobile) Lorsque l'on met un site web, il faut d'abord s'assurer qu'il soit accessible sur un mobile, et de manière très rapide. Parmi la communauté des développeurs web, ceux qui visent le marché mobile vous diront que le temps de chargement d'une page est une contrainte très sévère et qui peut nuire à un site. Le web designer doit alors privilégier les performances et le contenu important sur mobile. Pour aider à améliorer l'expérience, Google a publié un outil nommé Pagespeed Insights destinés aux développeurs qui souhaitent des conseils en matière de Web design sur mobile. 1/7/2021
Web design d'entreprise 82 Dans le cadre d'un site web d'entreprise, le web design est défini selon les objectifs qui lui sont fixés : Site web corporate: • l'objectif premier est de développer la visibilité de l'offre et de la marque. • Les sous-objectifs fixés au web design sont la validation de la lisibilité de l'identité de la société, l'amélioration de la qualité du trafic (plus profond), la facilitation de création d'un capital relationnel entre les visiteurs et le site web Site web e-commerce: • L'objectif premier est de transformer les visites en ventes. Landing page: • La landing page, appelée également page d’atterrissage, désigne la page sur laquelle arrive un internaute après avoir cliqué sur un lien (lien commercial, lien email, lien bandeau publicitaire, etc..). 1/7/2021
83 Le monitoring de site web ou surveillance de site web consiste en une vérification de la disponibilité et de la navigabilité d'un site web. L'intérêt étant de connaître les conditions d'accès et de navigation des internautes. Le monitoring est le plus souvent externe, soit réalisé au moyen de points de contrôles (ou sondes) disséminés dans le monde. 1/7/2021
84 Monitoring de site web Monitoring interne Il sert à vérifier le bon fonctionnement des serveurs et services présents sur l'intranet de l'entreprise et ce, depuis l'entreprise. Il peut être complémentaire du monitoring externe mais ne peut suffire à mesurer la disponibilité d'un site web du point de vue d'Internet. Monitoring externe Il sert à vérifier le bon fonctionnement des serveurs et services de l'entreprise accessibles aux internautes, depuis Internet. La vérification est réalisée au moyen de multiples sondes réparties dans des zones géographiques différentes. 1/7/2021
85 Monitoring de site web Monitoring externe Différents types de monitoring externe Il existe deux types de monitoring externe : le traditionnel et le scénarisé. Le premier consiste en une simple requête d'URL (accompagnée le cas échéant d'une vérification d'intégrité de contenu et de mesures de réactivité). Le second consiste en une véritable navigation sur le site, visant à simuler la visite d'un internaute. Lorsque cette visite a pour objet de vérifier le bon fonctionnement d'un processus d'achat, on parle de monitoring transactionnel.. 1/7/2021
Monitoring de site web 86 Points clés de la surveillance Pour surveiller les points sensibles d'un site web, on peut surveiller en particulier : 1. La page d’accueil : c'est la vitrine de l'entreprise et elle fait partie intégrante de sa communication. 2. Une page accédant à des ressources externes (base de données, serveur d’application, etc.), 3. Les formulaires : de réservation, de contact, de login, de recherches, etc. 4. Les services de messagerie : environ 70 % du courrier en entreprise passe aujourd’hui par le courriel, il est donc utile de surveiller les serveurs de messagerie POP/IMAP et/ou SMTP. 5. Le serveur de transfert de fichier « FTP ». 6. Les routeurs, firewalls, serveurs hétérogènes, webcams, grâce au protocole « ping» qui enverra une requête au serveur afin de vérifier son état (pas de connexions, pertes de paquets, etc.). 1/7/2021
87 Rentabiliser un site web se révèle souvent nécessaire Méthode Il existe plusieurs méthodes pour rentabiliser un site internet : La publicité Une des méthodes les plus courantes pour rentabiliser son site internet est d’afficher un lien ou une bannière publicitaire que fournit un annonceur. • La publicité on-line : l‘espace publicitaire sur le site est loué. • Publicité rémunérée à l’affichage : vous serez rémunéré à chaque fois qu’un internaute cliquera sur la publicité. • Publicité rémunérée au clic : vous serez rémunéré à chaque fois qu’un internaute cliquera sur une image (ou un lien) publicitaire que vous aurez publiée sur votre site internet. 1/7/2021
88 Rentabiliser un site web L’affiliation L’affiliation consiste à vendre les produits d’un annonceur, pour gagner de l’argent grâce à son site. Exemple d’annonceurs: • affiliation Amazon, affiliation Tradedoubler, PublicIdeas, Zanox L’affiliation en marque blanche: Vous rentabiliserez votre site en vendant vous-même les produits de l’annonceur. L’utilisateur ne passera à aucun moment par le site de l’annonceur. 1/7/2021
89 Rentabiliser un site web Micropaiement Il s’agit ici de vendre des services, un accès à des zones payantes du site ou des produits virtuels de faible coût. À l’origine, ce système était conçu pour éviter les frais bancaires trop importants sur les petites sommes. Vous affichez pour votre produit un contenu crypté qui ne sera accessible à l’internaute qu’une fois qu’il aura récupéré le code grâce à un numéro de téléphone surtaxé, un SMS. Vous toucherez donc une commission sur la surtaxe. Exemples: Allopass, Optelo ,Rentabiliweb. 1/7/2021
90 Rentabiliser un site web Articles sponsorisés Vous écrivez pour votre site des articles sur un sujet précis commandé par l’annonceur qui vous rémunère selon le trafic de votre site. Faites attention à ne pas vous décrédibiliser auprès de vos lecteurs en acceptant n’importe quel sujet. Cette méthode est considérée comme de la publicité, donc dans certains pays il est obligatoire d’informer que les articles sont sponsorisés. 1/7/2021
91 Rentabiliser un site web Modes CPC : le coût par clic : rémunération lorsque le visiteur clique sur un lien texte ou une bannière. PPS : la rémunération par vente : vous touchez une commission sur l’achat du visiteur. CPL : le coût par formulaire rempli : devis, inscription newsletter. CPA : la rémunération par action. C’est l’action du visiteur qui vous rémunère (par exemple, par le téléchargement d’un logiciel ou l’achat d’un livre sur le site web de votre partenaire) .. 1/7/2021
92 Rentabiliser un site web Optimisation de la publicité Il faut penser aussi au confort de l’internaute. Eviter la publicité trop agressive (pop-up), mal placée, trop présente. Choisissez bien le type d’annonce (bannière, image, lien) que vous souhaitez voir sur votre site. Placez la publicité à des endroits où cela ne gêne pas la navigation. Veillez aussi à respecter la thématique de votre site dans le choix des publicités que vous souhaitez afficher. Avant de choisir un annonceur, vérifiez la qualité de ses campagnes publicitaires. 1/7/2021
93 Méthodes Il est souvent bien plus profitable de préserver les visiteurs que l’on a déjà, en les fidélisant, que de chercher sans cesse à en acquérir de nouveaux. Comment les fidéliser ? Fidéliser par la communication communiquer directement sur votre site internet (par contact email) ou via l’envoi de newsletters (offres promotionnelles par exemple), Le commentaire :indispensable à tout blog, même d’entreprise. Il permet à vos visiteurs de vous parler en direct, de mieux vous connaître. Les réseaux sociaux : la communication sur les réseaux est plus rapide et spontanée, utilisez-les pour communiquer de manière moins formelle avec vos visiteurs. 1/7/2021
94 Fidéliser les visiteurs Fidéliser par l’affirmation Il est bien évident que pour fidéliser les visiteurs, ils doivent connaître et reconnaître votre site. Si vous vous fondez dans la masse, ils pourraient bien ne jamais revenir ! • L‘identité : un design, un nom de domaine, un logo, tous ces marqueurs sont importants pour que vos lecteurs se souviennent de vous • Inspirer confiance : Votre site doit avoir une page à propos (avec photo c’est encore mieux) où vous expliquez qui vous êtes et le pourquoi du site. • Foire aux questions : C’est une rubrique qu’il faut créer pour répondre aux préoccupations habituelles de vos visiteurs et ainsi gagner leur confiance. Fidéliser par l’incitation Le bonus à l’inscription : livre blanc, promotion, tutoriaux … Les call to action : à la fin d’une page ou d’un article, placez un appel à l’action pour entraîner vos visiteurs à s’inscrire sur votre site 1/7/2021
95 FIN 1/7/2021
Vous pouvez aussi lire