Étape 1 : Enregistrez votre fichier
Copiez le code HTML que vous avez partagé.
Ouvrez votre éditeur de texte (comme VS Code).
Collez le code dans un nouveau fichier.
Enregistrez le fichier avec le nom exact : codezone.html.
⚠️ Important : Assurez-vous que votre éditeur n'ajoute pas une extension .txt supplémentaire. Le nom dans l'explorateur de fichiers doit être codezone.html, et non codezone.html.txt.
🌐 Étape 2 : Visualisez votre page dans un navigateur
Une fois le fichier enregistré :
Double-cliquez sur le fichier codezone.html dans le dossier de votre ordinateur. Il s'ouvrira automatiquement dans votre navigateur par défaut.
Sinon, ouvrez votre navigateur (Chrome, Firefox, etc.) et utilisez le menu Fichier > Ouvrir un fichier... pour sélectionner codezone.html.
Vous verrez une page blanche car la section est vide. Le titre "My Page" s'affichera dans l'onglet du navigateur.
✏️ Étape 3 : Ajoutez du contenu à votre page
La magie opère entre les balises . Ajoutons quelques éléments :
html
Ma Page - CodeZone
Bienvenue sur CodeZone
Ceci est ma première page web. Je l'ai construite moi-même !
Ce que j'apprends
La structure HTML
Créer des fichiers .html
Ajouter des titres et des paragraphes
Ensuite, j'apprendrai le CSS pour styliser cette page.
Enregistrez à nouveau le fichier (Ctrl+S ou Cmd+S) et rafraîchissez l'onglet de votre navigateur. Vous verrez maintenant le contenu apparaître !
🎨 Étape 4 : Liez votre CSS (Prochaine étape facultative)
Votre fichier HTML tente déjà de charger une feuille de style depuis href="/style.css". Ce chemin signifie qu'il cherche un fichier nommé style.css dans le même dossier que votre fichier HTML.
Créez un nouveau fichier dans le même dossier et nommez-le style.css.
Ajoutez-y quelques règles CSS basiques, par exemple :
css
body {
font-family: Arial, sans-serif;
max-width: 800px;
margin: 40px auto;
padding: 20px;
background-color: #f0f0f0;
}
h1 {
color: darkblue;
}