HTML Editors

24 March 2025 | Category: HTML

HTML Editors: A Quick Tutorial

When learning web development, you don’t need fancy tools to start writing HTML. Simple text editors like Notepad (Windows) or TextEdit (Mac) are enough. In this tutorial, we’ll walk through creating your first HTML page step by step.

Step 1: Launch Your Editor

Windows Users: Open Notepad (search for “Notepad” in the Start menu).
Mac Users: Open TextEdit, then switch to plain text mode via Format > Make Plain Text.

Step 2: Add HTML Code

Once your editor is open, type the following HTML structure:

<!DOCTYPE html>
<html>
<head>
    <title>My First Page</title>
</head>
<body>
    <h2>Hi There!</h2>
    <p>Made on March 24, 2025.</p>
</body>
</html>

Step 3: Save Your File

Click File > Save As.
Name it testpage.html.
Choose UTF-8 encoding to ensure proper character rendering.
Save it to your desktop or preferred location.

Step 4: Open Your Page

Now, double-click the testpage.html file. Your browser will launch and display the page with a heading and a paragraph.

Why Start with a Simple Editor?

Using a basic text editor helps you understand HTML without distractions. Once you’re comfortable, you can explore advanced tools like VS Code, Sublime Text, or Atom.

Customize Your Page

Try making changes to your page:

Modify the <h2> text.
Add italic text using <i>Your Text Here</i>.
Save and refresh your browser to see updates.

This simple approach gives you hands-on experience and builds a strong foundation in HTML. Happy coding!