Comprendre comment fonctionne un hébergement de site web

Bonjour,

Dans cet article (en cours de rédaction) je vais essayer de tracer les grandes lignes qui permettent de comprendre les notions élémentaires pour faire fonctionner un site web, et ensuite un cas d’école avec OVH en hébergement mutualisé.

1. Le nom de domaine

Le nom de domaine doit être choisi avec l’extension souhaitée. Chaque extension (.COM, .BE, .FR …) est gérée par un registre (registry), et ce registre applique ses propres règles de fonctionnement, plus ou moins libérales, ainsi que sa tarification de gros.
Par exemple, .EU n’est accessible qu’à des citoyens ou entités ayant un ancrage en Europe.
Autre exemple, .BE va vouloir valider l’exactitude de votre adresse (avec itsme ou eID pour les citoyens belges)

DNSBelgium.be gère les extensions .BE, .BRUSSELS et .VLAANDEREN
EURid gère .EU
AFNIC gère .FR mais aussi plusieurs extensions des territoires outremer.

Le nom de domaine ne peut pas être acquis directement chez le registre (registry), mais auprès d’un revendeur de noms de domaines (registrar). Citons en France: OVH, Netim, Gandi, etc. En Belgique: Combell, Register.be, Emakina, etc. Ces revendeurs ne se limitent pas à l’extension du pays où ils sont localisés.

Le nom de domaine choisi doit évidemment être libre, ou appartenir à quelqu’un avec qui vous avez convenu de vous le céder. Choisissez un nom de domaine sans accents, ou faites-le uniquement en connaissance de cause. La seule ponctuation autorisée est le trait d’union “-“.

Vous paierez la redevance annuelle de votre nom de domaine auprès du revendeur.

Si vous achetez le nom de domaine pour quelqu’un d’autre, c’est son nom qui doit figurer comme titulaire/propriétaire.

Dans cet article, je cite quelques noms de sociétés et je ne suis rétribué par aucune. Le scénario le plus simple et de tout héberger auprès d’un unique partenaire. Citons: OVH (France), Infomaniak (Suisse), Microsoft365 (multinationale), Google (multinationale), etc.

2. Le système DNS

Dans Internet, tous les serveurs ont une adresse IP sous forme numérique. C’est impossible à retenir. Il convient d’avoir un annuaire global qui permet de faire la conversion du nom du site visité, vers l’adresse IP du serveur qui héberge le site. Cet annuaire, c’est un système distribué: DNS (Domain Name System)

Exemple: blog.demees.net -> 213.186.33.24 ou bien 2001:41d0:1:1b00:213:186:33:24

Pour arriver à cela, ça se passe en plusieurs temps sans que vous en soyez conscient.

– on consulte les serveurs DNS du registre ‘.net’
– le registre connaît les serveurs DNS du domaine ‘demees.net’
– il donne la réponse: les serveurs autoritatifs pour ce domaine demees.net sont: ‘ns.ovh.net’ et ‘dns.ovh.net’
– on consulte à son tour un de ces serveurs ‘ns.ovh.net’ ou ‘dns.ovh.net’, qui donne la réponse à notre question: blog.demees.net -> (A) 213.186.33.24

Le serveur DNS conserve tous les enregistrements d’un domaine donné dans une “Zone DNS“.
Ces enregistrements sont de divers type ou natures:
– type A : à un nom, faire correspondre une adresse IP (IPv4). C’est la fonction la plus basique, et notamment celle qui désigne le serveur web.
– type AAAA : à un nom, faire correspondre une adresse IPv6. IPv6 voit le jour comme successeur des adresses IP car toutes les adresses IPv4 possibles ont été distribuées et il y a pénurie.
– type TXT : à un nom, faire correspondre une chaîne de texte. C’est un fourre-tout qui peut servir à n’importe quoi, notamment à des fins d’authentification et prouver auprès d’un tiers qu’on est bien le propriétaire du domaine.
– type MX : dans cet enregistrement on désigne le nom du serveur SMTP qui va accepter les nouveaux e-mails entrants pour ce domaine. Il peut y avoir plusieurs enregistrements MX pour plusieurs serveurs.
– type CNAME : désigne un synonyme, la cible d’un CNAME est un nom de serveur et non une adresse IP. Un CNAME est mutuellement exclusif avec la présence de tout autre enregistrement (A, AAAA, TXT, MX ou autre). La cible d’un CNAME peut être un nom de serveur dans un autre domaine que le vôtre. Terminez son nom par un point.
– types SOA, NS : si ces informations sont présentes, ne tentez pas de les modifier dans votre zone DNS.
– types ANAME, ALIAS, SPF … il s’agit d’inventions de certains fournisseurs qui ne sont pas standard.

