So you want to build a home page/web site? Well here are the two free home page providers that I recommend and use. "TRIPOD" I use this site to mostly store my files/images.. I'll get into that later.
And next we have ANGLEFIRE Which I am using now! VERY easy to work with and build pages on! Now that..that's out of the way...let's get to work!
Keep in mind: Getting a domain name ONLY gets you the domain name. It doesn't mean you'll have a place to store all of your images and webpages. Some domain websites will host your files for you. Some wont. You will have two charges to ponder. The yearly cost of buying your domain name and the monthy cost of your file hosting. You can get both pretty cheap now-a-days.
This is an old page, I made it in 1999. I no longer use Tripod or Angelfire, but you can! I have my own domain: www.RoughKut.com. You can get a domain name at directnic.com or godaddy.com. They even host your pages and images now. You can also host your website on a host outside of the place where you bought your domain name. Do an online search for "Web Hosts". You'll find thousands of them.
You must have a domain name and webhosting account to have your own original website, if you are not ready for this you can still find hundreds of free hosting sites that give you web space. You can find a list of them here, http://www.freesitex.com/homepage.html but I recommend using the most well known.
Now that you have learned how to change text appearance and
build tables.. Let's learn how to manipulate text.
| <FONT
SIZE="1">1</FONT> 1 <FONT SIZE="2">2</FONT> 2 <FONT SIZE="3">3</FONT> 3 <FONT SIZE="4">4</FONT> 4 <FONT SIZE="5">5</FONT> 5 <FONT SIZE="6">6</FONT> 6 <FONT SIZE="7">7</FONT> 7 |
<FONT COLOR="blue">blue</FONT> blue <FONT COLOR="yellow">yellow</FONT> yellow <FONT COLOR="orange">orange</FONT> orange <FONT COLOR="red">red</FONT> red You get the hint lol. Anyway, there are MANY more colors to choose from, you can find them by clicking (here)! You can also use the "hex code" for colors or instead of typing "blue"...you will type #0000ff. Good luck!! Don't think you can't combine the two! You can! <FONT COLOR="RED" SIZE="4">I am red text in size 4 font</FONT> I am red text in size 4 font |
And further more:
| <P></P>
<P> Makes</P> <P>a paragragh</P> <P>break </P> |
like <BR>this <BR>or <BR>this <BR> <BR> <BR> Makes a single line-break in your page. Some people like to use this <BR/> Instead for script files.But it's still not a close tag. It just helps scripts from crashing. |
<HR>
Makes a line across the area/screen This is one tag that doesn't need to be closed because it doesn't change text. You can change the size and width of this one: <HR SIZE="5" WIDTH="200"> |
Are you ready for the good stuff?
| Creating hotlinks or weblinks.
Use this to link something like I linked the TRIPOD and ROUGHKUT sites. <A HREF="http://angelfire.com">ANGELFIRE</A> Would get you: ANGELFIRE You may put anything you want between > And </A> including an image-- we will show you how to make an image appear later. REMEMBER: To always close the <A HREF="URL"> tag with a </A> Or everything else after that link will be linked too!!
The best way to get the full URL is to visit the webpage you want to link and copy the content of the address bar at the top of the browser. Get it? Good! |
Well the time has come.. I think you are ready! No... I KNOW you are ready to build your own webpage on the'ol WWW!! Let's give it a try...
THE FIRST thing that should be at the top of your page editor text
area is. You can use Notepad or Wordpad or the editor that your webhost
provided you with. Many free webhosts provide you with a blank workspace to
write your own HTML.
<HTML>
Anything above that will likely make the html script not work at all. There are exceptions, but for now all you need is <HTML> and that should work.
The next thing you SHOULD use is
<HEAD>
This tells your browser that you want this to be seen FIRST. Everything included in the <HEAD> tag is loaded first by the browser.You follow me? Great!
THEN you should have a title for your webpage.. look at the top of your browser screen do you see something like "I hope you understood the first part" ? That is the title. You put that between the head tag! So far your editor should look like this:
<HTML>
<HEAD>
<TITLE> This is the title of my page!! </TITLE>
</HEAD>
<BODY>
THIS IS WHERE MY HTML TAGS, IMAGES, TABLES AND EVERYTHING ELSE GOES
</BODY>
</HTML>
Basically, that is a webpage! It's really simple when you break it down like this.
Then you want to add your background color! Ok, just pay attention..
<HTML>
<HEAD>
<TITLE> This is the title of my page!! </TITLE>
For advanced HTML, you can also include things like .CSS files here or certain javascripts and other files, but that's for another tutorial. It's best to google these tutorials.
</HEAD>
<BODY BGCOLOR="tan" TEXT="#111111" LINK="purple" VLINK="blue" >
(ALL Text and images HTML tags)
</BODY>
</HTML>
Let's quickly go over the body tag rules:
All these codes must be included INSIDE the OPEN body tag to work. That means between <BODY (codes) >
not in between <BODY> And </BODY>. It's a little complicated to explain, but just use these codes above to practice and change things one at a time.
The you may even want to spice up your site with some cool images... This is how you make them appear!!
<IMG SRC="http://roughkut.com/rk45.gif">
That gets you: 
A cool brand logo.
You can also wrap your text around an image just like in a book!
<IMG SRC="http://roughkut.com/rk45.gif" BORDER="0" ALIGN="LEFT"> You can use right, left or center in the IMG tag.
Hi! I
am a lot of sample text! Hi! I am a lot of sample text! Hi! I am a lot of
sample text! Hi! I am a lot of sample text! Hi! I am a lot of sample text! Hi!
I am a lot of sample text! Hi! I am a lot of sample text! Hi! I am a lot of
sample text! Hi! I am a lot of sample text! Hi! I am a lot of sample text! Hi!
I am a lot of sample text! Hi! I am a lot of sample text! Hi! I am a lot of
sample text! Hi! I am a lot of sample text! Hi! I am a lot of sample text! Hi!
I am a lot of sample text! Hi! I am a lot of sample text! Hi! I am a lot of
sample text! Hi! I am a lot of sample text! Hi! I am a lot of sample text! Hi!
I am a lot of sample text! Hi! I am a lot of sample text!
Then you would use <BR CLEAR="LEFT"> if you would like to end the left aligned text quicker. Or you can use <BR CLEAR="ALL"> and it will clear all aligned text above it.
You can include the height and width of the images as well. You can also put an image title and the "alt" or alternate text for browsers that don't support images. It's the text you may sometimes see instead of a broken image. The image border changes the little unattractive blue .line around linked images.
<IMG SRC="http://roughkut.com/rk45.gif" BORDER="0" ALT="WHAT A COOL RK LOGO!" TITLE="RK LOGO" HEIGHT="45" WIDTH="81"> -- All this code gets you this:
Right click
the image or hover your cursor to see some text.
This is an image link instead of a
text link. You can also make it go to a new window instead of this same window.
Click it and see.
target="_blank" added to the <A HREF> tag will make it go to a new window.
And remember to put the full url of the image!! Don't forget what an URL is.
<IMG SRC="url"> You don't need to close all tags after all. An image tag doesn't need to be closed because it doesn't change text.
You can either use your webhost's file manager to upload your files to your webpace or you can use an FTP service, please search for "FTP" because that's another tutorial as well. Most free and paid webhosts have an online file manager.
Save your HTML files as filename.html. There are plenty of other file extenstions you can use but .html is the one you need for this tutorial.
| ROUGHKUT's basic html | WARP SPEED's html directory.. (Very good site) | |
| My e-wrestler's page | My poetry site!! | My e-fed "I also designed this one. |
6/20/99