How to Create an HTML Webpage

Want to create an HTML webpage but don't know how to get started? This article will teach the basics of html you need to know.

Difficulty: Easy

Instructions

Things You'll Need:

• text editor such as notepad
• or a WYSIWYG editor such as Frontpage or Dreamweaver

1. 
    
   Open a text editor such as Notepad

   HTML or hypertext markup language is used to create webpages. Creating an html webpage is very similar to writing an article, essay, or speech. Whatever points you start with, you need to finish with. The first step in creating a webpage is to use a text editor such as notepad or a WYSIWYG (what you see is what you get) editor such as Frontpage or Dreamweaver. For this article, we'll use a text editor to help you understand the basic code behind every webpage. To start, go to Start/All Programs/Accessories/Notepad as seen in the following image.

2. 
    
   Open and close your html page

   Now that you have opened notepad, you can start to create your webpage using html. Remember whatever tags you start with, you have to end with. Every page starts and ends with an html tag. All tags begin with a less than < symbol and end with a greater than > symbol and your instructions are put in between the two symbols. To end a tag, you use the following symbol / within your html tag symbols. This tells the web browser such as Internet Explorer that you are closing that instruction. All tags hereafter will go in between the opening and closing html tags.

3. 
    
   Open and close the body of your html page

   Now that you have the opening and closing html tags, you can start with the contents of your page. Like every article you write, an html page has a body section. Before you can insert the content, you need to tell the html page that you are starting the body of the page. Just as you opened and closed the html page with tags, you need to open and close the body of the page as well.

4. 
    
   Insert a main header into your webpage

   We can begin with the content of our page. Just as every article has a main header, it's important that you include a main header in the content of your webpage. You need to include a header tag or h1 tag. See the following image.

5. 
    
   Save your document as an html webpage

   The next step is saving your text page as an html document. Go to File/Save As and change the Save as type to "All Files." Then save your document as a .html document. You need that extension on your document, or notepad won't know to save it as html. For example save your document as bicycles.html.

6. 
    
   Html webpage

   After you have saved your text page as an html page, go to where you saved your html document and click on it. It should open in your default web browser such as Internet Explorer, and it should look like the following image.

7. 
    
   Center header and add a background color

   The new webpage is ok but you're going to want to add color and maybe center the header. Reopen your .html page in notepad. You will want to add an align center to the h1 tag and add a bgcolor (background color) to your body tag. To add a bgcolor, you can google hexidecimal color charts, pick the color you want, and insert the color number into the body tag. See the following example.

8. 
    
   Add an image

   You now have your text, and you're going to want an image to spice up the look of your webpage. To add an image, you'll want to use the img src (image source) tag. Within this tag, you will put the height, width, alignment, and description. See the following example. Once you have completed this step, save your html document again.

9. 
    
   Final html webpage product

   Finally, you can view your webpage. It should look similar to the following example. Creating an html webpage is fairly simple. It becomes even easier when you understand the code behind what you see.
   
   © 2009 Lisa Evanock

[lighthouse1958]

on 10/4/2009 I haven't learn to do this yet. But I learn something here everyday. 5*

[thejunkman]

on 9/30/2009 this was a great how to on html, i am just starting to learn the basics! :)