3. Le serveur web

Au minimum, le serveur web qui héberge votre site et bien d’autres, va être sollicité et fournir une réponse.
Un utilisateur (au moyen de son navigateur internet) va ouvrir une connexion vers le serveur web et demander d’obtenir une page, par exemple blog.demees.net/

3.1 HTML

Les conversations entre le serveur et votre navigateur (Edge, Firefox, Chrome, Safari, …) se font en HTTP et HTML. Votre site est normalement composé de fichiers HTML.
Voici un exemple de page HTML qui affiche “Hello World !”:

<HTML>
<HEAD>
<META charset=UTF-8">
</HEAD>
<BODY bgColor=#ffffff>
<DIV align=center><FONT face=Arial size=2>Hello World !</FONT></DIV></BODY></HTML>

3.2 PHP

PHP est un langage de programmation. Dans le cas de sites web, le résultat de l’exécution du programme PHP est du code HTML, que le serveur web va envoyer au navigateur, et que le navigateur va afficher à l’écran.

Exemple de page PHP:

<?php phpinfo(); ?>

Voyez les marqueurs <?php et ?> qui identifient du langage PHP.

Grâce à de la programmation, les sites peuvent aller chercher de l’information personnalisée, par exemple vous présenter la météo du jour à votre ville, ou le contenu de votre panier de commande. Sans programmation, tout le monde verrait le même contenu de votre site, qui ne serait donc guère plus que la version électronique d’un prospectus.

3.3 SSL

Aujourd’hui (2023) plus aucun site web ne peut se permettre d’exister sans avoir un certificat SSL avec HTTPS. Un certificat a deux utilités:
(1) il atteste que le site que vous visitez est bien celui dont l’adresse se trouve dans la barre d’adresse du navigateur, et
(2) il met en place des communications cryptées entre votre navigateur et le serveur web (confidentialité, absence de modifications)
Un certificat n’atteste pas que le site visité est honnête. Les truands utilisent aussi SSL. Vérifiez toujours l’adresse du site visité.
Let’s Encrypt génère des certificats gratuits. C’est l’hébergeur du site web qui doit mettre ce certificat en place.

4. Applicatifs pour réaliser des sites web, ou “gestionnaires de contenu”

Ici on doit bien faire la distinction entre 2 marchés différents: soit vous optez pour un système entièrement géré, soit vous prenez un hébergement généraliste qui vous laisse toute la liberté de choisir vos logiciels et votre organisation de fichiers.

4.1 les systèmes clés en main

Il s’agit d’offres de fournisseurs qui incluent l’hébergement de votre site, et vous ne vous occupez que du contenu. L’hébergement est une “boîte noire” que vous utilisez telle qu’elle vous est proposée, et c’est généralement un outil convivial et performant.
Le fournisseur a la responsabilité de tout faire fonctionner sans que vous soyez impliqué.
Cette solution est généralement plus chère qu’un hébergement généraliste.
Quelques acteurs: Wix, Jimdo, Vistaprint, etc.
Une fois lié avec un de ces fournisseurs il n’existe généralement aucun moyen d’en sortir, à moins de devoir refaire votre site à partir de zéro et avec d’autres outils.

D’autres hébergeurs sont absolument orientés WordPress, et gèrent votre installation WordPress pour vous. Citons WordPress.com, Kinsta, Nexcess … Prévoir une dépense de 20 à 35 USD/mois au minimum, rien que pour l’hébergement du site.

Ces hébergeurs ne sont généralement pas intéressés dans la gestion des e-mails, et ne l’incluent pas dans leur offre, ou bien la sous-traitent.

4.2 les hébergements généralistes

Un hébergement complet contiendra dans la plupart des cas, :

– un nom de domaine (pour cela votre fournisseur doit être bureau d’enregistrement)

