Publier votre site web

Quelles sont les options ?

Publier un site web est un sujet complexe, car il existe de nombreuses façons de procéder. Cet article n'a pas pour but de documenter toutes les méthodes possibles. Il explique plutôt les avantages et les inconvénients de trois approches pratiques pour les débutant·e·s. Ensuite, il détaille une méthode qui peut fonctionner immédiatement pour de nombreux·ses lecteur·ice·s.

Trouver un hébergement et un nom de domaine

Pour avoir plus de contrôle sur le contenu et l'apparence du site, la plupart des professionnel·le·s ou entreprises choisissent d'acheter un hébergement web et un nom de domaine :

• L'hébergement web est un espace de fichiers loué sur le serveur web d'une société d'hébergement. Vous placez les fichiers de votre site web sur le serveur web. Le serveur web fournit le contenu du site aux visiteur·euse·s.
• Un nom de domaine est l'adresse unique où les gens trouvent votre site web, comme https://www.mozilla.org ou https://www.bbc.co.uk. Vous pouvez louer votre nom de domaine pour autant d'années que vous le souhaitez auprès d'un bureau d'enregistrement.

Si vous obtenez l'hébergement et le nom de domaine auprès de la même société, ils sont généralement configurés automatiquement pour fonctionner ensemble. Cependant, si vous les obtenez auprès de sociétés différentes, ou si vous souhaitez changer d'hébergeur, il faudra effectuer quelques réglages pour que le nom de domaine pointe vers le bon serveur. Cela permet aux gens de voir votre site lorsqu'ils saisissent cette adresse web. Cela se fait généralement en se connectant sur le site du bureau d'enregistrement et en configurant les serveurs de noms ^(angl.) fournis par votre hébergeur.

Les sociétés proposent différents moyens pour transférer les fichiers sur leurs serveurs web. Beaucoup offrent plusieurs options :

• Une interface de glisser-déposer (vous en verrez un exemple dans la section Publier sur GitHub plus loin).
• Un programme Protocole de transfert de fichiers (FTP). Les programmes FTP varient beaucoup, mais en général, il faut se connecter au serveur web avec les identifiants fournis par l'hébergeur (nom d'utilisateur, mot de passe, nom d'hôte). Le programme affiche alors vos fichiers locaux et ceux du serveur dans deux fenêtres, et permet de transférer les fichiers dans les deux sens.
• Garder le code source du site dans un dépôt GitHub (voir plus bas) et donner accès à l'hébergeur pour qu'il puisse récupérer le code source, le construire si besoin, et le publier.
• Certaines sociétés fournissent des outils en ligne de commande pour transférer vos fichiers.

Suggestions pour trouver hébergement et domaines

• MDN ne fait pas la promotion de sociétés commerciales d'hébergement ou de bureaux d'enregistrement particuliers. Pour en trouver, faites une recherche pour « hébergement web » et « noms de domaine ». Tous les bureaux d'enregistrement proposent une fonctionnalité pour vérifier si le nom de domaine souhaité est disponible.
• Votre Fournisseur d'Accès Internet (FAI) domestique ou professionnel propose peut-être un hébergement limité pour un petit site web. Les fonctionnalités seront limitées, mais cela peut être parfait pour vos premières expériences.
• Il existe aussi des services gratuits comme Neocities, Google Sites et WordPress. Ces services sont limités, mais suffisants pour des expérimentations initiales.

Utiliser un outil en ligne comme GitHub ou Google App Engine

Certains outils permettent de publier votre site web en ligne :

• GitHub ^(angl.) est un site de « codage collaboratif ». Il permet de téléverser des dépôts de code pour stockage dans le système de gestion de versions Git ^(angl.). Vous pouvez alors collaborer à des projets de code ; le système est open source par défaut, ce qui signifie que n'importe qui dans le monde peut trouver votre code GitHub, l'utiliser, en tirer des leçons et l'améliorer. GitHub propose une fonctionnalité très utile appelée Pages GitHub ^(angl.), qui permet de présenter du code de site web en direct sur le web.
• Google App Engine est une plateforme puissante qui permet de créer et d'exécuter des applications sur l'infrastructure de Google — que vous ayez besoin de créer une application web multi-couches à partir de zéro ou d'héberger un site web statique. Voir Comment héberger votre site Web sur Google App Engine ? pour plus d'informations.

