Envoyez votre site sur le web

Savez-vous ce qu'est un nom de domaine ?
Il s'agit en fait d'une adresse sur le Web : siteduzero.com est par exemple un nom de domaine.

Un nom de domaine est constitué de 2 parties :

• En rouge, le nom de domaine proprement dit. Il s'agit d'un nom que l'on peut généralement choisir librement, du tant que personne ne l'a réservé avant nous. Il peut contenir des lettres et des chiffres, mais pas de symboles particuliers (comme le ç français, le é, le è, les espaces, etc).
• En bleu, l'extension (aussi appelée tld). Il existe grosso modo une extension par pays (.fr pour la France, .be pour la Belgique, .ca pour le Canada). Toutefois, il y a aussi des extensions utilisées au niveau international comme .com, .net, .org. Elles étaient au départ réservées aux sites commerciaux, aux organisations, etc... mais cela fait longtemps que tout le monde peut les réserver. D'ailleurs, .com est très probablement l'extension la plus utilisée sur le Web.

Réserver un nom de domaine

Alors j'ai une bonne et une mauvaise nouvelle
Comme d'hab, on va commencer par la mauvaise :

• La mauvaise : ce n'est pas gratuit...
• La bonne : ... ce n'est vraiment pas cher du tout

En effet, un nom de domaine coûte entre 7 et 12 € pour un an.
Le prix peut varier en fonction de l'extension. Ainsi, l'extension .info est généralement proposée à plus bas prix et peut s'avérer être une alternative intéressante. Mais si vous voulez une adresse plus "courante", il faudra plutôt viser une extension de type ".com", ou encore ".fr".

Pour réserver un nom de domaine, 2 solutions :

• Passer par un registrar spécialisé. C'est un organisme qui sert d'intermédiaire entre l'ICANN (l'organisation qui gère les noms de domaine au niveau international, tel les .com) et vous. 1&1, OVH et Gandi sont de célèbres registrars français.
• Encore mieux : vous pouvez commander le nom de domaine en même temps que l'hébergement (c'est ce que je vous conseille). Comme ça vous faites d'une pierre deux coups, vu que vous aurez de toute façon besoin de l'hébergement et du nom de domaine.

Dans ce chapitre, nous allons voir comment commander un nom de domaine en même temps que l'hébergement, c'est de loin la solution la plus simple et la moins coûteuse pour vous.

Intéressons-nous maintenant à l'hébergeur.



Sur Internet, tous les sites web sont stockés sur des ordinateurs particuliers appelés "Serveurs". Ce sont des ordinateurs généralement très puissants qui restent tout le temps allumés. Ils contiennent les pages des sites web et les délivrent aux internautes qui les demandent, à toute heure du jour et de la nuit.

Voici à quoi ressemble par exemple le serveur qui contient le Site du Zéro :



Un serveur ne possède pas d'écran car, la plupart du temps, il tourne tout seul sans avoir besoin qu'on fasse quoi que ce soit dessus. Comme vous le voyez, les serveurs sont très plats : c'est un format spécial de serveur (appelé "1U"). Cela permet de les empiler dans des baies (une sorte d'armoire climatisée pour serveurs ).

Voici à quoi ressemble une baie :



Comme vous le voyez, il y a un écran pour toute la baie. C'est suffisant car on ne branche l'écran sur un serveur que si celui-ci rencontre un problème. La plupart du temps, heureusement, le serveur travaille sans broncher

Le rôle de l'hébergeur

L'hébergeur est une entreprise qui se charge de gérer des baies de serveurs. Elle s'assure du bon fonctionnement des serveurs 24h/24 7j/7. En effet, si l'un d'eux tombe en panne, tous les sites présents sur la machine deviennent inaccessibles (et ça fait des clients mécontents ).

Ces baies se situent dans des lieux particuliers appelés datacenters. Les datacenters sont donc des "entrepôts à serveurs" en quelque sorte, et leur accès est très protégé.





Bref, gérer un serveur soi-même est complexe, et la plupart du temps les particuliers et les entreprises font appel à un hébergeur dont c'est le métier.

Trouver un hébergeur

Les hébergeurs, contrairement aux registrars, sont très très nombreux. Il y en a de tous types, à tous les prix. Il y a un vocabulaire à connaître pour vous repérer dans leurs offres :