– un hébergement de vos adresses DNS, pour cela:
. l’adresse des serveurs DNS est déclarée auprès du bureau d’enregistrement
. une zone DNS qui contient une liste de toutes les correspondances nom – adresse IP, etc. de votre domaine, pour le site web, pour les e-mails, etc.

– un serveur web, capable d’interpréter un langage de programmation, souvent PHP, parfois Python, .NET, Perl…
. une certaine quantité d’espace disque associée, pour mettre votre site, les images, etc.
. une (ou plusieurs) base(s) de données. Il faut voir une base de données SQL comme une collection de tableaux, et ces tableaux sont constitués de lignes et colonnes, un peu comme dans Excel.

– des e-mails avec un certain nombre de boîtes, qui ont chacune une certaine capacité ; et la possibilité d’émettre un certain nombre d’e-mails depuis vos boîtes mais aussi des messages automatisés à partir de vos sites web.

– certains prestataires proposent en plus des fonctions d’agendas partagés et contacts, des services VPN, de réunions en ligne, de téléphonie par internet, … mais ceci sort du cadre d’un hébergement.

Il faut bien se rendre compte que la tenue à jour de ce que vous avez décidé d’installer dans cet hébergement, avec la plus grande flexibilité, est de votre responsabilité et requiert quelques connaissances, ou tout au moins de la curiosité intellectuelle et une envie de se documenter par soi-même avec autonomie, afin de trouver des réponses à vos questions.

4.3 Les solutions mixtes

Vous décidez d’héberger votre site web (et rien que le site web) auprès d’un acteur spécialisé, citons par exemple systeme.io, Shopify, Pixpa, Wix, Odoo, alors que vous laissez les autres prestations chez un autre hébergeur.

Les solutions mixtes sont les plus compliquées à gérer.

A l’extrême vous pourriez panacher comme suit:

• enregistrer le domaine chez A
• héberger la zone DNS chez B
• héberger le serveur web chez C
• utiliser des services CDN pour une meilleure présence mondiale chez D
• héberger les mails chez E
• pour le mail, utiliser une solution anti-spam chez F
• avoir aussi quelques boîtes mail chez G
• et enfin un processeur d’e-mailing de masse (publipostage) chez H
• Vous pourriez encore adjoindre des bases de données externes, du tracking, des statistiques, de la publicité, etc., la liste n’est pas limitative.

5. Et chez OVH ?

5.1 Le parcours idéal

Délimitez vos besoins. Quel nom de domaine ? Quelle taille pour l’hébergement ? Combien de boîtes mail ?

Comment allez-vous composer votre premier site web ? Pour un blog, une page de présentation, ou le site d’une association: un des incontournables s’appelle WordPress. Pour des sites plus spécialisés (photographe professionnel, webradio, …) ce n’est peut-être pas idéal.
Pour un site d’e-commerce, je ne vais pas faire de recommandation. N’oubliez pas que pour vendre, vous devez accepter des moyens de paiement, cette partie de votre futur site web n’est pas à prendre à la légère.

Votre site web sera très certainement basé sur un gestionnaire de contenu (en anglais: CMS ou Content Management System). J’ai déjà cité WordPress plus haut. Il en existe plein d’autres, comme Joomla, Prestashop, Drupal, Typo3, …

L’énorme majorité des CMS requiert un hébergement web avec le langage PHP et une base de données.

Passons à la pratique.

Lors de la commande, OVH propose des modules préinstallés. Je pense que c’est une erreur de proposer cela. C’est bien pour attirer des clients néophytes en laissant croire qu’il ne faut aucune connaissance de base pour se lancer. Outre le fait que ça viole le contrat que vous devez valider par ailleurs (et qui stipule que vous devez avoir les compétences nécessaires pour gérer un site), ça met juste une couche de peinture pour masquer ce qu’il y a derrière, et un jour ou l’autre vous devrez bien mettre les mains dans le cambouis.

5.2 Le processus de commande

Je vous recommande donc d’acheter lors d’une commande unique:

• le nom de domaine
• un hébergement Perso (meilleure offre pour débuter et progresser)

OVH “oublie” de mentionner que l’offre perso est accompagnées de 10 boîtes mail. Peut-être pour vendre plus de Pro ?

Au départ, n’optez pas aveuglément pour les services annexes tels que:

