1.866.PIXELMILL (1.866.749.3564 US/Canada)

Search Support

Search our knowledgebase? Enter keywords or article id:

> go to search support


Support Index


Help and Support


Search

Go back to search results

Enter keyword or id#:




Promotions


Quick Links

Printable Article

My First HTML Page

Article ID: KB101439

You can write your own HTML file just by using NotePad or any text editor!

Although many people use editors such as FrontPage or Dreamweaver to create HTML documents, you can actually write your own HTML in a simple text editor.

You will have to save your file with the ".htm" or ".html" extension in order to view it in a web browser.

How to:

  1. Open NotePad or some other simple text editor.
  2. Type this text:

    <html>
    <head>
    <title>Title of my HTML page</title>
    </head>
    <body>
    This is my first HTML page!
    </body>
    </html>
     
  3. Save the file as "myhtmlpage.htm."
  4. Open a web browser like Internet Explorer or Netscape.
  5. Go to File > Open and browse to the page you just created. You will see something like:

    Diagram of your first html page in a browser.

    See live example!

Learn:

  • Each <...> is a tag.
    • Tags are usually English words (like "body") or abbreviations (like "p" for "paragraph") in between angle brackets.
    • An opening tag (or "start" tag) looks like this: <body>.
    • A closing tag (or "end" tag) looks like this: </body>. Closing tags have a forward slash ("/") after the first angle bracket.
    • Tags are not case sensitive - <title> and <TITLE> mean the same thing. However, it's recommended that you use lower case tags.
  • Opening and closing tags often come in pairs, like this: <head> ... </head>. Together, an opening and closing tag, along with everything in between them, form an HTML element.
    • Some HTML elements that make up a page may tell the web browser how to display the content. For example, <b>Bold text</b> will tell the browser to bold the text in between the "<b>" and "</b>" tags.
    • Other HTML elements provide other information to the web browser. Some of these are described below...

About the example:

  • The example above starts with "<html>" and ends with "</html>." This tells the web browser that everything in between is an HTML document.
  • The HEAD element (<head> ... </head>) contains header information. This section usually contains information about the document. This section is usually not displayed in the browser window, although it contains other information that may help the browser know how to display the page.
  • The TITLE element contains the title of your document. Everything in between the <title> and </title> is displayed in the title bar of the browser window.

    Illustration of title in the browser window title bar.
     
  • The BODY element (<body>...</body>) contains everything that will be displayed in the browser window.

In the last intro article, we'll talk more about elements and tags...


Was this helpful?

Please rate this article:

Not helpful Very helpful
1 2 3 4 5 6 7

Email address: (not required)

(Please provide your email address if you would like PixelMill support to follow-up with you about your comment. You're email address is NOT REQUIRED to submit a comment.)

Comments: (How can we improve this article?)


Clicking "Submit" will not clear this page.


link to this page: http://www.pixelmill.com/support/al0/kb101439.htm
permalink to this article: http://www.pixelmill.com/support/kb101439.htm

Back to top

Items you recently viewed:


pm46519htdl1
$98.00

pm45887dwdl1
$94.00

pm45779fpdwtdl1
$87.00

pm46207fpdwtdl1
$98.00


PixelMill EDU

Introducing...

PixelMill EDUâ„¢ is an innovative and proprietary online training series designed to aid the do-it-yourself Web builder in transitioning to new Web editors, coding standards, and Web technologies.

Webinars and Seminars:

FrontPage to SharePoint Designer Series
This is a 6-Week series designed to give you strong exposure to the new SharePoint Designer web editor and interface, along with examples of working with Windows SharePoint Services and tips for transitioning from FrontPage.
Register Now!

Tables to Tableless CSS Series
This is a 6-Week series designed to help you transition from building Tables-based Web site layouts to working with CSS to edit and build Tableless Web site layouts. For all Web builders using Dreamweaver, Expression Web, or any other web editor.
Register Now!

FrontPage to Expression Web Series
This is a 6-Week series designed to give you strong exposure to the new Expression Web software and interface, along with tips for transitioning from FrontPage.
Register Now!

Learn more and register!

ADVERTISEMENT
adventisement