HTML Editors & Setup

To write HTML, you only need two things:

  1. A text editor
  2. A web browser

No special software or internet connection is required to get started.

What Is an HTML Editor?

An HTML editor is a program used to write and edit HTML code.
HTML files are simple text files saved with the .html extension.

You can use:

  • Basic text editors
  • Code editors made for web development

Common HTML Editors

1. Basic Text Editors

These are simple and available on every computer.

  • Notepad (Windows)
  • TextEdit (macOS – in plain text mode)

Best for:

  • Learning basics
  • Understanding raw HTML

2. Code Editors (Recommended)

These editors provide extra features that make writing HTML easier.

  • Syntax highlighting
  • Auto-complete
  • File management

Popular choices:

  • Visual Studio Code
  • Sublime Text
  • Notepad++

Any editor that saves plain text files works for HTML.

Setting Up Your First HTML File

Step 1: Create a File

Create a new file and name it:

index.html

Important:

  • File extension must be .html
  • Avoid spaces in file names

Step 2: Write Basic HTML Code

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="description" content="HTML editor and setup example">
  <title>HTML Setup</title>
</head>
<body>
  <h1>My First HTML Page</h1>
  <p>This page is created using a simple editor.</p>
</body>
</html>

Opening HTML in a Browser

You can open an HTML file in two ways:

  • Double-click the file
  • Right-click → Open with → Browser

The browser reads the HTML file and displays the page.

Folder Structure (Simple Setup)

A basic project structure looks like this:

project-folder/
│── index.html
│── images/
│── css/
│── js/

This keeps files organized as projects grow.

Important Notes

  • HTML does not need installation
  • Save files using UTF-8 encoding
  • Refresh the browser after changes
  • Always keep one HTML file as index.html