HTM Basics
 

HTML (HyperText Markup Language) is a set of keywords called tags that tell a browser program like Internet Explorer or Firefox what to display on the screen.

 


HTML Tags are given between the bent brackets < HTML tag >. Creating a web page requires that you create a text-only file with HTML tags, and place that text file on a web server. The name of the file should end with .htm

Always view your document on your own computer before placing it on the server. Use the "Open File" command in your browser's File menu, and select the .htm file that you have created. If needed make changes, save the changes, and reload the file in your browser.



HTML Document Requirements


Each text file that defines a web page should have the following skeleton:





- This identifies the document as HTML

- This begins the header info section
- This ends the title - a "/" means "end"
- End of the header


- Begins the body of the page

Other HTML tags that define the page go here

- Yep, ends the body

- End of HTML document



Text Commands


Text is formatted by the browser, following certain commands. First, the browser does not see blank lines, or even more than one space between characters. It must be told where lines end. Furthermore, creating bold text, headings, etc requires special tags as well. The following table will illustrate some of the most basic text-handling tags.

Example 1: Basic text commands







HTML tag(s)
Browser output
Regular text
with line and

paragraph breaks


Regular text
with line and

paragraph breaks


Bold and Italic text
Bold and Italictext

Level 1 Heading



Level 6 Heading


Level 1 Heading


Level 6 Heading

You can also make both unnumbered and ordered lists:

Example 2: Lists






HTML tag(s)
Browser output



  • A list item

  • Another item



  • A list item
  • Another item




  1. First list item

  2. Second item



  1. First list item
  2. Second item


Links


Links are highlighted items, either text or images, that may be clicked on to jump to another file. This other file can either be another HTML document that defines another web page, or be a file that will be downloaded and possibly viewed in another "helper" application. Links are created using the anchor tag, which has the following format:

Highlighted item

There are three parts of this tag that must be customized:


  • mode - the two most common options are

    • http - for another HTML document (web page)
    • file - for a different type of file.

  • URL - one of two types:

    • Absolute - the full path to the file, including machine name and directory tree, ending with the filename
    • Relative - replace the current filename with the new one given in the URL part of the anchor tag

  • Highlighted item - this is a piece of text or inline image that appears in the page and, when clicked on, causes the browser to jump to the URL described above
Example 3: Links





HTML tag
Browser outuput
Click here to go to the HTML Tutorial homepage.
Click here to go to the HTML Tutorial homepage.


Images


Images may be placed in the document. The image must be in either GIF or XBM format for a browser to be able to display it. Make sure you save the image on your server so that it is available just like your HTML document. Images are called for display in a page using the following tag:


URL gives the URL of the image file. See the above discussion of links for more specifics.

Example 4: Inline images





HTML tag
Browser output



A Sample Page


Here are the contents of the file "sample.html" stored in my account here at MIT: