INADEN - Services Web et PAO

Création de sites Web, charte et identité graphique
Tous travaux en PAO, restauration de photographie.

Formation professionnelle

Formation PAO : Photoshop®, InDesign®, Illustrator®
Formation cahier des charges d'un site Web

Enregistrer au format PDF Accueil > Formation professionnelle > Ateliers informatiques > Structure du Web

Compréhension du rapport entre Web et Internet

Structure du Web

Comprendre comment on se connecte à un site Web

Ce cours-atelier s'adresse aux personnes qui veulent tenter de comprendre comment fonctionne une connexion Internet. C'est une approche de type vulgarisation qui vous permettra de comprendre les principes de base afin de maîtriser votre utilisation d'Internet en général et du Web en particulier.

La structure du Web

Fonctionnement d’une connexion Internet

Internet est le réseau des réseaux, c’est-à-dire que c’est une structure qui met en relation l’ensemble des réseaux qui s’y connectent. Internet est un réseau décentralisé, c’est-à-dire qu’il n’y a pas de structure qui centralise les connexions. Ainsi si un élément tombe en panne, un autre peut prendre le relais. Néanmoins, on peut dire qu’il existe un élément central : le DNS [1] qui permet la transformation d’un nom de domaine en adresse IP.
Cette structure est composée de deux parties :

  • L’architecture physique d’Internet qu’est le réseau lui-même. Il peut s’agir d’un réseau filaire (réseau téléphonique commuté, le câble, désormais la fibre optique) ou hertzien (Internet par satellite, 3G, Wifi, Wimax) ;
  • L’architecture logique d’Internet, composée des protocoles et standards de communication permettant le transport de données sur les réseaux, tels que l’Internet Protocol (IP), le Transmission Control Protocol (TCP) ou l’HyperText Transfer Protocol (HTTP) sur lequel est basé le Web.
    Lorsque vous lancez votre navigateur, la première chose que votre ordinateur fait pour se connecter s’est communiquer avec votre modem pour voir si vous avez bien l’autorisation de votre FAI pour vous connecter sur le net. Votre FAI fait passer votre requête vers le réseau physique (haut débit par exemple) et passe par divers relais vers un serveur DNS. Le serveur DNS renvoie alors la correspondance entre le nom de domaine et l’adresse IP du site, soit en établissant une liaison directe, soit en se rattachant à un nœud d’échange (point de peering). Pour retrouver l’IP correspondant au nom de domaine, ces nœuds d’échange utilisent le protocole de routage BGP [2]
    Traitement d’une requête HTTP (ou HTTPS) depuis un ordinateur

    Ce protocole complexe permet de vous amener à l’ordinateur qui héberge le site Web que vous cherchez à visiter. Tous ces échanges sont basés sur l’échange de paquets de données transmis par les protocoles TCP IP. Cette présentation est extrêmement résumée, et je n’y parle pas des nœuds, des routeurs, et de toutes l’architecture technique qui permet au « message » de ne pas se perdre et de garder son intégrité et la « puissance » de son signal (toute structure physique génère une perte de puissance d’un signal transmis – loi de la thermodynamique).

Structure d’un serveur Web

Une fois arrivé au serveur Web, votre requête va être analysée et vous conduire à une page Web. Cette page est construite à partir de différents langages et demande (ou non, mais le plus souvent oui) d’avoir accès à des données.
Le « serveur Web » est en fait un ordinateur qui possède plusieurs serveurs qui sont donc des types de services et de fonctionnalités qui vont communiquer entre eux.
Le premier serveur qui traite votre requête est le serveur Apache. C’est lui qui va orienter votre navigateur vers le dossier contenant le site que vous voulez atteindre. Le serveur Apache sert à paramétrer une multitude de choses, dont les différents langages de programmation qui sont utilisés pour la création des sites Web. Il gère aussi les droits et restrictions d’accès et la sécurisation d’une partie des sites Web. Et surtout, c’est lui qui gère le protocole HTTP. C’est aussi lui permet la réécriture d’URL (URL rewrinting) permettant d’utiliser des adresses de pages qui sortent de la structure de l’arborescence serveur et dont je parlerais un peu plus loin.
Lorsque vous atteignez la page Web que vous voulez visiter, à travers le langage de programmation qui sert à la construire, vous allez interroger le serveur de base de données dont l’un des plus répandus est le serveur MySQL.
Enfin, l’ordinateur qui héberge le site Web peut aussi contenir un serveur de courrier pour les envois de mail (l’un des plus répandus est postfix), un serveur permettant le dépôt de fichier ou serveur FTP (par exemple proftpd) et un serveur permettant une connexion sécurisée le serveur SSH. Grâce à lui, on peut mettre en place les connexions SSL à la base du protocole HTTPS et le FTP sécurisé ou SFTP.

