Internet c’est facile, c’est intuitif. Vous allumez votre PC, vous ouvrez votre session, vous cliquez sur votre navigateur et vous lancez votre site favori YouPorn, Facebook, Twitter (avouez vous ne vous attendiez pas au premier). Si tout va bien le contenu se charge en moins d’une seconde, si tout va mal vous avez le temps de vous préparer un thé. Internet c’est magique. Il est bien loin le temps des exposés scolaires sur Encarta ou à la médiathèque, moi qui n’ai eu internet qu’à mes 18 ans (2010) en quittant la grotte familiale, je peux vous dire qu’avoir la fée internet chez moi aurait pas mal aidé mes années lycée.

Dans cet article je vais vous parler d’une chose à laquelle on pense moins devant tant de rapidité : comment fonctionne un site internet. Loin de nous intéresser aux pérégrinations qui mènent à sa création – car contrairement à la pensée commune, faire un site internet c’est compliqué – nous allons voir le côté technique de la chose : de la requête au serveur à l’affichage dans le navigateur. Je vous ai déjà perdu·e·s ? Pas de soucis, cet article est pour tout le monde, tout sera expliqué plus bas.

 

Le web et ses vicissitudes

Tout d’abord qu’est-ce que le web ? Le web est l’un des services d’internet, aux côtés du mail et du partage de fichiers pair-à-pair (P2P), abréviation commune de World Wide Web il permet de consulter des pages internet.

Le web fonctionne d’une manière assez classique, il s’agit d’un système client-serveur. Je sais que je vous ai déjà perdu·e·s, j’explique. Si l’utilisation du mot client peut être déroutante pour les non-informaticien·ne·s, elle est très répandue dans le milieu. Quand on utilise le terme « client » en informatique, et que l’on ne parle bien sûr pas du client de chair et d’os qui nous a demandé un devis pour une prestation, on parle alors de l’appareil avec lequel l’utilisateurice va consulter une page internet, que cet appareil soit un PC (ou un mac), une tablette ou encore un smartphone. Je m’explique : si un site internet marche bien, c’est qu’il est consulté, et s’il est consulté c’est qu’on saisit son URL (www.simonae.fr par exemple) ou que l’on clique sur un lien hypertexte pour y accéder. Finalement, si on y accède c’est qu’il va se charger dans nos navigateurs et sur nos machines. Le client c’est l’ordinateur, et plus précisément le navigateur (Internet Explorer, Firefox, Chrome, Opéra, etc.), qui va consulter le site. Quant au serveur, il s’agit de l’ordinateur distant (ou des ordinateurs distants) sur lequel sont hébergés les sites webs.

Tout va bien jusque là ?

Il y a bien des moyens d’accéder à un site internet, on peut le chercher sur un moteur de recherche (Google, Lilo, DuckDuckGo, Ecosia), on peut saisir l’URL directement dans la barre d’adresse, ou encore y accéder via un hyperlien. Quelle que soit la manière d’y accéder, le fonctionnement reste le même : le client « parle » alors au serveur et lui demande un certain nombre d’informations. Cette interaction est alors appelée une requête au serveur. Si tout va bien et si le serveur est « O.K. », il va alors envoyer à votre machine le code de la page internet que vous souhaitez consulter et votre navigateur va le lire. Par contre, si le délai d’attente est trop long ou si la page internet que vous recherchez n’existe plus, le serveur vous renverra un code d’erreur ! Ces deux dernières erreurs énoncées renvoyant respectivement les codes “504 Gateway Time-out” et “404 Not Found”.

Page d'erreur Google "418 I'm a teapot" ("418 je suis une théière")

Meilleure erreur du monde

Dès qu’il a le code (en général une association des langages HTML, CSS et JavaScript), le navigateur va l’interpréter. Une interprétation restant ce qu’elle est par essence, on va pouvoir alors constater qu’il y a plusieurs lectures d’un site internet : même si le code est unique, les navigateurs ne vont pas tous le lire de la même façon ! C’est ainsi que certains sites fonctionnent mal sur Internet Explorer par exemple.

Votre navigateur ayant lu et interprété le code reçu du serveur, vous pouvez désormais naviguer aisément.

Dessin d'une jeune femme portant un casque audio derrière un écran d'ordinateur.

Dessin d’une jeune femme portant un casque audio derrière un écran d’ordinateur.

Des compétences hétéroclytes

Un site web suit un système informatique classique dit système client-serveur. De ce fonctionnement naissent alors deux métiers complémentaires et distincts : celui de développeureuse front-end et celui de développeureuse back-end. Ne m’abandonnez pas ici ce n’est pas aussi compliqué que ça en a l’air. Alors que le front-end correspond au développement du côté client (pour rappel tout ce qui va être interprété par le navigateur et affiché à l’écran), le back-end quant à lui va s’occuper du côté serveur, en somme la base de données (où sont stockées les informations du site web), l’hébergement sur le serveur et tout ce qui est communication entre l’application (c’est à dire le site que vous consultez et d’où vous pouvez envoyer des informations) et le serveur. Un·e développeureuse sachant développer le front-end et le back-end est un·e développeureuse full-stack.

Si læ développeureuse full-stack est tout à fait capable de développer entièrement un site et de le déployer, je dois quand même vous rappeler que l’élaboration d’un site internet est beaucoup plus complexe, car savoir faire et savoir bien faire ne sont pas les mêmes choses. En effet, outre les conventions des langages informatiques, il existe également un certain nombre de conventions, notamment au niveau du design et de l’ergonomie (exemples de sites au design douteux). Vous l’aurez compris, si votre cousin·e informaticien·ne n’est peut être pas en mesure de vous faire le site de vos rêves, ce n’est pas pour autant qu’iel est mauvais·e dans ce qu’iel fait.

Cette autopsie des sites internet pourrait se résumer ainsi : nous avons une structure osseuse et des organes vitaux qui sont le côté serveur (back-end), et de la peau et des cheveux qui sont le côté client (front-end, le design étant le made-up). Même si c’est assez sommaire, ça pourrait être ça, à ceci près qu’un back-end peut exister sans front-end, je vous laisse imaginer le désordre d’un être sans épiderme… J’espère que cet article vous a plu et surtout qu’il vous a donné envie d’en savoir plus !