Article original : Web Page Text Editor – How to Open HTML Code in Mac TextEdit

Dans cet article, je vais montrer comment créer, ouvrir et modifier des fichiers HTML dans TextEdit.

Qu'est-ce que TextEdit ?

TextEdit est un traitement de texte gratuit qui est préinstallé sur votre ordinateur Mac. Il existe depuis plus de 25 ans et c'est un moyen facile d'ouvrir et de lire des fichiers word, des fichiers texte et même des fichiers HTML.

Comment créer un fichier HTML dans TextEdit

  1. Allez dans Finder > Applications > TextEdit. Double-cliquez sur TextEdit pour l'ouvrir.

Image

  1. Cliquez sur Format et ensuite sur Faire du texte brut.

Image

  1. Ajoutez un modèle HTML de base à votre fichier. 
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Démonstration TextEdit</title>
  </head>
  <body>
    <h1>Ceci est une démonstration</h1>
  </body>
</html>

  1. Allez dans Fichier > Enregistrer...

  2. Nommez votre fichier avec l'extension .html. Cela indiquera à l'ordinateur qu'il s'agit d'un fichier HTML. Cliquez sur Enregistrer.

Image

  1. Cliquez sur Utiliser .html

Image

Allez dans le fichier nouvellement créé sur votre ordinateur et double-cliquez pour l'ouvrir dans le navigateur. Vous devriez voir ce résultat :

Image

Comment ouvrir des documents HTML dans TextEdit

Il existe deux façons d'ouvrir un fichier HTML dans TextEdit.

Option 1

Allez dans le fichier HTML que vous souhaitez ouvrir, faites un clic droit sur le fichier et choisissez TextEdit pour l'ouvrir.

Image

Option 2

Ouvrez TextEdit et cliquez sur Fichier > Ouvrir... Vous pouvez également survoler l'option Ouvrir récent avec votre souris si vous avez ouvert ce fichier récemment.

Image

Mode d'édition de code de TextEdit

Il existe une option dans TextEdit pour toujours afficher vos fichiers HTML en tant que code HTML.

  1. Cliquez sur TextEdit > Préférences...

Image

  1. Cliquez sur Ouvrir et Enregistrer :

Image

  1. Cochez la case qui dit Afficher les fichiers HTML en tant que code HTML au lieu de texte formaté :

Image

Maintenant, vous pouvez apporter des modifications à votre fichier HTML et voir les résultats dans le navigateur.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Démonstration TextEdit</title>
  </head>
  <body>
    <h1>Ceci est une démonstration</h1>
    <p>Ajout de plus de contenu à mon fichier de démonstration</p>
  </body>
</html>

Image

Voici comment créer, enregistrer, ouvrir et modifier des fichiers HTML dans TextEdit.