Comment éditer des fichiers HTML?
1. Ouvrez le Bloc-notes sur Windows ou TextEdit sur Mac.
2. Cliquez sur Fichier.
3. Cliquez sur Ouvrir.
4. Sélectionnez "Tous les fichiers" dans la liste déroulante à côté de la zone de nom de fichier sous Windows.
5. Cliquez sur et sur le fichier HTML pour le sélectionner et cliquez sur Ouvrir.
6. Utilisez l'éditeur de texte pour modifier les balises HTML.
7. Cliquez sur Fichier.
8. Cliquez sur Enregistrer.
Utilisez l'éditeur HTML pour modifier le code HTML. La façon dont vous modifiez le code HTML dans Dreamweaver n'est pas très différente de la modification du code HTML dans le Bloc-notes ou TextEdit.
Si vous préférez coder des sites Web à la main, vous pouvez modifier les fichiers HTML dans un éditeur de texte de base comme le Bloc-notes (Windows) ou TextEdit (macOS). Si vous préférez pouvoir déplacer des éléments à l'écran et voir des aperçus en direct, vous pouvez utiliser un éditeur WYSIWYG (What You See Is What You Get) comme Dreamweaver ou Kompozer. Ce guide vous apprend à ouvrir et à modifier un fichier HTML dans une application d'édition standard ou visuelle.
Méthode 1 sur 4: utiliser un bloc-notes sur Windows
- 1Cliquez sur le bouton Démarrer de Windows. C'est le bouton qui a un logo Windows dans la barre des tâches. Par défaut, il se trouve dans le coin inférieur gauche. Cela affiche le menu Démarrer
- 2Tapez notepad. Cela affiche le Bloc-notes dans le menu Démarrer.
- 3Cliquez sur Bloc-notes. Il a une icône qui ressemble à un bloc-notes avec une couverture bleue.
- 4Cliquez sur Fichier. Il se trouve en haut de la barre de menu du Bloc-notes. Cela affiche un menu déroulant. Cela affiche un navigateur de fichiers que vous pouvez utiliser pour ouvrir des fichiers dans le Bloc-notes.
- 5Cliquez sur Ouvrir. C'est la deuxième option dans le menu déroulant Fichier.
- 6Sélectionnez "tous les fichiers" dans le menu déroulant du type de fichier. Cliquez sur le menu déroulant qui dit "Documents texte (.txt)" et sélectionnez "Tous les fichiers" dans le menu déroulant. Cela affiche tous les types de documents (y compris les fichiers HTML) dans le navigateur de fichiers.
- 7Sélectionnez un fichier HTML et cliquez sur Ouvrir. Cela ouvre le document HTML dans le Bloc-notes. Vous pouvez modifier le code HTML dans le Bloc-notes.
- Vous pouvez également créer un nouveau document HTML dans le Bloc-notes.
- 8Modifiez le code HTML. Afin de modifier le HTML dans le Bloc-notes, vous devrez apprendre le HTML afin de pouvoir le modifier à la main. Les éléments courants que vous pouvez modifier sont les suivants.
- <!DOCTYPE html>: Cela va en haut du document HTML. Cela indique au navigateur Web qu'il s'agit d'un document HTML.
- <html></html>: Ces balises vont en haut et en bas du document HTML. Cela indique où le code HTML commence et s'arrête.
- <head></head>: ces balises se placent en haut du document HTML. Ils indiquent où commence et s'arrête l'en-tête du document HTML. L'en-tête du document HTML contient des informations qui ne sont pas visibles sur la page Web. Cela inclut le titre de la page, les métadonnées et le CSS
- <title>Page Title</title>: Ces balises indiquent le titre de la page. Le titre va dans l'en-tête du document HTML. Tapez le titre de la page entre ces deux balises.
- <body></body>: ces balises indiquent où commence et s'arrête le corps du document HTML. Le corps est l'endroit où tout le contenu de la page Web est écrit. Le corps vient après la tête dans le document HTML.
- <h1>Headline Text</h1>: Ces balises créent des balises de titre. Le texte entre les balises "<h1>" et "</h1>" apparaît en gros texte en gras. Le texte va dans le corps du document HTML.
- <p>Paragraph Text</p>: Ces balises sont utilisées pour créer du texte de paragraphe dans un document HTML. Le texte entre "<p>" et "</p>" apparaît comme du texte de taille normale. Le texte va dans le corps du document HTML.
- <b>Bold Text</b>: Ces balises sont utilisées pour créer du texte en gras. Le texte entre "<b>" et "</b>" apparaît en gras.
- <i>Italic Text</i>: Ces balises sont utilisées pour créer du texte en italique. Le texte entre "<i>" et "</i>" apparaît en italique.
- <a href="">Link text</a>: Cette balise est utilisée pour créer un lien vers un autre site Web. Copiez l'adresse Web vers laquelle vous souhaitez créer un lien et collez-la là où il est écrit "URL" (entre les guillemets). Le texte du lien où il est écrit "Texte du lien" (aucun guillemet n'est nécessaire).
- <img src=" URL">: Cette balise est utilisée pour publier une image en HTML. Remplacez le texte qui dit "URL de l'image" par l'adresse Web de l'image.
- 9Cliquez sur Fichier. C'est dans la barre de menu en haut de l'écran.
- 10Cliquez sur Enregistrer sous. Cela ouvre une boîte de dialogue que vous pouvez utiliser pour enregistrer votre fichier.
- Pour enregistrer le fichier sous son nom et son type de fichier existants, cliquez simplement sur Enregistrer dans le menu déroulant sous "Fichier".
- 11Sélectionnez "tous les fichiers". Utilisez le menu déroulant à côté de Enregistrer en tant que type" pour sélectionner "Tous les fichiers".
- 12Tapez un nom pour le fichier. Utilisez la case à côté de "Nom de fichier" pour taper un nom pour le fichier.
- 13Tapez .html à la fin du fichier. Après avoir tapé un nom pour le fichier dans la case "Nom de fichier", ajoutez l'extension ".html" à la fin du nom de fichier. Sans cette extension, il enregistrera le fichier en tant que fichier.txt, au lieu d'un fichier HTML.
- 14Cliquez sur Enregistrer. Cela enregistre le fichier.
Ce guide vous apprend à ouvrir et à modifier un fichier HTML dans une application d'édition standard ou visuelle.
Méthode 2 sur 4: utiliser textedit sur mac
- 1Cliquez sur l'icône de la loupe. C'est dans le coin supérieur droit du bureau Mac. Cela affiche une barre de recherche.
- 2Tapez textedit dans la barre de recherche. Cela affiche une liste d'applications qui correspondent à votre résultat de recherche.
- 3Cliquez sur Textedit.app. Il est en haut des résultats de recherche. C'est à côté d'une icône qui ressemble à une feuille de papier et à un stylo.
- 4Cliquez sur Fichier. C'est dans la barre de menu en haut de l'écran lorsque TextEdit est ouvert.
- 5Cliquez sur Ouvrir. Cela ouvre un navigateur de fichiers que vous pouvez utiliser pour naviguer sur votre Mac et ouvrir des fichiers.
- 6Cliquez sur un fichier HTML et cliquez sur Ouvrir. Les fichiers HTML ont une extension qui dit ".html" après le nom du fichier. Utilisez le navigateur de fichiers pour accéder à un fichier HTML et cliquez dessus pour le sélectionner. Cliquez ensuite sur Ouvrir pour ouvrir le fichier HTML dans TextEdit.
- 7Modifiez le code HTML. Vous pouvez utiliser TextEdit pour modifier le code HTML sur make. Vous devez apprendre le HTML pour pouvoir le modifier à la main. Les éléments courants que vous pouvez modifier sont les suivants.
- <!DOCTYPE html>: Cela va en haut du document HTML. Cela indique au navigateur Web qu'il s'agit d'un document HTML.
- <html></html>: Ces balises vont en haut et en bas du document HTML. Cela indique où le code HTML commence et s'arrête.
- <head></head>: ces balises se placent en haut du document HTML. Ils indiquent où commence et s'arrête l'en-tête du document HTML. L'en-tête du document HTML contient des informations qui ne sont pas visibles sur la page Web. Cela inclut le titre de la page, les métadonnées et le CSS
- <title>Page Title</title>: Ces balises indiquent le titre de la page. Le titre va dans l'en-tête du document HTML. Tapez le titre de la page entre ces deux balises.
- <body></body>: ces balises indiquent où commence et s'arrête le corps du document HTML. Le corps est l'endroit où tout le contenu de la page Web est écrit. Le corps vient après la tête dans le document HTML.
- <h1>Headline Text</h1>: ces balises créent des balises de titre. Le texte entre les balises "<h1>" et "</h1>" apparaît en gros texte en gras. Le texte va dans le corps du document HTML.
- <p>Paragraph Text</p>: Ces balises sont utilisées pour créer du texte de paragraphe dans un document HTML. Le texte compris entre "<p>" et "</p>" apparaît en tant que texte de taille normale. Le texte va dans le corps du document HTML.
- <b>Bold Text</b>: Ces balises sont utilisées pour créer du texte en gras. Le texte entre "<b>" et "</b>" apparaît en gras.
- <i>Italic Text</i>: Ces balises sont utilisées pour créer du texte en italique. Le texte entre "<i>" et "</i>" apparaît en italique.
- <a href="">Link text</a>: Cette balise est utilisée pour créer un lien vers un autre site Web. Copiez l'adresse Web vers laquelle vous souhaitez créer un lien et collez-la là où il est écrit "URL" (entre les guillemets). Le texte du lien où il est écrit "Texte du lien" (aucun guillemet n'est nécessaire).
- <img src=" URL">: Cette balise est utilisée pour publier une image en HTML. Remplacez le texte qui dit "URL de l'image" par l'adresse Web de l'image.
- 8Cliquez sur Fichier. C'est dans la barre de menu en haut de l'écran.
- 9Cliquez sur Enregistrer. C'est dans le menu déroulant sous "Fichier". Cela enregistre le fichier HTML.
- Pour changer le nom du fichier, cliquez sur Renommer dans le menu déroulant "Fichier". Tapez un nouveau nom pour le fichier en haut de l'écran. Assurez-vous d'inclure l'extension ".html" en haut de la page.
Afin de modifier le HTML dans le Bloc-notes, vous devrez apprendre le HTML afin de pouvoir le modifier à la main.
Méthode 3 sur 4: utiliser dreamweaver
- 1Ouvrez le tisserand de rêves. Dreamweaver a une icône qui ressemble à un carré vert qui dit "Dw" au milieu. Cliquez sur l'icône dans le menu Démarrer de Windows ou sur le dossier Application sur Mac pour ouvrir Dreamweaver.
- Adobe Dreamweaver nécessite un abonnement. Vous pouvez acheter un abonnement à partir de 16€ par mois.
- 2Cliquez sur Fichier. C'est dans la barre de menu en haut de l'écran.
- 3Cliquez sur Ouvrir. C'est dans le menu déroulant sous "Fichier".
- 4Sélectionnez un document HTML et cliquez sur Ouvrir. Utilisez le navigateur de fichiers pour sélectionner un document HTML sur votre ordinateur et cliquez dessus pour le sélectionner. Cliquez ensuite sur Ouvrir dans le coin inférieur droit.
- 5Cliquez sur Diviser. C'est l'onglet du milieu en haut de la page. Cela affiche un écran divisé qui contient un éditeur HTML en bas et un écran de prévisualisation en haut.
- 6Modifiez le document HTML. Utilisez l'éditeur HTML pour modifier le code HTML. La façon dont vous modifiez le code HTML dans Dreamweaver n'est pas très différente de la modification du code HTML dans le Bloc-notes ou TextEdit. Lorsque vous saisissez une balise HTML, un menu de recherche apparaît avec les balises HTML correspondantes. Vous pouvez cliquer sur la balise HTML pour insérer ses balises d'ouverture et de fermeture. Dreamweaver vérifiera qu'il existe des balises d'ouverture et de fermeture pour tous vos éléments HTML.
- Vous pouvez également cliquer à l'endroit où vous souhaitez insérer un élément HTML dans l'éditeur HTML et cliquer sur Insérer dans la barre de menus en haut de l'écran. Cliquez sur l'élément que vous souhaitez insérer dans le menu déroulant pour ajouter le code HTML automatiquement.
- 7Cliquez sur Fichier. Lorsque vous avez terminé de modifier le document HTML, cliquez sur Fichier dans la barre de menus en haut de l'écran.
- 8Cliquez sur Enregistrer. C'est dans le menu déroulant sous Fichier. Cela enregistre votre document HTML.
Si vous préférez coder des sites Web à la main, vous pouvez modifier les fichiers HTML dans un éditeur de texte de base comme le Bloc-notes (Windows) ou TextEdit (macOS).
Méthode 4 sur 4: utiliser Kompozer
- 1Accédez à https://sourceforge.net/projects/kompozer/ dans un navigateur Web. Vous pouvez utiliser n'importe quel navigateur Web sur PC ou Mac. Ceci est la page de téléchargement de Kompozer. Il s'agit d'un éditeur HTML gratuit (WYSIWYG) qui fonctionne à la fois sur Windows et Mac.
- 2Cliquez sur Télécharger. C'est le bouton vert près du haut de la page. Cela vous amène à une page de téléchargement distincte. Après un délai de 5 secondes, votre téléchargement commencera.
- 3Double-cliquez sur le fichier d'installation. Par défaut, vos fichiers téléchargés se trouvent dans votre dossier "Téléchargements" sur PC ou Mac. Vous pouvez également cliquer dessus dans votre navigateur Web pour lancer le programme d'installation de Kompozer. Utilisez les instructions suivantes pour installer Kompozer:
- Les fenêtres:
- Si vous êtes invité à autoriser le programme d'installation à apporter des modifications à votre système, cliquez sur Oui.
- Cliquez sur Suivant dans les fenêtres d'introduction.
- Cliquez sur le bouton radial à côté de "J'accepte l'accord" et cliquez sur Suivant.
- Cliquez sur Suivant pour utiliser l'emplacement d'installation par défaut ou cliquez sur Parcourir pour sélectionner un autre emplacement d'installation.
- Cliquez sur Suivant, puis cliquez à nouveau sur Suivant
- Cliquez sur Installer
- Cliquez sur Terminer
- Mac:
- Double-cliquez sur le fichier d'installation de Kompozer.
- Cliquez sur Kompozer.app
- Cliquez sur l'icône Apple dans le coin supérieur gauche.
- Cliquez sur Préférences système
- Cliquez sur Sécurité et confidentialité
- Cliquez sur l' onglet Général.
- Cliquez sur Ouvrir quand même près du bas de la fenêtre.
- Cliquez sur Ouvrir dans la fenêtre contextuelle.
- Faites glisser l'icône Kompozer sur votre bureau.
- Ouvrez le Finder.
- Cliquez sur le dossier Applications.
- Faites glisser l'icône Kompozer du bureau vers le dossier Applications.
- Les fenêtres:
- 4Ouvrez Kompozer. Suivez les étapes suivantes pour ouvrir Kompozer sur PC ou Mac
- Les fenêtres:
- Cliquez sur le menu Démarrer de Windows.
- Tapez «Kompozer»
- Double-cliquez sur l'icône Kompozer.
- Mac:
- Cliquez sur l'icône en forme de loupe dans le coin supérieur droit.
- Tapez "Kompozer" dans la barre de recherche.
- Double-cliquez sur Kompozer.app.
- Les fenêtres:
- 5Cliquez sur Fichier. C'est dans la barre de menu en haut de l'application.
- 6Cliquez sur Ouvrir le fichier. C'est la deuxième option dans le menu déroulant sous "Fichier". Cela ouvre un navigateur de fichiers que vous pouvez utiliser pour sélectionner un fichier HTML ouvert.
- 7Cliquez sur un fichier HTML et cliquez sur Ouvrir. Cela ouvre le fichier HTML dans Kompozer.
- 8Cliquez sur Diviser. C'est l'onglet du milieu en haut de la page. Cela affiche un écran divisé qui contient un éditeur HTML en bas et un écran de prévisualisation en haut.
- Vous devrez peut-être agrandir l'application afin d'avoir plus d'espace pour travailler.
- 9Modifiez le document HTML. L'écran du code source HTML se trouve en bas, vous pouvez utiliser cet écran pour éditer le code HTML de la même manière que vous le feriez dans Notepad ou TextEdit. Vous pouvez également utiliser l'écran d'aperçu pour modifier votre code HTML en procédant comme suit:
- Utilisez le menu déroulant dans le coin supérieur droit pour sélectionner le type de texte (c.-à-d. Titre, paragraphe, ect}
- Cliquez et tapez pour ajouter du texte.
- Utilisez les boutons du panneau en haut de l'écran pour ajouter du gras, de l'italique, de l'alignement du texte, des retraits ou des listes à votre texte.
- Cliquez sur le carré de couleur dans le panneau en haut de l'écran pour changer la couleur du texte.
- Cliquez sur l' icône Image en haut de l'écran pour ajouter une image à votre document HTML.
- Cliquez sur l'icône qui ressemble à un maillon de chaîne pour ajouter un lien à votre document HTML.
- 10Cliquez sur l' icône Enregistrer. Une fois que vous avez terminé d'apporter des modifications à votre document, cliquez sur l' icône Enregistrer en haut de l'écran. C'est sous une icône qui ressemble à une disquette. Cela enregistre votre travail.
- N'oubliez pas d'enregistrer votre document lors de l'édition. Quelque chose peut mal tourner à tout moment.
Lisez aussi: Comment réinitialiser un mot de passe Hotmail perdu?
