Getting Started

Where to Begin

Creating web pages is really very simple. A grasp of the basics is really all you need to get started - that's what this site is for. By no means does it cover all aspects of HTML...there are plenty of other good websites and books for that. It does, however, give you an idea of what HTML is so you can at least create your first webpage as you begin your journey into learning more.

Though there are HTML editors that will do most, if not all, of the work for you, it is usually a good idea to understand the basics of HTML so you can at least alter your pages to suit your needs. For some people, learning on an HTML editor works perfectly well...you eventually learn what the "tags" mean. For others, learning from scratch on an ascii text editor such as Notepad is beneficial. Should you decide later to use an HTML editor, you know why all those funny-looking tags are there and what purpose they serve. Also, some people use an HTML editor to compose their basic page layout, then alter the HTML by hand, as mentioned above, so that the page suits their needs. If you want more information on HTML editors, click here for links to some helpful websites.


Tags

So...just what is HTML? HTML - or Hyper Text Markup Language - is the format used for writing your web pages. It is not actually a 'coding' language - rather, it is a 'markup' language in which you simply 'markup' text and graphics with tags that tell your browser how to display them.

Think of it this way...your document contains some text and graphics. But your browser doesn't know what to do with them until you indicate with tags how the elements are to be displayed. For example: <TITLE> tells the browser that this tag begins the title element. In our case, our title is Internet 1st Web Page Help. You see this in the top of your browser window. In order to tell your browser that there is an end to the title element, you give it a closing tag which looks like: </TITLE>. Notice the forward slash before the word title indicating the end of the title element.

Your documents should contain certain elements within tags that indicate it is an HTML document. They are:

<HTML>
<HEAD>
<TITLE>
<BODY>
and, of course, their corresponding closing tags.

So, at the very least, your document would look like this:

<HTML>
<HEAD>
<TITLE>This is Your Web Page</TITLE>
</HEAD>
<BODY>

This is a paragraph on your page.
The beginning of a paragraph is
tagged with a <P>
</BODY>
</HTML>

Want to try this yourself? Click here for practice.



Hyperlinks


Well, putting text on your webpage is pretty easy. But you want hyperlinks. That's easy, too. you use the tag A HREF. The A stands for anchor, and HREF stands for hyperlink reference. It will look like this:
<A HREF="somepage.html">
This works if you are making a link to another page within your own home directory. If you want to include a link to another website, you would do it like this:

<A HREF="http://www.someplace.com">

Notice the http reference. You should supply the entire URL, or Internet Address.

Of course, you need to anchor the reference to some text or an image. At the end of the text, you provide a closing tag for the anchor that looks like </a>. So the whole thing would look like:

<A HREF="somepage.html>this is hyperlink text</A>

That's it! Click here to try it yourself.



Graphics


Now you can put text on a page, but what about graphics? Easy! You place those with image tags. There are many variables for placing images. Example: say you want to put a picture of Fido on your page for the world to see. you place that in the body of your document (remember the body?) with an image tag. It looks like this:

<IMG SRC="somepic.gif">

Of course, somepic.gif would be the name of whatever image you want to put on your webpage.
One thing to add: Be sure to specify the width and height of your image...like this:

<IMG SRC="somepic.gif" WIDTH="40" HEIGHT="100">

This will allow the text of your page to load while your browser waits for the image information. Try it here.



Other Tags


Let's not forget about those tags that put breaks on your page, change your fonts, put a background on your page, and even change your background color.

The tag <BR> indicates a line break. HTML doesn't care where you actually put line breaks - if you want your lines to break in a particular place, you have to tell it so. The nice thing about the break tag is that it doesn't need a closing tag. Your browser knows that when it encounters the break tag it is a new line. The same thing goes for the paragraph <P> tag. Your browser knows this is the beginning of a new paragraph. There are exceptions to the paragraph tag, though...if you give the paragraph tag a closing tag, you can specify certain variables with it, such as centering. For instance:

<P ALIGN="CENTER">
This is one way you can center a paragraph.
</P>

Within the body tag, you can specify your background, background color, text color, link and visited link colors. We're sure you don't want a dull page, so let's say you want to make the background a nice blue. Your body tag would look like this:

<BODY BGCOLOR="#0033ff">

Notice the color number. You can specify colors in hexidecimal. For more information on hexidecimal colors, click here.

To name the color of your text, links, and visited links, you would do the same thing:

<BODY BGCOLOR="#0033ff" TEXT="#ffffff" LINK="#009900" VLINK="#009933">

A note: By default, text is black, so you only need to specify your text colors if you want a different color. Also, you only need to change the link and visited link colors if you don't want to use the default colors.

1