HTML Tutorial

HTML Home
HTML Introduction
HTML Editors
HTML Basics
HTML Elements

HTML Editors – Getting Started with HQLEduTech

You don’t need fancy software to start your HTML journey—a simple text editor is all it takes!

Learn HTML Using Basic Text Editors

While professional developers often use advanced tools like VS Code or Sublime Text, we at HQLEduTech believe beginners learn best by starting simple.

Whether you’re on a Windows PC or a Mac, you can create your first webpage using Notepad or TextEdit.

Step 1: Open Your Text Editor

On Windows:

  • Click on the Start Menu
  • Search for and open Notepad
  • You’re ready to begin coding!

On Mac:

  • Go to Finder > Applications > TextEdit
  • Before you start, update a few settings:
    • Open TextEdit > Preferences
    • Set Format to “Plain Text”
    • Under “Open and Save,” check:
      Display HTML files as code, not formatted text
  • Now create a new document

Step 2: Start Writing HTML

Type this basic code into your editor:

HTML
<!DOCTYPE html>
<html>
<head>
  <title>My First HQLEduTech Page</title>
</head>
<body>
  <h1>Hello from HQLEduTech!</h1>
  <p>This is my very first web page.</p>
</body>
</html>

Step 3: Save Your File

  • Go to File > Save As
  • Name it something like index.html
  • In Save as type, select All Files
  • Choose UTF-8 encoding (if available)

Step 4: Open It in a Browser

Just double-click the saved file. It will open in your default browser and display your first HTML page!

Congrats! You’ve just written your first webpage using a basic text editor. Simple, right?

Let me know if you’d like a downloadable PDF, styled HTML block, or Gutenberg editor version for your HQLEduTech website.

HQLEduTech Code Playground – Try it Yourself!

With the HQLEduTech Online Editor, you can experiment with HTML code and see the results instantly—right in your browser.

It’s the ultimate tool to learn by doing. Whether you’re just starting out or brushing up on your skills, HQLEduTech Playground makes learning interactive and fun.

Ready to Practice?

Click the button below and try your first HTML snippet now!

HTML Example:
<!DOCTYPE html> <html>
<head> <title>HTML Tutorial</title> </head>
<body> <h1>This is a heading</h1>
<p>This is a paragraph.</p> </body> </html>
Try it Yourself

Scroll to Top