Comment fonctionne un site web ?

Avant de vouloir se lancer dans la création et le codage de son site web, il est important de comprendre son fonctionnement.
Voici un article pour comprendre comment fonctionne un site web.

1. Aperçu simplifié:

Tout d’abord il faut savoir que lorsque l’on navigue sur le web, il y a un dialogue, un échange qui s’effectue, entre un serveur et un client.

Le client, c’est votre navigateur, Chrome, Firefox, Edge, Opéra… Il vous permet de voir le contenu des sites depuis votre support (tablette, ordinateur, smartphone…). Le serveur quant à lui, c’est un puissant ordinateur qui contient le site web, tous les fichiers qui le composent. Son but est de servir les clients, d’où son nom de  “Serveur”.

 

Echange client-serveur

 

Le client, en utilisant l’url du site va envoyer sa commande au serveur via internet. Et ensuite le serveur va lui renvoyer les pages du site  en guise de réponse.

 

 2. Comment ça marche ?

Tout d’abord vous allez rentrer l’adresse du site (ou cliquer sur un lien) sous la forme “http://monadresse.com/dossier1/dossier2/votrepage”.
D’ailleurs, cette adresse peut se décomposer:


http, c’est le nom du protocole qui régit la communication entre le client et le serveur
monadresse.com, c’est le nom de domaine du site
/dossier1/dossier2/votrepage, c’est le répertoire, l’endroit où se trouve la page que vous voulez voir dans le site

Ensuite, votre navigateur va envoyer sa requête au serveur. Et là il y a deux possibilités:

D’une part, si la page de votre site web est dynamique, c’est à dire que vous aller sur un compte, ou que vous avez des données personnelles à afficher, le serveur va “travailler” il prépare votre commande avant de vous la renvoyer. Ce sont donc des pages personnalisées, et un très bon exemple  pour ce genre de site c’est Facebook. Chaque utilisateur a un contenu unique !!
Il existe aussi un autre genre de page dynamique, ce sont tous les sites d’actualités, les sites types journaux, magazines, ou autres qui nécessitent de fréquentes modifications…
D’autre part, s’il s’agit d’une page statique, c’est à dire une page qui présente des informations qui ne seront pas amenées à être modifiées, une page vitrine, le rôle du serveur va être seulement de renvoyer la page demandée. Il n’aura pas de “travail” à faire.
Dans les deux cas, votre navigateur va recevoir du contenu sous forme de code que vous ne verrez pas. C’est donc en traduisant ce code qu’il va vous afficher vos pages web.

3. Les langages des navigateurs:

Un navigateur comprend trois langages différents:
Le Html le CSS et le JavaScript.
En premier langage, afin de créer le corps, la structure d’un site on va utiliser le Html. Ce langage définit le contenu de votre site, le titre, les paragraphes, images, vidéos liens…
En deuxième langage,  nous utiliserons le CSS, c’est le langage de la mise en page. En effet, c’est avec lui que nous définirons la couleur et la taille des différents éléments, le style, l’alignement etc..
Enfin, pour rendre une page web interactive avec son utilisateur, nous utiliserons le JavaScript.

4. Les langages des serveurs:

Lorsque vous allez sur un site dynamique, sur votre profil Facebook par exemple, vous allez faire travailler le serveur.
Celui-ci n’utilise pas les mêmes langages que votre navigateur ! Il existe deux langages principaux utilisés par les serveurs: le PHP et le JAVA. Mais contrairement au navigateur ces deux langages ne sont pas utilisés ensemble, c’est l’un ou l’autre. Ils permettent tous deux de travailler une page en fonction de la situation, de la personne qui la consulte…
Le serveur devra donc posséder une base de données pour ce genre de site, et utiliser un autre langage pour la créer, la modifier et effectuer toutes les opérations nécessaires à la gestion de sa base de données. Ce langage c’est le SQL.

 

Pour résumer:

Lorsque vous surfez sur la toile, l’affichage de votre page web dans votre navigateur est le résultat d’un échange entre celui-ci et un serveur. Si votre page est statique le serveur vous la transmet directement après avoir lancé votre requête. Si elle est dynamique, le serveur va d’abord effectuer un “travail” sur celle-ci, en utilisant la base de données qu’il possède.
Les navigateurs utilisent principalement 3 langages différents qui composent une page web: le Html, le CSS et le JavaScript. Ainsi, la lecture de ces codes donne l’affichage de la page web par votre navigateur.
Par ailleurs, les serveurs, lorsqu’ils effectuent un “travail” sur une page dynamique, utilisent le PHP ou le JAVA  pour traiter les données. Pour gérer la base de données, les serveurs utilisent le langage SQL.

En bonus de cette présentation, je vous propose, depuis votre ordinateur d’appuyer sur la touche F12, pour la grande majorité, vous obtiendrez alors le “code” de la page sur laquelle vous êtes !!


Enfin, j’espère que cet article vous a plu, n’hésitez pas à laisser un commentaire pour me dire ce que vous en pensez, JB.

 

Partager l'article :