Table of Contents
- What is HTML Editor?
- Step 1: Open TextEdit (Mac)
- Step 2: Write some HTML code
- Step 3: Save the file
- Step 4: View the HTML file in a Web Browser
What is HTML Editor?
A HTML editor is a computer program for editing HTML, the markup of a web page. Although the HTML markup of a web page can be written with any text editor, specialized HTML editors can offer convenience and added functionality. For example, many HTML editors handle not only HTML, but also related technologies such as CSS, XML and JavaScript or ECMAScript.
Learn HTML using Notepad or TextEdit
Basically, we need a text editor to edit an HTML file. We can use any plain text/code editor like Notepad (Windows), TextEdit (Mac) etc.
We can also use a professional code editor like Bracket, Atom, Visual Studio Code, Sublime Text, etc.
But for the first time, we recommend plain text editors (Notepad, TextEdit, etc) to learn HTML.
Learn HTML using Notepad++
Notepad++ can be used to edit HTML code. It provides a range of features specifically designed to make HTML editing easier, such as syntax highlighting and autocompletion. It also includes a number of features which make it easier to debug HTML code, such as displaying line numbers, auto-indenting code, and displaying errors as you type.
Step 1: Open Notepad (PC)
Windows 8 or later:
Open the Start Screen (the window symbol at the bottom left of your screen). Type Notepad.
Windows 7 or earlier:
Open Start > Programs > Accessories > Notepad
Step 1: Open TextEdit (Mac)
Open Finder > Applications > TextEdit
Also, change some preferences to get the application to save files correctly. In Preferences > Format > choose “Plain Text”
Then under “Open and Save”, check the box that says “Display HTML files as HTML code instead of formatted text”.
Then open a new document to place the code.
Step 2: Write some HTML code
Write or copy the following HTML code into Notepad:
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>Step 3: Save the file
Save the file by giving any name. But you must add “.html” extension at the end of the name as shown in the below picture. And also select encoding “UTF-8” and click on the “Save” button.
Step 4: View the HTML file in a Web Browser
Go to your file explorer. Navigate to the file where you saved it. Right-click on it, hover over “Open With” and then click on a browser name available on your PC.
And then see the output of your code.
Note: You can also edit HTML usign our Try It editor.
Advanced HTML Editors
There are some advance HTML editor which are preferable for an advanced web designer. It is recommended to a beginner to use simple HTML editors at first.
Here are some advance HTML editors:
Visual Studio Code, Atom, Sublime Text, Brackets etc.