Learn HTML

Learn HTML Basics

HTML is a series of tags that are used to format the text document into a way so that it can be read by your browser. HTML is very easy to learn. And if you don't want to learn the HTML language you can still create web pages using programs like Microsoft Front Page.

Basic Code Requirements

Below are the basics of the HTML code. Each web page must contain the following HTML tags:

                                
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 <head>
  <title>Meaningful Page Name</title>
 </head>
<body>
  Text you want on your web page goes here.
</body>
</html>

<DOCTYPE>
transitional: means formatting is done with both a stylesheet & HTML tags.
strict: means only a stylesheet is used for page layout.

Comments

Type your comments like this:

Meta Tags

   
<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-5" />
<meta name="keywords" content="Tutorials, Interactive Multimedia, Examples of 
     Multimedia" />
<meta name="Multimedia Designs .NET provides information and interactive 
     examples of multimedia 
designs available for websites and on-line tutorials." />
<meta name="author" content="Susan Reed" />
<meta http-equiv="imagetoolbar" content="no" />

Link to favicon and External Stylesheets

       
<link rel="stylesheet" type="text/css" media="screen"
  href="MyStyles.css" />

  <link rel="SHORTCUT ICON" href="/favicon3.ico" />

Understand the path necessary to link to images and other pages on your site

If your working page is at the SAME LEVEL as your destination page:
LINK WITH: <a href="page1.html" /> <img src="star.gif" />

If your working page is at the "root level" and your destination page is in a folder (which sits above the files) then LINK WITH:
<a href="foldername/page2.html />
<img src="images/star.gif" />

If your working page is in a folder and your destination page is in a different folder (but both folders are at the same level): LINK WITH:
<a href="/foldername/page2.html" />
<img src=" /images/star.gif " />

If your working file is in a folder and your destination page is in a different folder above the current folder, the href attribute would look like this:
<a href="../myStyles.css" />go</a>

../ means "go up one level"
../../ means "go up two levels"
images/ means go to the folder called images "and then"

*NOTE: if referencing an image in a stylesheet, the image is relative to the stylesheet, NOT the web page.

Standard Events

HTML controls have events. Here is a list of the standard events:

onclick - on mouse click
ondblclick - on mouse double-click

onmousedown - mouse button pressed down
onmouseup - mouse button released

onmouseover - cursor moved over an element
onmouseout- cursor moved off of an element
onmousemove- cursor moved within an element

onkeydown - key pressed down over the element
onkeyup - key released over the element
onkeypress - key pressed and released over the element

You might want to study JavaScript to learn more about these events.

HTML

HTML VALIDATOR