HTML Editors

You already know that HTML is markup inside a text file. This session focuses on the tool you use to write that file: an HTML editor. Choosing a simple, plain-text tool keeps your tags clean and your first pages easy to open in a browser.

What is an HTML editor?

An HTML editor is any program that lets you write and save plain text as an .html file. The browser does not care which brand you use. It only needs correct markup and a file it can open. Editors range from tiny notepad apps to full code editors with color highlighting and file browsers.

Direct answer: what should beginners use?

Start with a free code editor such as Visual Studio Code, or even the built-in Notepad on Windows / TextEdit in plain-text mode on macOS. Avoid Microsoft Word, Google Docs, or similar word processors for HTML lessons. Those apps are built for printable documents and often insert hidden formatting that breaks web pages.

Plain-text editors vs code editors

A plain-text editor saves only the characters you type. That is enough for HTML. A code editor is still a plain-text editor, but it adds helpful features:

• syntax highlighting so tags and text are easier to read
• line numbers for finding mistakes
• folders and multiple files in one window
• optional extensions later (not required for this course)
  You do not need a paid IDE to learn HTML.

What this practice file is for

Copy the example into your editor, save it as editor-practice.html, then open the file in Chrome, Firefox, Edge, or Safari. If you see the heading and paragraph, your editor and save settings are working.

How to create your first HTML file

1. Open your editor and create a new file
2. Paste or type a basic HTML document
3. Save the file with a name ending in .html (for example index.html)
4. If the editor asks for encoding, choose UTF-8 when available
5. Open the saved file in a browser (double-click, or drag the file into a browser window)
   On Windows Notepad, use Save As, set “Save as type” to All Files, and type the .html extension yourself so the file does not become .txt.

Online editors and this site’s Try-it boxes

Online sandboxes let you edit HTML in the browser without installing software. They are useful for quick experiments. For this course, also practice with a local .html file so you learn the real save-and-open workflow developers use. When a lesson shows a Try-it code box, you can run it there and still recreate the same markup in your own editor.

Recommended free options

These are common beginner-friendly choices (any one is fine):

• Visual Studio Code — popular free code editor
• Notepad++ (Windows) — lightweight with highlighting
• Sublime Text — fast code editor (free evaluation)
• Built-in Notepad / plain-text TextEdit — enough for the first sessions
  Pick one tool and stay with it for a while so the workflow becomes automatic.

Common mistakes

• Writing HTML in Word or Docs and exporting without understanding the extra markup those tools add
• Saving as .txt by accident, then wondering why the browser shows raw tags or treats the file oddly
• Editing a file but forgetting to save before refreshing the browser
• Using a rich-text mode that changes quotes or inserts smart punctuation into attributes
• Expecting the editor to “run” HTML by itself — the browser displays the page; the editor only stores the source

Summary

• HTML is written as plain text in an editor, then saved as .html
• Code editors help with highlighting, but Notepad-style tools also work
• Avoid word processors for learning HTML markup
• Save, then open or refresh in the browser to see changes
• Online editors are handy; local files teach the real workflow
• One consistent editor is better than switching tools every lesson