How to Edit HTML With TextEdit

If you have a Mac, you don't need to download an HTML editor to write or edit HTML for a web page. The TextEdit program ships with all Mac computers. With it, and a knowledge of HTML, you can write and edit HTML code.

If you use TextEdit in rich text mode and save an HTML document with the .html file extension when you open that file in a web browser, you see the HTML code, which isn't what you want.

To change how the HTML file displays in the browser, you change TextEdit to the plain text setting. You can do this on the fly or permanently alter the preferences if you plan to use TextEdit as your full-time code editor.

Create an HTML File in TextEdit

If you only occasionally work on HTML files, you can make the change to plain text for a single document.

1. Open the TextEdit application on your Mac. Select File > New from the menu bar.

   

2. Select Format on the menu bar and click Make Plain Text. Confirm the plain text selection in the window that opens by clicking OK.

   

3. Enter the HTML code. For example:

   

4. Click File > Save. Type a name for the file with a .html extension and choose a location to save the file.

   

5. Click Save. Confirm you want to use the .html extension in the screen that opens.

   Test your work by dragging the saved file onto a browser. It should display exactly as you will see it when you publish it to the web. The example file dragged onto any browser should look like this:

   

   Instruct TextEdit to Open HTML as HTML

   If you see any problems with your file, reopen it in TextEdit and make any necessary edits. If you open it in TextEdit and don't see the HTML, you need to make one more preference change. You only need to do this once.

6. Go to TextEdit > Preferences.

   

7. Click the Open and Save tab.

   

8. Put a check in the box next to Display HTML files as HTML code instead of formatted text. If you're using a version of macOS older than 10.7, this option is called Ignore rich text commands in HTML pages.

Changing the TextEdit Default Setting to Plain Text

If you plan to edit lots of HTML files with TextEdit, you might prefer to make the plain text format the default option. To do that, go to TextEdit > Preferences and open the New Document tab. Click the button next to Plain text.