Starting A Homepage

Alright, you want a homepage! First, you must make sure you want to be commited to keeping up a site - if you want it to be a bit easier go to Exress page where all the graphics are already there. But there are lots of others, including the following:

  • Geocities
  • AOL
  • Xoom
  • Angel Fire
  • Express Page

    There are many others but my favourites are Geocities and AOL. One you have picked your server, sign up! Now, I have a basic tutorial of how to start an HTML page. I have included not only the basics but a few things to make your page look *kewl* before you are able to do to much. Unlike some help pages, I have explained some things that got me started when I was beginning, so it's from a slightly different view. I highly suggest you go through the HTML Goodies Primers before you start. Another suggestion: open Notepad or something and minimize it so you can copy and paste any good codes. It may look like I have not included links and pictures, but I have, they are down the bottom. Well, here goes.

    HTML stands for HyperText Markup Launguage. With some servers you may need to start with

    <HTML> to say that the page is in HTML code. Now, look at the top of your browser, it should say 'Starting Up - HTML' somewhere along with the name of the browser. This is the TITLE of my page. This title is created like this: <head><title>Starting Up - HTML</title></head> You can include other codes within the 'HEAD', but you will learn about that later. /title and /head end the title and end the head. There you go, now you have a title.

    Alright, now for the body line. This changes the layout of the page:

    <body bgcolor="#000000" background="background.jpg" link="#000000" alink="#000000" vlink="000000" text="#000000"> You can do some other things within the BODY codes but this is all you need to start. Here, I'll explain them. BGCOLOR means Background Color, you can make that whatever color you want. BACKGROUND is if you have a background you want on it, put the filename here. LINK is the color of the links, if you don't fill this one in it will be the default color of the computer viewing it, usually blue. ALINK means active link, which is when it has just been clicked on. VLINK is visited link, for pages people have been to. TEXT is only if you want the color of the text here, though if you have the FONT code you will not need it. So, there you have the BODY line, which effects the whole layout of the page. You do not have to use all or any of these codes, if you don't need them leave them out. You may also add LEFTMARGIN="100" and RIGHTMARGIN="100" if you want margins on your page. This is useful with left border backgrounds, remember to change the number to match your needs.

    <br> <p>
    BR means a new line, it comes from BReak. P means a new paragraph. Simple, huh? :)

    Here you can have a simple line and a bullet which will help your page to look *swisho* :) Like this:

    • Bullet
    • lists
    • are
    • useful.

    Default lines are useful, too. This is how to do them: <ul> to start a bullet list, <li> for each point, you don't have to make a new line each time, it will do it automaticly; and </ul> ends it. <hr> for a line.
    There is more you can do with lists and lines, but these are the basics.

    Alright, you might want a font. If you have the font Comic Sans MS on your computer, then this text will be in it. If you don't, it will be your default. Also, it should be White. So, how did I do this? Like this:

    <font face="Comic Sans MS" color="#FFFFFF" size=3>
    Yup, that's it! Change the font and size and color to your choice. Now you have a font! To end a font to start a new color or even the end of the page, do this: </font>

    COLORS You will have notice that in my colors so far I have used numbers, like: "#9acd32". In these modern times you can you use words, so instead of 9acd32, you could put "yellowgreen". I like to use codes, though, because the old browsers read them only. If you are using codes, put a hash (#) before it. Refer to my colors page.

    To make your text a bit more interesting you can make it bold,   underlined,   strikethrough, typewriter and/or italic.
    How I did this:

    To make your text a bit more interesting you can make it <b>bold,</b><u> underlined</u>, <s>strikethrough,</s> <TT>typewriter</tt> and/or <i>italic</i>.

    Now I will show you headings:

    Head1

    Head2

    Head3

    Head4

    Head5
    Head6
    You can have headings like this without having to change the font size. This is how you do it: <h1>Head1</h1> Head1 is the largest, and you just change the number for different sizes, and of course the Head1 to your text.

    This text is in the center, so is this picture:

    This is lined up on the left.

    How did I get this on the right?

    Look:
    <center>Centered Text</center><left>Left aligned text</left><p align=right>Right aligned text</p>
    Use the /left, /p and /center commands to end them so that you can line the rest up on the other.

    Marquees can make your page look flash.
    This is done simply by:

    <marquee>Marquees can make you page look flash.</marquee>
    If you look on the top of the page you can see a marquee. But how did I get it to bounce back and forth? The code I used for the heading is the following:
    <marquee behavior=alternate><h1>Starting A Homepage</h1></marquee>
    You can see that I have included a head command so it is big writing. You can fiddle around with it however you want, you can even have backgrounds and pictures! Look here:
    hamster
    How I did this:<marquee bgcolor="#000000" behavior=alternate><img src="hamster.gif" alt=hamster></marquee> Fiddle around however you want!

    Well, I suppose I have left out the most important things...links and pictures. Links first.
    Click Here to return home
    How this is done:

    <a href="http://www.oocities.org/Heartland/Bluffs/6024/index.html">Click Here to return home</a>
    If you are in Geocities and are linking to another of your pages, instead of putting the whole http://www.oocities.org/Hear.... etc. you can just start from the forward slash such as "/heartland/bluffs/6024/index.html". What about e-mail links? <a href="mailto:your@email.com">E-mail me</a> MAILTO: is part of the code. You must include it or it will try and find the address as a link, for it is like the http:// telling it that it's a link. To link a picture put in the picture code between the end of the first part and the end, </a>. Please remember to end it, or your whole document will be a link! Anyway, now for pictures.

    <img src="filename.gif/jpg/whatever">
    IMG stands for image and SRC for source. Yup, this is all you need for a picture. No, you don't need all the slashes gif/jpg/whatever at the end. It's just that different pictures have different file types. If you are using a picture in a link, a link border will show up around it. If you don't want it, do this: <img src=filename.gif border=0>

    Well, that about wraps up my Getting Started help. Most of these things are showed their simplest, there are somemore clever things you can do with them, though I am still learning myself. You can move on to my Tricks of the Trade, and even add a form on your page. I will become your HTML pal if you are beggining and would be happy to take you step-by-step through setting up, though I'm no expert. It depends if you like my page or not!!