• DNS Anycast
• Visibilité Pro
• CDN
• Certificats payants
• Web Cloud Databases
• Hébergement web gratuit (Start100m)

La plupart sont inutiles pour vous, et regardez bien les prix affichés: il s’agit pour la plupart de tarifications au mois et non à l’année.

N’installez aucun module.

Envoyez le bon de commande, payez par carte et non par virement, la livraison peut prendre quelques minutes à quelques heures.

A ce stade vous aurez créé un compte client chez OVH. Si vous avez activé l’authentification à 2 facteurs, arrêtez ici la lecture, et si ce n’est pas déjà fait, allez générer tout de suite une liste de 10 codes de secours, imprimez-les et placez-les dans votre coffre-fort ou ce qui en tient lieu.

5.3 Familiarisez-vous avec “l’espace client OVH”

Une fois votre nom de domaine et votre hébergement livrés, familiarisez-vous avec l’espace client OVH (ovh.com/auth), dans la section “Web Cloud”. Désactivez toute traduction automatique au niveau de votre navigateur. Cloud s’appelle Cloud et non Nuage !

Vous allez trouver :

• dans “Domaines” ce qui concerne le Domaine et tout ce qui gravite autour de DNS
• dans “Hébergement” tout ce qui concerne votre site web et sa base de données
• dans “E-mails” tout ce qui concerne vos 10 boîtes mail

Préparons un peu votre environnement:

Dans Hébergement, FTP/SSH, changez le mot de passe FTP, et activez l’option SFTP

Notez l’adresse (par exemple ftp.cluster099.hosting.ovh.net), notez le login et le mot de passe que vous venez de mettre. Ce sont vos identifiants FTP.

Dans Hébergement, Informations générales, vérifiez de mettre une version de PHP récente et d’activer SSL.

Dans Hébergement, Multisite, pour chacun des deux domaines avec votre nom, activez SSL, mais laissez les autres options inchangées: pas de logs séparés, pas de pare-feu, et dossier racine = www. Aussitôt fait, dans Actions: regénérer le certificat SSL.

Enfin, dans Hébergement, Base de données, vous devrez créer une base de données. Une fois créée vous aurez besoin de 4 éléments pour accéder à votre base:

  et le mot de passe que vous avez choisi.

Notez bien cela aussi.

Vous voilà donc avec 3 identifiants différents:

• l’espace client OVH, identifiant de la forme XY12345-OVH, son mot de passe, son authentification à 2 facteurs recommandée
• le FTP: un nom de serveur, un login, un mot de passe
• la base de données: serveur, database, login et mot de passe. Chez OVH, database et login sont identiques.

5.4 Familiarisez-vous avec votre FTP

Maintenant il est temps de dompter votre espace FTP. Je vous recommande l’excellent logiciel FileZilla (lien de téléchargement).

Dans FileZilla, je vous recommande d’utiliser SFTP, port 22, nom de serveur: ftp.clusterXXX.hosting.ovh.net (en remplaçant XXX par ce qui vous a été attribué). Cette connexion SFTP est sécurisée.

Apprenez à copier des fichiers depuis votre PC vers votre espace web. Si vous les déposez dans le dossier /www vous pourrez vérifier leur présence avec un navigateur à l’adresse http://votredomaine.com/nomdefichier

Tant que vous êtes là, supprimez sans autre question le fichier index.html que OVH a mis dans votre espace vide, et qui affiche une page “Site en construction”.

5.5 Le fameux “Dossier racine” qui pose tant de problèmes !

Plus haut vous avez vu l’écran multisite:

Voyons la même chose depuis l’espace FTP:

Vous voyez la présence des deux dossiers “rsip” et “www” qui correspondent aux sites énumérés plus haut. La capture d’écran montre le contenu de /www, qui héberge un site WordPress.

Si vous vous trompez entre le nom de dossier dans votre FTP par rapport au “Dossier Racine”, votre site ne fonctionnera pas. Il fera une erreur 404, ou affichera une page vide. Il faut que ça corresponde exactement.

5.6 Installation de WordPress

Ceci se passe en plusieurs étapes:

