Comment stocker un site web sur votre ordinateur
Publié le :
Il est essentiel d'organiser les fichiers de votre site web de manière structurée. Il faut créer des dossiers pour les différents types de fichiers (HTML, CSS, Javascript, images, etc.) et définir un emplacement unique sur le disque dur de votre ordinateur pour vos sites web.
Emplacement des sites web sur votre disque dur
Emplacement dans Windows
L'emplacement le plus simple et le plus logique pour conserver les fichiers de votre site web, est un dossier dédié situé dans le dossier Documents de votre compte d'utilisateur.
Attention à ne pas confondre avec le dossier Utilisateurs de Windows 10, ou 11, qui se trouve par défaut à l'emplacement C:\Utilisateurs (ou C:\Users). Il contient tous les comptes d'utilisateurs.
Le dossier Utilsateur de Windows 11 dans C:\Users.
Structure des dossiers dans Windows
Votre compte d'utilisateur est intitulé avec le nom que vous avez donné lors de la première configuration de Windows. C'est donc aussi le nom d'un répertoire utilisateur. Dans ce répertoire, Windows vous met à disposition cinq répertoires pour stocker vos données personnelles :
- Documents,
- Images,
- Vidéos,
- Musique,
- Téléchargements.
Dans Documents, créez un dossier « www » (en minuscule !) ; vous y enregistrerez, vos fichiers web dans un dossier créé spécialement pour un domaine. Voici un exemple avec plusieurs domaines, dont lazone51.fr :
Emplacement C:\Users\Olivier\Documents\www\lazone51.fr
C:\ (racine)
├── Users (Utilisateurs)
│
├── Olivier (nom de mon compte utilisateur)
│ ├── Vidéos
│ ├── Téléchargements
│ ├── Musique
│ ├── Images
│ └── Documents
│ └── www
│ ├── positron-libre.net
│ ├── f4lfw.fr
│ └── lazone51.fr
├── Public
Emplacement sur un Mac
Sur les Mac récents, avec les dernières versions de macOS, l'approche reste flexible, mais voici une recommandation optimisée :
Dossier personnel
L'emplacement /Utilisateurs/ est à privilégier. MacOS vous autorise à créer un dossier dédié, directement dans le dossier Utilisateurs, Vous pouvez donc avoir la structure suivante : /Utilisateurs/www/, pour stocker vos sites web.
Alternative : le dossier Documents
Comme sur Windows, vous avez un dossier Documents dans Utilisateurs. Vous pouvez y créer un dossier « www ». Mais la séparation des fichiers web, des autres données utilisateur, est à privilégier.
Puisque c'est possible, ne nous privons pas !
Emplacement des sites web sous Linux
Dossier home
Il est vrai que le dossier « home » (/home/utilisateur/) est un emplacement fréquemment utilisé sous Linux, mais il n'est pas le seul, surtout dans le contexte d'un serveur web.
Voici une explication plus détaillée.
Pour le développement local et personnel, il est très courant de stocker les fichiers de son site web dans son dossier « home ». Cela permet une organisation personnelle et un accès facile aux fichiers. Vous pouvez créer un dossier spécifique dans votre « home », comme sitesweb, projetsweb ou simplement www.
Pour les serveurs web
L'emplacement par défaut pour les fichiers de sites web servis par Apache et Nginx est : /var/www/html/.
Cet emplacement est choisi pour des raisons de sécurité et de permissions, car il est généralement accessible par le serveur web tout en étant protégé contre les accès non autorisés.
Si vous avez l'intention d'apprendre également la programmation php pour développer un site web dynamique, il est peut-être opportun de choisir tout de suite l'emplacement /var/www/html/ pour stocker vos fichiers web.
Stockage sur SSD externe
Les ordinateurs récents sont généralement équipés de SSD, ce qui offre des vitesses de lecture écriture rapides. Ils disposent aussi de port USB rapides ; vous pouvez donc choisir de stocker tous vos fichiers web sur un disque externe ou une clé USB.
Attention toutefois à faire des sauvegardes régulières sur un autre support.
Organiser les fichiers de son site web
Dans les pages suivantes, nous allons utiliser différents types de fichier. Chacun a un emplacement dédié.
Nous allons donc créer la structure adéquate, pour stocker ces fichiers.
- Créez votre dossier de domaine. Même si vous n'avez pas encore réserver votre domaine, mettez un nom provisoire comme domaine1.fr par exemple.
- Copiez, dans ce dossier domaine1.fr, votre fichier bonjour.html et renommez le index.html.
- Restez dans votre dossier de domaine et créez les dossiers suivants :
- images,
- css,
- js.
Concernant les fichiers d'images et la génération des favicons, nous apprendrons plus tard comment les mettre en place.
├── Documents/
└── www/
└── domaine1.fr/
├── css/
├── images/
├── js/
├── favicon.ico
├── favicon.png
├── favicon.svg
├── index.html
├── logo.png
├── robots.txt
└── sitemap.xml
Ci-dessus, structure des dossiers pour organiser un site web.
Personnellement, j'ai toujours préféré mettre le logo du site (logo.png) à la racine ; mais rien ne vous empêche de le mettre dans le dossier images.
Vous pouvez effacer tous les fichiers d'essai, bonjour.txt et bonjour.html, qui étaient à la racine du dossier Documents. Nous allons maintenant travailler uniquement dans la structure que vous venez de créer.
Résumé
Pour développer votre site web, vous allez maintenant utiliser une structure de stockage de fichiers en créant :
- un répertoire www dans votre dossier Documents,
- un répertoire domaine1.fr dans le dossier www,
- un répertoire images, css, js dans le dossier domaine1.fr.
- Puis vous copier votre fichier bonjour.html dans le répertoire domaine1.fr en le renommant index.html.
Cette procédure est valide pour un PC sous Windows ; à vous d'adapter selon votre système d'exploitation (Mac, Linux…).
Pour la suite, nous allons apprendre à utiliser les balises qui contiennent du texte.