Create a New Web Page Using Notepad

You Don't Need Expensive Software to Write a Web Page

Windows Notepad is a basic word processing program that you can use to write your web pages. Web pages are just text, and you can use any word processing program to write HTML. This tutorial walks you through the process.

01
of 07

Place Your Files in a New Folder

Place Your Files in a New Folder
Jennifer Kyrnin

To create a new website in Notepad, first create a separate folder to store it. Typically, you store your web pages in ​a folder called HTML in the My Documents folder, but you can store them where you like.

  1. Open the My Documents window.
  2. Click File > New > Folder.
  3. Name the folder my_website.

Important note: Name the web folders and files using all lowercase letters and without any spaces or punctuation. While Windows allows you to use spaces, many web-hosting providers do not, and you'll save yourself some time and trouble if you name the files and folders properly from the beginning.

02
of 07

Save the Page as HTML

Save Your Page as HTML
Jennifer Kyrnin

As with the directory name, when you save the page, use all lowercase letters and no spaces or special characters in the filename.

  1. In Notepad, click on File and then Save As.
  2. Go to the folder where you save your website files.
  3. Change the Save As Type drop-down menu to All Files (*.*).
  4. Name the file. This tutorial uses the name pets.htm.

 

03
of 07

Start Writing the Web Page

Start Your Web Page
Jennifer Kyrnin

The first thing you should type in your Notepad HTML5 document is the DOCTYPE. This tells the browsers what type of HTML to expect. 

The doctype declaration isn't a tag. It tells the computer that an HTML5 document is arriving. It goes at the top of every HTML5 page and it takes this form:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Once you have the DOCTYPE, you can start your HTML. Type both the beginning tag and the end tag and leave some space for your web page body contents. Your Notepad document should look like this:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
</html>
04
of 07

Create a Head for Your Web Page

Create a Head for Your Web Page
Jennifer Kyrnin

The head of an HTML document is where basic information about your web page is stored — things like the page title and possibly meta tags for search engine optimization. To create a head section, add the head tags in your Notepad HTML text document between the html tags.

​<head>
</head>

As with the html tags, leave some space between them so you have room to add the head information.

05
of 07

Add a Page Title in the Head Section

Add a Page Title
Jennifer Kyrnin

The title of your web page is the text that displays in the browser's window. It is also what is written in bookmarks and favorites when someone saves your site. Store the title text between the title tags. It won't appear on the web page itself, only at the top of the browser.

This example page is titled "McKinley, Shasta, and Other Pets."

<title>McKinley, Shasta, and Other Pets</title>

It doesn't matter how long your title is or if it spans multiple lines in your HTML, but shorter titles are easier to read, and some browsers cut off long ones in the browser window.

06
of 07

The Main Body of Your Web Page

The Main Body of Your Web Page
Jennifer Kyrnin

The body of your web page is stored within the body tags. It should come after the head tags but before the ending html tag. This is where you put the text, headlines, subheads, images and graphics, links and all other content. It can be as long as you like.

Leave extra space between the starting and ending body tags.

This same format can be followed to write your web page in Notepad.

<body>
</body>
07
of 07

Creating an Images Folder

Creating an Images Folder
Jennifer Kyrnin

Before you add content to the body of your HTML document,  you need to set up your directories so that you have a folder for images.

  1. Open the My Documents window.
  2. Change to the my_website folder.
  3. Click File > New > Folder.
  4. Name the folder images.

Store all the images for your website in the images folder so that you can find them later. This makes it easy to upload them when you need to.