Les URL

Traitement d’une requête par un serveur Web.

Les URL sont composées du nom de domaine du site Web suivi de différents paramètres. Initialement, les URL sont liées à l’arborescence de dossiers et de fichiers de votre site Web. Si votre site Web est composé ainsi :

  • Page index (la page d’accueil d’un site est la racine de l’hébergement et porte toujours le nom d’index suivi de l’extension du fichier (html, php, asp…).
  • Dossier1
    • Page1
    • SousDossier1
      • Page1
      • Page2
    • SousDossier2
      • Page1
      • Page2
  • Dossier2
    • Page1
    • SousDossier1
      • Page1

Si vous voulez atteindre la page 2 du SousDossier2 contenu dans le Dossier1, votre URL serait :

http://www.nomDeDomaine.extention/Dossier1/SousDossier2/page2.extention

Pour sortir de ce type d’écriture d’adresse de page Web, il est possible grâce au serveur Apache de réécrire les URL et d’attribuer une ou plusieurs nouvelles URL pour chaque page du site. Ainsi, l’URL précédent pourrait devenir :

http://www.nomDeDomaine.extention/sujetDeLaPAge
ou
http://www.nomDeDomaine.extention/Rubrique/Sujet2

Qu’elles soient réécrites ou non, les URL peuvent aussi contenir des variables. Pour séparer l’expression des variables de l’URL elle-même, on utilise un point d’interrogation. À la suite de cette marque, on nom la variable et à l’aide du signe égal on attribue sa valeur. Enfin, on sépare les variables par le signe esperluette (&). Cela donnera :

http://www.nomDeDomaine.extention/page.extention?var1=valeur1&var2=valeur2

Remarque sur les noms de domaine

Dans l’URL http://www.nomDeDomaine.extention il faut savoir que cette adresse est non pas l’adresse par défaut d’un site, mais déjà un sous domaine. En effet, si le nom de domaine est nomDeDomaine.extention, l’adresse par défaut du site sera http://nomDeDomaine.extention et l’adresse http://www.nomDeDomaine.extention est ce que l’on appelle un sous-domaine. Néanmoins on a coutume d’attribuer ce sous-domaine comme alias [3] du domaine principal. On peut ainsi donner à un nom de domaine autant de sous domaine que l’on veut. Par exemple, vous avez un site laMarqueDeMasociete.extention. Vous pouvez lui attribuer des sous-domaines correspondants à différentes fonctionnalités ou parties de votre site comme boutique.laMarqueDeMasociete.extention (pour la boutique) ou identification.laMarqueDeMasociete.extention (pour le service d’identification sur le site).

ATTENTION : lorsque l’on utilise un sous-domaine on ne peut avoir dans l’adresse les www traditionnels, puisqu’ils représentent eux-mêmes un sous-domaine. L’URL d’un sous-domaine est toujours de la forme :

http://sousdomaine.domaine.extention

Quelques autres protocoles Internet

Les principaux protocoles sont les suivants, classés selon leur couche (IP, TCP et UDP) ; couches applicatives :

  • IP (Internet Protocol) aussi appelé IPv4 : protocole réseau qui définit le mode d’échange élémentaire entre les ordinateurs participant au réseau en leur donnant une adresse unique sur celui-ci. Cependant, en raison du nombre d’internautes croissant, une nouvelle norme voit le jour ; nommée IPv6, elle permet d’accueillir un plus grand nombre d’utilisateurs.
  • TCP : responsable de l’établissement de la connexion et du contrôle de la transmission. C’est un protocole de remise fiable. Il s’assure que le destinataire a bien reçu les données, au contraire d’UDP.
  • HTTP (HyperText Transfer Protocol) : protocole mis en œuvre pour le chargement des pages Web.
  • HTTPS : pendant du HTTP pour la navigation en mode sécurisé.
  • FTP (File Transfer Protocol) : protocole utilisé pour le transfert de fichiers sur Internet.
  • FTPS (File Transfer Protocol Secure ou SFTP) : pendant du FTP pour le transfert de fichiers sécurisés
  • SMTP (Simple Mail Transfer Protocol) : mode d’échange du courrier électronique en envoi.
  • POP3 (Post Office Protocol version 3) : mode d’échange du courrier électronique en réception.
  • IMAP (Internet Message Access Protocol) : un autre mode d’échange de courrier électronique.
  • IRC (Internet Relay Chat) : protocole de discussion instantanée.
  • NNTP (Network News Transfer Protocol) : protocole de transfert de message utilisé par les forums de discussion Usenet
  • SSL ou TLS : protocoles de transaction sécurisée, utilisés notamment pour le paiement sécurisé.
  • UDP : permet de communiquer, de façon non fiable, mais légère, par petits datagrammes.
  • DNS (Domain Name System) : système de résolution de noms Internet.
  • ICMP (Internet Control Message Protocol) : protocole de contrôle du protocole IP.

Enfin, on trouve des protocoles de connexions sécurisées :

  • VPN : (Virtual Private Network) ou RPV (réseau privé virtuel), est un système permettant de créer un lien direct entre des ordinateurs distants. On utilise notamment ce terme dans le travail à distance, ainsi que pour l’accès à des structures de type cloud computing.
  • SSH : Secure Shell (SSH) est à la fois un programme informatique et un protocole de communication sécurisé. Le protocole de connexion impose un échange de clés de chiffrement en début de connexion. Par la suite, tous les segments TCP sont authentifiés et chiffrés. Il devient donc impossible d’utiliser un sniffer pour voir ce que fait l’utilisateur. Le protocole SSH a été conçu avec l’objectif de remplacer les différents protocoles non chiffrés comme rlogin, telnet, rcp, ftp et rsh.

Il existe une multitude de protocoles réseau dont la liste est présente sur https://fr.wikipedia.org/wiki/Protocole_réseau.

Les langages de programmation

Définition

On distingue deux types de langage de programmation :

  • Les langages côté serveur : dont les calculs sont faits par le serveur
  • Les langages côté client : dont les calculs sont faits par le navigateur et donc par l’ordinateur de l’internaute

Globalement un langage de programmation sert à :

  • Générer une donnée à partir d’un calcul établi avec d’autres données (âge de la personne s’étant identifiée selon la date du jour et sa date de naissance)
  • Donner un ordre directement à un objet selon une situation (arrivée du scroll en bas de page) ou une intervention externe (clic de l’internaute)
  • Vérifier quelque chose pour donner un ordre en fonction du résultat (vérifier la présence dans une base de données et le type de droit d’un internaute s’identifiant sur un site pour lui accorder le droit à telle ou telle action)
  • Stocker et chercher des données dans une base de données (soit automatiquement soit sur action de l’utilisateur).

La programmation va donc permettre la mise en place de réponses à des actions ou des états selon différents schémas procéduraux et structurels, par l’établissement d’une succession d’étapes et/ou par l’appel et l’interaction de « briques logicielles » définies dans le langage lui-même.
En effet, en tant que langages, ils possèdent un vocabulaire et une grammaire et ce vocabulaire va comporter à la fois des « types de nature d’objet [4] » (tableaux, nombres, texte…), des fonctions qui vont agir sur ces objets (concaténer, changer le type, décomposer…), des valeurs attribuables à ces objets — qui peuvent être elles-mêmes des objets — et des réponses aux fonctions appliquées à ces objets (vrai, 2, un tableau (array), « un texte »).

Les langages du Web

HTML

Le langage HTML est la base d’une page Web. C’est un langage de balise qui structure la page. Initialement, le langage HTML n’est pas un langage de programmation, c’est un langage permettant l’affichage des éléments qu’il comporte. Néanmoins, le développement de ses possibilités à travers le HTML5 en fait à présent, avec CSS3 et JavaScript, un langage de programmation, tout du moins, d’une partie de la programmation inhérente à toute page Web.

CSS

Si le HTML est un langage permettant de structurer une page Web, les CSS (Cascade Style Sheet ou feuille de styles en cascade) est le langage qui permet d’habiller les balises HTML en fournissant des valeurs aux différentes propriétés desdites balises. Outre cet habillage, les CSS permettent un premier niveau d’interactivité à travers des propriétés de mouvement, de transformation et de réaction aux actions de la souris.

JavaScript

Le JavaScript est un langage côté client, c’est-à-dire que ses calculs sont faits par le navigateur et exploitent donc les ressources de l’ordinateur de l’internaute et non celles du serveur sur lequel est hébergé le site Web consulté. Allié au HTML et aux CSS, le JavaScript permet énormément de choses et est à la base de l’interactivité au niveau de l’expérience utilisateur. Il possède des frameworks et des librairies permettant une parfaite compatibilité entre navigateurs dont la plus utilisée est JQuery.

Perl, PHP, Ruby, Python…

Ces langages sont des langages de programmation côté serveur. Toutes leurs requêtes sont calculées par l’ordinateur hébergeant le site. Ces langages ont pour point commun de pouvoir générer du code HTML en fonction des conditions traité par des algorithmes. Ils permettent aussi le dialogue avec les bases de données, tant dans la lecture que dans l’écriture. Ce sont aussi ces langages qui sont à la base des CMS permettant la mise en place « simplifiée » d’un site Web.

MySQL

MySQL est le serveur (et le langage) permettant de construire et d’interagir avec une base de données. S’il existe d’autres langages de BDD (SQLLight, SQL, Oracle, Acces…), MySQL est surement la plus utilisée sur le net. L’ensemble Apache, PHP MySQL est dénommé LAMP sur Linux ou Wamp sur Windows.

Structuration du Web

Ravi Kumar, un chercheur du laboratoire d’Almaden, avec l’aide d’Andrei Broder et de Farzin Maghoul, du moteur de recherche Altavista ont étudié le rapport des différentes parties du Web (je dis bien du Web et non d’Internet) et ont remarqué que celui-ci se distribuait en zones de plus ou moins forte densité.

Les résultats de cette étude de la structure du Web aboutissent à plusieurs constats frappants.
Tout d’abord il existe une zone du Web composé de pages fortement liées entre elles (la zone SCC (strongly connected component). Dans cette zone, toute page est accessible en suivant les liens émanant de pages de la même zone (même s’il faut suivre plusieurs centaines de liens pour y parvenir). Cette zone comporte 56 millions de pages.
Une deuxième zone de taille plus réduite : 44 millions de nœuds (IN) est composée de pages qui permettent d’accéder aux pages de la zone SCC, mais qui ne sont pas accessibles depuis les pages de la zone SCC.
Une troisième zone (OUT), de taille équivalente à IN (44 millions de nœuds) est composée à l’inverse de pages qui sont accessibles depuis la zone SCC, mais les pages de OUT ne renvoient pas vers les pages SCC…

Et pour en savoir plus : https://www.gsara.tv/neutralite/?p=64


[1DNS : Domain name system

[2Border Gateway Protocol (BGP) est un protocole d’échange de route utilisé notamment sur le réseau Internet. Son objectif est d’échanger des informations de routage et d’accessibilité de réseaux (appelés préfixes) entre Autonomous Systems (AS). https://fr.wikipedia.org/wiki/Border_Gateway_Protocol.

[3En informatique, un alias est un élément qui permet d’atteindre un dossier ou un fichier et qui le représente comme s’il était le dossier ou le fichier lui-même tout en étant rangé ailleurs sur le disque dur. On parle aussi de raccourci.

[4ATTENTION. On parle pour certains langages de programmation de langage orienté objet, ou de programmation orientée objet (POO) ce qui fait référence à un paradigme de la programmation informatique. Même si ici on peut entendre mon expression dans ce sens d’objet, ce rapprochant un peu de la notion Kantienne de concept, c’est-à-dire un ensemble de propriété qu’il reste à qualifier mais qui définit un élément de conscience, je l’utilise de façon plus générique sans vouloir y apporter les spécifications de la POO. Il semblerait d’ailleurs qu’il y ait un débat conceptuel entre les informaticiens sur ce qu’est un langage de programmation orienté objet. Pour exemple, un post de bluestorm sur https://openclassrooms.com/forum/sujet/programmation-orientee-objet-c-est-quoi-53373) : Il n’y a pas de consensus sur la définition de ce qu’est la programmation orientée objet. Il y a un relatif consensus sur le fait que l’appel de méthodes (ou envoi de messages) gérées par chaque objet individuellement de façon opaque (encapsulation et late binding) est nécessaire pour la POO. Il n’y a pas vraiment de consensus sur la notion d’héritage d’implémentation (est-elle nécessaire à la POO ou non ?), qui est pourtant présente dans la plupart des mises en œuvre dans des langages de programmation.

u