Creating Your First Web Page using a Simple Text Editor: A Beginner's Guide to HTML

Learn the fundamentals of HTML by creating your first web page using a simple text editor like Notepad or TextEdit. This beginner-friendly tutorial provides a step-by-step guide, explaining how to write basic HTML, save the file correctly, and view it in a web browser.



Creating Your First Web Page: Using a Simple Text Editor

Using Notepad or TextEdit to Write HTML

You don't need a fancy HTML editor to learn HTML; a simple text editor is perfectly sufficient for getting started. This tutorial guides you through creating your first webpage using Notepad (Windows) or TextEdit (macOS).

Step 1: Open Notepad (Windows)

Depending on your Windows version, open notepad by:

  • Windows 8 or later: Open the Start menu (bottom-left), and type "Notepad".
  • Windows 7 or earlier: Open Start > Programs > Accessories > Notepad.

Step 1: Open TextEdit (macOS)

On macOS, open TextEdit by navigating to Finder > Applications > TextEdit. Change the preferences to ensure that the application saves plain text files correctly:

  1. Go to Preferences > Format and select "Plain text".
  2. Under "Open and Save", check "Display HTML files as HTML code instead of formatted text".

Step 2: Write Your HTML Code

Copy and paste this basic HTML code into your newly opened text editor:

Basic HTML Code

<html>
<head>
  <title>My First Web Page</title>
</head>
<body>
  <h1>My First Heading</h1>
  <p>My first paragraph.</p>
</body>
</html>

Step 3: Save Your HTML File

Save the file with a `.htm` or `.html` extension (e.g., `index.htm`). Remember to select UTF-8 encoding. This ensures the file is saved using a standard character encoding which avoids issues with character display.

Step 4: View Your Web Page

Open the saved file in your web browser. You should see your heading and paragraph displayed! Double-clicking the file or right-clicking and selecting "Open with" will work.