Overview


Well, now that we have you account all set up, and you have a somewhat foggy idea of what you're doing, there's nothing left to do but start! You'll learn how to change the size and color of your font, how to arrange your text, how to create links, and even add pictures!

Text


First off, you probably want to add the most basic thing to you web site, text. In your text editor (you will have to read the help section of your host if you have no idea what I'm taking about, each host sets up their screens differently) to put text on your page, simply type text into the text editor box. Wow that sure was easy! If you want to view what you've made, most hosts have a preview button that you can press to view how your page is coming along. You also want to save frequently, in case your connection is lost, or the server crashes. There's also thing you can type in called codes or tags which change the way you're text looks. For example, if I type in <h1> before my text, the text becomes very large. Like this:
If I type in this: <h1>WOW!!</h1>
It looks like this:

WOW!!


The reason I added the </h1> at the end of the WOW is because that tells the computer where to stop makin text that big. If I hadn't have added that, all of the following text would have been just as big. All tags that you add need to be closed, with a few exceptions, but don't worry about those. For the rest of the section, I will show you other tags, and what they look like and how to use them. All green text is where you insert your own text. One thing you need to know, however, is that enters, tabs and more than one space do not show up, you must insert a tag to do this. The tags you have to use and further down this page.

What this tag does

What it looks like

What the code is

This makes the text in the size "Heading 1", the largest heading.

Heading 1

<h1>your text here</h1>
The next largest heading. I'm not going to show it, but you can use the numbers from 1-6, and the smaller the number the larger the text. I'll show you a better way to change text sizes in the next section, so stick with this one for a while.

Heading 2

<h2>your text here</h2>
Makes text italic Now don't I look sexy? <i>your text here</i>
Makes text bold This stands out! <b>your text here</b>
Underlines text This is important!! <u>your text here<u>
This starts a new paragraph. You do not need to include a closing tag(</p>) when using this Paragraph One

Paragraph Two.

<p>
This starts a new line, you do not need to use a closing tag with this. Line One
Line Two
<br>
This creates a horizantal line, you don't need a closing tag for this, either.
<hr>
Centers text
centered
<center>centered text</center>
Aligns text on the right.

Right

<p align="right">right text</p align>

Linking to Another Site


Another thing that you need to know how to do is link to another page. This will not only be helpful when makin a links list, but when you add on other pages to you main page, you need a way to link them back to your main page so people can get there.
To link to another site, replace the green text with the URL(web site address) of the site you want to link to. Then, replace the red text with the text you want to link to the address. Like this: Ducki On-Line <a href="http://www.URLtothesite.com">link text</a>

Your link will probably be a different color than your text, and it will be underlined. There are ways to change this, and we'll go over that in the next section.

E-mail Links


Replace the green text with your E-mail address, and the red text with the link text <a href="mailto:you@yourhost.com">your text here</a> Mail me!

Images


To spice up your page, it's a good idea to add images. You can also use the <center> tag or <p align> tag to position your image. The URL of you image is simpley the name. Example: ducki.gif
Replace the green text with the URL of your image. <img src="imagename.jpg">
If you want to use an image as a link, just put the image tag inside the link tag. <a href="link URL"><img src=image URL"></a>
If you click on this picture, it will send you to https://www.angelfire.com/ego/ducki. But, see that ugly border around the picture? Use this code inside of the <img> tag to get rid of it: <img src="image URL" border=0> If you really want to, you can change that zero to a bigger number to make a thicker border.

There, now doesn't that look better?