Editors


Write HTML Using Notepad or TextEdit

(Difficulty Level - Beginners)

Web pages can be created and modified by using any text editor.

Simple text editors are good to learn HTML.

Advanced editors give us a lot of functionalities.

In Basic section we will learn how to use Notepad (PC) or TextEdit (Mac) for making Website.

Follow our simple steps to create your first web page with Notepad or TextEdit.


Don't want to read!

Watch video tutorial instead.



Notepad TextEdit


Step 1:
Open Notepad (PC)

Windows 8 or later:

Open the Start Screen (the window symbol at the bottom left on your screen). Type Notepad and press Enter.

Windows 7 or earlier:

Open Start >Programs > Accessories > Notepad


Open TextEdit (Mac)

Open Finder > Go > Applications > TextEdit

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 "Ignore rich text commands in HTML files".

For the newer versions 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

Write or copy some HTML into Notepad (PC) or TextEdit (Mac).

<!DOCTYPE html>
<html>
<body>

<h1>This is h1 heading </h1>

<p>This is paragraph</p>

</body>
</html>


Step 3:
Save the HTML Page in Notepad (PC)

Save the file on your computer. Select File > Save as in the Notepad menu.

Name the file "index.htm" and set the encoding to UTF-8 (which is the preferred encoding for HTML files).

You can use either .htm or .html as file extension. There is no difference, however, we recommend using html for consistency.


Save the HTML Page in TextEdit (Mac)

Save the file on your computer. Select File > Save in the Textedit menu.

Name the file "index.htm" and set the File Format to Web Page (.html) and press Save.

You can use either .htm or .html as file extension. There is no difference, however, we recommend using html for consistency.



Step 4: View the HTML Page in Your Browser

Open the saved HTML file in your favorite browser (double click on the file, or right-click - and choose "Open with").

The result will be similar to following figure.


Don't want to read!

Watch video tutorial instead.



Notepad TextEdit