HTML editing tool

Compose HTML with Notepad or TextEdit

You can create and edit web pages using professional HTML editing tools. But to learn HTML, it is better to use simple editing tools such as Notepad (on PC) or TextEdit (on Mac). You can even use the online HTML code tool to do it.

Here are the steps to create your first web page with Notepad or TextEdit.

Step 1 - Open the editing tool

Open Notepad (on PC)

  1. With Windows 8 onwards: Open Start Screen > type Notepad.
  1. With Windows 7 go back: Start > Programs > Accessories > Notepad.

Open TextEdit (on Mac)

Finder > Applications > TextEdit. Also, change the settings to save the file, by going to Preferences > Forrmat > Plain Text.

Under Open and Save, select Display HTML files as HTML code instead of formatted text.

Then open the text and paste the code into it.

Step 2 - Edit HTML

Write or copy the written HTML into Notepad.





Learn HTML programming


HTML is a hypertext markup language.




HTML editing tool Picture 1
Paste the HTML code into Notepad

Step 3 - Save the HTML page

Save the file on your computer, select File > Save as in the dropdown. Name the file quantrimang.htm and choose the UTF-8 encoding (preferred for HTML files).

HTML editing tool Picture 2
Save the newly created text as text

Note: You can select the extension for this file as .htm or .html.

Step 4 - View the HTML page on the browser

Open the saved HTML file in the browser you want (double click or right-click and select Open With).

HTML editing tool Picture 3
Display image of the file just created on Chrome browser

See also: 5 free online HTML editing tools for best code checking

Previous article: Introduction to HTML

The following article: Basic examples of HTML

5 ★ | 2 Vote

May be interested

  • 35 tools, scripts and plugins to build HTML Table35 tools, scripts and plugins to build HTML Table
    there are many ways to visualize data, ie you can design a beautiful infographics or create interactive charts. it all depends on your data and how you want to present them.
  • Why write neat and organized HTML?Why write neat and organized HTML?
    you will get many benefits from writing clean and precise html code. here's why it's a good idea to write optimal html code.
  • HTML formHTML form
    the form in html contains form elements - the element types that take input data such as filling in text fields, checkboxes, buttons, submit buttons ...
  • Style properties in HTMLStyle properties in HTML
    the style attribute specifies the style for the html element.
  • Text in HTMLText in HTML
    the element in html is used to define a paragraph of text.
  • How to Use Text Color Tags in HTMLHow to Use Text Color Tags in HTML
    this article explains how to change the font color in html documents. although the html style tag is obsolete in html5, you can use css to color content on an html page. if you use an older version of html, you can use the html text color tag as needed.
  • Format text in HTMLFormat text in HTML
    format elements in html help determine the style and importance of text.
  • Elements in HTMLElements in HTML
    the html element usually goes in pairs, including the opening tag, closing tag, and the content inside the two tags.
  • Symbol - Icon in HTMLSymbol - Icon in HTML
    html has many mathematical, technical and monetary symbols that cannot be used to write.
  • 9 best free HTML editing tools for Windows 20249 best free HTML editing tools for Windows 2024
    a good html editor should have a spell checker, line numbers, autocompletion, page preview, and be a text and image editor. there are many types of authoring tools (text, object, and wysiwyg), so it's important to find the right one.