• Hébergement mutualisé : si vous optez pour une offre d'hébergement mutualisée, votre site sera placé sur un serveur gérant plusieurs sites à la fois (peut-être une centaine, peut-être plus). C'est l'offre la moins chère et c'est celle que je vous recommande de viser si vous démarrez votre site web.
• Hébergement dédié virtuel : cette fois, le serveur ne gère que très peu de sites (généralement moins d'une dizaine). Cette offre est généralement adaptés aux sites qui ne peuvent plus tenir sur un hébergement mutualisé car ils ont trop de trafic (trop de visiteurs), mais qui ne peuvent pas se payer un hébergement dédié (voir ci-dessous).
• Hébergement dédié (on parle aussi de "serveur dédié") : c'est le nec plus ultra. Le serveur gère uniquement votre site et aucun autre. Attention, cela coûte assez cher et il vaut mieux avoir des connaissances en Linux pour administrer le serveur à distance.
  Par exemple, le Site du Zéro est lui-même sur un hébergement dédié, car son trafic est très important.

Oh ça c'est très simple
Une recherche dans Google de "hébergeur web" vous donnera plusieurs millions de résultats. Vous n'aurez que l'embarras du choix.

Si je puis me permettre un conseil, je vous recommande de regarder les offres proposées par MavenHosting. Il s'agit de l'hébergeur qui a le plus d'avis positifs sur guide-hebergeur.fr, classé 1er hébergeur sur 1357 offres. Bref, c'est sans aucun doute le meilleur choix pour ne pas avoir de surprise

Si toutefois les offres de MavenHosting vous semblent un peu inaccessibles dans un premier temps, vous pouvez regarder chez l'hébergeur 1&1 (un concurrent ), qui fait souvent des offres à très bas prix.
La suite de ce chapitre vous détaille la procédure pour héberger votre site chez MavenHosting, mais sachez que cela fonctionne quasiment de la même manière avec 1&1.


Revenons à MavenHosting. L'hébergeur propose plusieurs offres d'hébergement mutualisé. Voici ce que vous avez sur leur page d'accueil :



En haut à droite, vous avez la liste de leurs offres. Ils proposent 3 offres différentes :

• Plan de base : 25 Go d'espace disque et trafic illimité.
• Plan de luxe : 50 Go d'espace disque et trafic illimité.
• Plan suprême : 100 Go d'espace disque et trafic illimité.

Ces offres sont en fait très similaires, elles diffèrent seulement au niveau de l'espace de stockage.


Le trafic, c'est la quantité de données envoyées par mois aux visiteurs de votre site. Par exemple, si vous avez une image de 1 Mo sur votre site et qu'elle est chargée 500 fois dans le mois par vos visiteurs, alors vous créerez un trafic de 500 Mo.
En pratique, il faut savoir que les navigateurs des visiteurs mettent en cache les images, ce qui leur évite d'avoir à recharger plusieurs fois une même image. Cela diminue d'autant plus le trafic nécessaire.

Commander un hébergement pour votre site web

Si vous cliquez sur l'une des 3 offres en haut à droite, vous arrivez à nouveau sur une page qui récapitule les offres :




Cette page rappelle donc le détail de chaque offre. A part le trafic autorisé (et le prix ) ces offres sont donc très semblables.

Supposons que nous choisissions l'offre de base. La fenêtre suivante va nous demander quel nom de domaine nous voulons pour notre site :



La plupart du temps, vous demanderez à créer un nouveau domaine (premier choix). Dans mon exemple, je veux que mon site soit accessible depuis l'adresse www.supersitezero.com.
Le site de MavenHosting va alors se charger de vérifier si le domaine est toujours disponible :



Si comme moi c'est bon, vous pouvez passer à la suite
Sinon, il faudra choisir un autre nom de domaine car quand le domaine est déjà pris vous ne pouvez pas faire grand chose

Dans la page suivante, il vous faudra remplir vos coordonnées :



Puis accepter les conditions générales en cochant la case :



Pour le paiement, vous êtes redirigé sur Paypal (que vous connaissez déjà si vous avez utilisé eBay). C'est un moyen simple et sûr de payer sur Internet, ce qui explique sans aucun doute pourquoi il a autant de succès.

Si vous n'avez pas de compte paypal parce que vous n'avez jamais utilisé ce service, cliquez en bas sur "Vous n'avez pas de compte PayPal ? Cliquez ici. pour en créer un et payer".
Dans la page qui s'affiche, sélectionnez ensuite "Vous n'avez pas de compte PayPal", surligné en vert dans la capture d'écran ci-dessous :



Une fois les formalités et le paiement effectués, vous êtes redirigé vers MavenHosting :




Vous devriez recevoir un peu plus tard un e-mail vous indiquant toutes les informations nécessaires pour mettre en place votre site. Conservez-les précieusement, vous en aurez besoin.

Lorsque vous aurez reçu par email vos identifiants pour vous connecter au serveur de votre hébergeur, vous pouvez passer à l'étape suivante : envoyer votre site web sur le serveur de votre hébergeur !

Installer un client FTP

FTP signifie File Transfer Protocol et, pour faire court et simple, c'est le moyen que l'on utilise pour envoyer nos fichiers.
Il existe des logiciels permettant d'utiliser le FTP pour transférer vos fichiers sur Internet.

Bien entendu, des logiciels FTP il en existe des centaines, gratuits, payants, français, anglais etc...
Pour que nous soyons sur la même longueur d'ondes, je vais vous proposer celui que j'utilise qui est gratuit et en français : FileZilla.

Quoiqu'il en soit, je vais vous montrer quelle est la marche à suivre avec FileZilla.
Première étape : ... le télécharger bien entendu


Je vous fais confiance pour l'installation, elle est tout simple et vous ne devriez pas avoir de problème
Lancez le logiciel, et vous devriez voir ceci :


A première vue, ça a l'air un peu compliqué (à première vue seulement). En fait, le principe est très simple.
Il y a 4 grandes zones dans la fenêtre à connaître :

1. En haut, vous verrez apparaître les messages qu'envoie et reçoit le logiciel. Si vous avez un peu de chance, vous verrez même la machine vous dire Bonjour" (si si je vous jure ;)) En général, cette zone ne nous intéresse pas vraiment, sauf s'il y a des messages d'erreur... et comme ils sont écrits en rouge, vous devriez pas les louper
2. A gauche, c'est votre disque dur. Dans la partie du haut vous avez les dossiers, et dans la partie du bas la liste des fichiers du dossier actuel.
3. A droite, c'est la liste des fichiers envoyés sur Internet. Pour le moment il n'y a rien, car on ne s'est pas "connecté", mais ça va venir ne vous en faites pas.
4. Enfin, en bas, vous verrez apparaître les fichiers en cours d'envoi (et le pourcentage d'envoi).