Ces options sont généralement gratuites, mais avec un nombre de fonctionnalités limité.

Utiliser un IDE web tel que CodePen

Il existe plusieurs applications web qui simulent un environnement de développement de site web, vous permettant d'écrire du HTML, du CSS et du JavaScript, qui sont ensuite affichés dans un panneau de rendu. De manière générale, ces outils sont faciles à utiliser, très utiles pour apprendre, pratiques pour partager du code (par exemple, si vous souhaitez montrer une technique ou demander de l'aide à des collègues dans un autre bureau), et gratuits (pour les fonctionnalités de base). Ils hébergent votre page rendue à une adresse web unique. Cependant, les fonctionnalités de base sont limitées, et ces applications ne fournissent généralement pas d'espace d'hébergement pour des ressources (comme des images).

Testez certains de ces exemples pour voir lequel vous convient le mieux :

• Scrimba ^{Partenaire d'apprentissage MDN}
• JSFiddle
• JSBin
• CodePen

Publier sur GitHub

Voyons maintenant comment publier votre site sur les Pages GitHub.

1. Tout d'abord, inscrivez-vous sur GitHub ^(angl.) et vérifiez votre adresse e-mail.

2. Ensuite, vous devez créer un dépôt ^(angl.) pour stocker vos fichiers. Sur cette page :

   1. Dans la case Repository name, saisissez username.github.io, où username est votre nom d'utilisateur. Par exemple, notre ami Bob Smith saisirait bobsmith.github.io.
   2. Cliquez sur le bouton Create repository (Créer un dépôt) en bas de la page.

3. Sur la page suivante, trouvez le lien uploading an existing file (téléverser un fichier existant) et cliquez dessus. Cela vous amènera à la page de téléversement de fichiers.

4. À ce stade, vous pouvez glisser-déposer les fichiers de votre système de fichiers local sur la page web pour les téléverser dans le dépôt GitHub. Pour ce faire :

   1. Ouvrez une fenêtre de l'explorateur de fichiers (ou Finder) sur votre ordinateur.
   2. Assurez-vous de voir à la fois l'explorateur de fichiers et la fenêtre du navigateur web — placez-les côte à côte sur votre écran.
   3. Naviguez dans l'explorateur jusqu'au dossier contenant votre site d'exemple.

      Note : Assurez-vous que votre dossier contient un fichier index.html.

   4. Sélectionnez tous les fichiers de votre site d'exemple (par exemple avec le raccourci clavier Ctrl + A, ou Cmd + A sur macOS).
   5. Faites glisser les fichiers depuis l'explorateur vers la section « Drag files here to add them to your repository » (Glissez-déposez des fichiers ici pour les ajouter à votre dépôt) de la page GitHub.
   6. La bordure et le texte de la section changent pour indiquer qu'un dépôt est possible. Déposez les fichiers à ce moment-là.
   7. Cliquez sur le bouton Commit changes (Valider les modifications) en bas de la page.

5. Rendez-vous à l'adresse username.github.io pour voir votre site en ligne. Par exemple, pour le nom d'utilisateur chrisdavidmills, allez sur chrisdavidmills.github.io.

   Note : Il peut s'écouler quelques minutes avant que votre site soit en ligne. S'il n'apparaît pas immédiatement, attendez quelques minutes puis réessayez.

Pour en savoir plus, consultez Bien démarrer avec GitHub Pages.

Lectures pour approfondir

• Qu'est-ce qu'un serveur web
• Comprendre les noms de domaine
• Combien ça coûte de faire quelque chose sur le Web ?
• Deploy a Website : un bon tutoriel de Codecademy qui va un peu plus loin et qui montre quelques techniques supplémentaires.

• Précédent
• Aperçu : Votre premier site web
• Suivant