• vous téléchargez WordPress depuis le site officiel (wordpress.org). Vous allez recevoir un fichier zip de 20 à 30 mégabytes.
• vous dézippez cette archive. Il en résulte plusieurs milliers de fichiers.
• vous copiez ces milliers de fichiers dans votre serveur FTP (depuis le répertoire “wordpress” de votre PC, vers le répertoire “www” du serveur FTP, ceci afin que wp-content, index.php, readme.html et d’autres se trouvent dans le répertoire www à la fin de la copie)
• vous visitez votre site à son adresse officielle https://votresite.com , c’est-à-dire celle que vous allez diffuser sur vos cartes de visite et sur le lettrage de votre camionnette.
• vous êtes prêt à fournir les 4 identifiants de la base de données pour pouvoir faire la configuration initiale, et vous vous laissez guider.

Votre WordPress est installé ! Bon succès !

Durant la vie de votre site, tâchez d’avoir une bonne “hygiène informatique”. N’installez que des thèmes et des “plugins” qui vont sont nécessaires ou utiles. Désinstallez ceux que vous avez testés mais que vous n’utilisez pas. Bannissez ceux qui ne sont pas régulièrement maintenus. Faites les mises à jour régulières.

6. Et les e-mails ?

Les e-mails, c’est un hébergement spécifique, qui n’est pas lié à la partie web. Cette partie est beaucoup trop longue et complexe, et sort du sujet de cet article dont l’objectif est de décrire un hébergement de site web.

Je vais juste énumérer quelques mots-clés:

• serveur mail: serveur qui réceptionne les nouveaux mails qui arrivent, permet généralement de créer des dossiers et de gérer ses mails dans les différents dossiers. Gérer un serveur mail est une tâche ingrate car les utilisateurs ont toujours tendance à vouloir conserver bien plus que nécessaire, et comme le désordre est moins visible que dans la cuisine, il a de beaux jours devant lui.
• client mail: c’est le logiciel que vous utilisez pour lire vos mails: citons Thunderbird, Outlook, les logiciels “Mail” sur les appareils mobiles, mais aussi les webmails comme Roundcube ou Squirrelmail par exemple.
• SMTP: c’est le protocole couramment utilisé par un client mail pour expédier le courrier sortant vers son serveur mail habituel. C’est aussi le protocole utilisé entre les différents serveurs pour acheminer le mail vers sa destination.
• POP3: c’est un protocole ancestral utilisé par un client mail pour aller récupérer ses nouveaux mails auprès du serveur mail. Typiquement le client récupère les mails, et puis les efface du serveur. Dans ce schéma apparenté à notre bonne vieille boîte postale, le serveur ne contient pas de dossiers de classement, et est constamment vidé. En particulier, les messages envoyés ne sont pas stockés sur le serveur.
• IMAP: ce protocole entre client et serveur permet de lire ses mails, conserver ses mails sur le serveur, créer des dossiers, déplacer/copier des mails d’un dossier à un autre, etc. Plusieurs appareils peuvent utiliser la même boîte simultanément. Le statut lu/non-lu est tenu à jour de manière consistente entre tous les clients connectés. Notez que les messages envoyés ne sont stockés dans la boîte mail que si le client IMAP est configuré adéquatement, car SMTP ne s’en occupe pas.
• MX: quand on possède un nom de domaine, on possède une zone DNS. Dans cette zone DNS on met un ou plusieurs enregistrements MX qui désignent les serveurs mail qui doivent réceptionner les mails pour tous les utilisateurs de ce domaine.
• SPF: Enregistrement DNS de type TXT qui indique quels serveurs SMTP sont autorisés à expédier les mails de votre domaine. Si cet enregistrement n’est pas présent, c’est médiocre pour votre réputation et votre “déliverabilité”. Si cet enregistrement est présent, une clause de ce dernier indique quelle politique vous avez décidé d’appliquer lorsque le serveur n’a pas été explicitement autorisé: vous donnez instruction de ne rien faire ou rejeter le mail lors de la réception.
• DKIM: tout comme SPF il s’agit de rendre vos mails sortants authentiques. La technique est totalement différente. Au lieu de lister des adresses IP de serveurs autorisés, ici on va se focaliser sur le contenu du mail lui-même et apposer une signature électronique qui est un sceau d’authenticité. Peu importe le chemin que ce mail a pris, du moment que le contenu n’a pas été altéré. La signature est apposée par le serveur d’envoi faisant partie de votre relation contractuelle.