La première étape va être de se "connecter" au serveur de votre hébergeur.

Configurer le client FTP

Quel que soit l'hébergeur que vous avez choisi, cela fonctionne toujours de la même manière. On va vous fournir 3 informations qui sont indispensables pour que FileZilla puisse se connecter au serveur :

• L'IP : c'est "l'adresse" du serveur. Le plus souvent, on vous donnera quelque chose du genre ftp.mon-site.com, mais il peut aussi s'agir d'une suite de nombres comme 122.65.203.27
• Le login : c'est votre identifiant, on vous l'a probablement demandé. Vous avez peut-être mis votre pseudo, ou le nom de votre site. Mon login pourrait par exemple être mateo21.
• Le mot de passe : soit on vous a demandé un mot de passe, soit (c'est plus probable) on vous en a attribué un d'office (un truc imprononçable du genre crf45u7h)

Si vous avez ces 3 informations, vous êtes le roi du monde (du moins, vous allez pouvoir continuer ce tutoriel ^^)
Si vous ne les avez pas, il faut que vous les cherchiez c'est indispensable. On vous les a probablement envoyés par mail. Sinon, n'hésitez pas à les demander à votre hébergeur (IP / Login / Mot de passe).

Maintenant que nous sommes en possession de ces informations, nous allons les donner à FileZilla qui en a besoin pour se connecter au serveur.

Cliquez sur la petite icône en haut à gauche (pas sur la petite flèche à droite, mais sur l'image) :

Une fenêtre s'ouvre. Cliquez sur "Nouveau site" et donnez-lui le nom que vous voulez (par exemple Site du Zér0). A droite, vous allez devoir indiquer les 3 informations dont je viens de vous parler, comme ceci :


Vous pouvez distinguer en haut l'hôte (c'est là qu'il faut indiquer l'adresse ip, du genre ftp.attitude-nature.com).
Pour pouvoir entrer le login / mot de passe, cochez Type d'authentification : Normal
Ici le login est attitudeU et le mot de passe est... caché (vous croyiez quand même pas que j'allais vous le donner ?! :p)

Cliquez sur "Connexion" et le tour est (presque) joué.

Transférer les fichiers

A ce stade, 2 possibilités :

• Soit la connexion a réussi, et vous voyez apparaître en haut des messages en vert comme "Connecté". Dans ce cas, la zone de droite de la fenêtre de FileZilla devrait s'activer et vous verrez les fichiers qui se trouvent déjà sur le serveur (il se peut qu'il y en ait quelques-uns déjà présents).
• Soit ça a planté, vous avez plein de messages écrits en rouge et là bah... Il n'y a pas 36 solutions : vous vous êtes plantés en tapant l'IP ou le login ou le mot de passe. Un de ces éléments est incorrect, veillez à les redemander à votre hébergeur car s'ils sont bons ça doit marcher.

Si la connexion a réussi, alors ce que vous avez à faire est très simple : dans la partie de gauche, cherchez où se trouvent sur votre disque dur vos fichier .html et .css (mais aussi vos images .jpg, .png, .gif etc...).
Double-cliquez sur le fichier que vous voulez transférer à gauche. Au bout de quelques secondes, il apparaîtra à droite, ce qui voudra dire qu'il a été correctement envoyé sur le serveur, donc qu'il est accessible sur Internet !!!
Voici par exemple ce que ça donne quand on a transféré un fichier "index.html" :


Il apparaît à droite, ce qui veut dire qu'il est maintenant disponible sur le serveur
Vous pouvez aussi transférer des dossiers entiers d'un seul coup : il suffit de faire glisser-déplacer le dossier depuis la partie de gauche jusqu'à la partie de droite de la fenêtre.

Allez, avouez qu'une fois configuré, c'est pas bien compliqué