class1

HTML Class 4

covering: web page building

you will get started on web page building now
you have the basics for it all and when done will be building yourself a character page as Master Ashton calls them
giggling softly
inother words a page you can post in soi to represent who you are here as this girl has here
http://soiuser.hyperchat.com/ashtonsmistie/homepage.html

some call it a homepage, others will be able to click on the ~ posted after you name once loaded
to soi and see who you are
smiling

try clicking on this girl’s and you can see
the little ~ after posts this one makes

this girl has noticed, she is in the soi server so has to be in a soi room that this is done in or her
homepage here can’t be found for some reason, if you are from @gor then to get to your
homepage this way one has to click on the ~ after you have posted in a @gor room,
make sense?

If you haven’t found a background you want you should be looking around for that and
any images you want on your page

Netscape Users:
right click on the object and scroll down to save image as and click
then just pick where on your hard drive or disc you want to save the image to and save it

IE users:
right click on the object and scroll down to save picture as and click
then just pick where on your hard drive or disc you want to save the image to and save it

This girl will use her own homepage and break that down somewhat to give you examples to relate

to, it a pretty plain html page so will be an easy one to follow

If you wish you can load http://soiuser.hyperchat.com/ashtonsmistie/homepage.html on another
screen so you can look at it while we analyze the page

Where to begin?

<HTML>
<HEAD>
<TITLE>mistie</TITLE>
</HEAD>

<BODY>homepage body</BODY>
</HTML>

every html page has to begin with the <HTML> tag and end with the closing </HTML> tag to show the browser what to recognize it as

<HEAD> within here you place any heading elements you want including what you named the page
also called the <TITLE>mistie</TITLE> and then close the heading with </HEAD>
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
then the good part begins, the body or essence of the html

<BODY>homepage body</BODY>
</HTML>

with in the body tags goes the rest of everything else on the page, your background, text, graphics and anything else you desire to place on the page then of course you end the whole page with the </HTML> closing tag

What goes within the <BODY> and </BODY> tags?

body background - you will not this girl used a jpg file, there is no http:// addy linked there because it's all on the same server and in the same folder, if it came from another sight she would have to have the entire address in there

bgcolor - the background color for the document body. This may be used instead of body background if you want a solid color and no image file used

text - the color used for the main text colors in your html page although you can change them line to line and word to word if you desire as you go along instead

link - the color used on the text for unvisited hypertext links.

vlink - the color used for the text for visited hypertext links.

alink - the highlight color used for the text for hypertext links at the moment the user clicks on the link.

Embeded Music

there are various music players you can embed into web pages, what that basically means is when the page loads so does the music. This girl likes to use this particular one because it seems like a lot of browsers will play the music, there are some you need to have special downloads for such as crescendo and a couple of others she can think of off the top of her head

with this particular one this girl as you can see has centered it in the page, once again the music file is located at the same sight as the page so the entire http:// address isn’t needed

loop="true" keeps the music running in a continuous loop, when the .midfile reaches the end it will then begin all over again

volume can be adjust as well as the size of the player you will see at the top of the page

at the top of the page this girl choose to place her name, it is infact her slaves homepage, you will pick out various html tags here, one centering the name in the page, one making the text bold, another increasing the font size and then the various font colors in this girl's name, and her name is in italics so that tag is included as well.
all with closing tags

here you see there is a line break putting a space between the name and the picture

the picture is also loaded to this particular server so no complete http:// addy was needed but you can link in from anywhere you desire, just as you can in the chat rooms, same html code

the height and width of this particular picture is the same size as the image, these attributes could have been left out of the tag actually

This picture could have been framed or a border placed around it but this girl played with the image in a graphics program and what they call buttonized it so didn't desire anything around it

here this girl just took the first few lines to show you for an example

you can see the new paragraph was begun, the lettering is in italics, the color this girl choose for the text and the size of the text, the text style could have been changed as well here, the line breaks begin a new line each time and the closing tags

<td><a href="poem.html">a special
poem posted for Master and His from a dear friend</a></td>
</tr>

<tr>
<td>
<center><a href="specialdance.html">a
special dance for Him</a></center>
</td>

<td>
<center>
<a href="dances.html">dances</a></center>
</td>
</tr>

<tr>
<td>
<center><a href="bio.html">"once
a lady of earth.... but no more"</a></center>
</td>

<td>
<center><a href="ashton.html">Master AShton, the Warrior,
the Master</a></center>
</td>
</tr>

<tr>
<td>
<center><a href="http://www.musicplace.5u.com/index.html">music</a></center>
</td>

<td>
<center><a href="http://members.xoom.com/thentisfamil/">Strong
Hold of Thentis Pages</a></center>
</td>
</tr>
</table>

<tr>
<td>
<center><a href="sisters.html">Wonderful Sisters</a></center>
</td>

here at the bottom of the page this girl added links to other pages connected with her character page (homepage)
you will notice it was placed in a table, centered within the page and the text within each cell was centered also, as well as bold and italics...... note the link within the cell, this girl could have used an image within the cell if she had desired as the link as well

you can do whatever you want within each cell....... not each has it's own opening and closing tages

</BODY>
</HTML>

then save it as a html file, this one was named homepage.html and you will want to save your character page with the same name if you want easy access just by clicking on the ~ after you name in posts in soi/gor.

Now how to get it to soi so E/everyone can see it?

There is two ways to get your files to your server in soi so it can be accesed
First - through the soi ftp page, it works pretty decent now, most of you this girl thinks knows how to do this already but will go over it briefly

when logged in go to your control room
then go to the FTP files link
you will see this page should be titled FTP Directories for:
pick the name you have made the page for and click on that link......
in this girl's case was User AShton's mistie
Then you will be at the page titled User Directory for

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

you should see something similar to this:
User Directory for ashtonsmistie

[Up to FTP Directories]

URL: http://soiuser.hyperchat.com/ashtonsmistie/filename.ext
Select a File, and then use the buttons to do something with it.

the http://addy you see here shows you what each file, how to link to any files in this "folder" in your soi account, weither it be a background file, or image file etc., the filename.ext is the only thing that changes
as in the case of the background this girl used she for example wanted to link to it she would use
http://soiuser.hyperchat.com/mistieasfg/f4.jpg and there is the link
f4.jpg was the name of the back ground file used on this girl's homepage/character page

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

If you would like to upload a file, press 'Browse' or enter the filename of the file on your computer, and then specify the filename
to use when the file is stored on this server. Finally, press 'Upload File' to perform the transfer.

This is sorta self-explanatory........
you upload every file that has anything to do with the page you created
backgrounds, images, music, etc and any other html pages you created to link to like this girl has done for hers

once uploaded you should see each file on this page and make sure to upload the homepage.html file

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

FTP Programs

There are various programs out there that you can run right off your desktop and send your files right through there to soi. This girl likes them because she can choose to send all the files at once and they seem to transfere faster, so between the transfering and being able to send them in a batch compared to one at a time with the soi online ftp it's alot faster and easier.

Go to your control room once again and this time click on the link [FTP_Control]

Here you will see FTP Information

then a bit lower in a framed box you will see something similar to this:
~ ~ Here is the FTP Information ~ ~

FTP Server - ftp.hyperchat.com
FTP Username - mistie@soi
FTP Password -

Here is the information you need to enter into the ftp program you are using to transfere the files
FTP Server - ftp.hyperchat.com - This is the address you will send the files to
FTP Username - mistie@soi - This of course is your user name
FTP Password - and finally you need to enter a ftp password in here and hit the change password button to enter it

This girl would highly suggest you make your ftp password different then your account password.
This girl is reluctant to have others account passwords because so much crap happens and don't want suspicions raised when it can be avoided but will and has gladly ftp'd files into account for others before when they were having trouble.

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Most are set up with two windows, the one this girl uses is Ws_ftp and the window on the left shows her hard drive, can look through it ir any drives in her computer to find the files she wants to send.

The screen on the right shows her account and folders in soi.
One folder will say rooms and one will say nicknames
in the case of this homepage.html page you will open the folder that says nicknames, then see a folder for each handle you have in your account
open the folder where you want your homepage.html file to be located

you then highlight the file/files on the left you wish to transfere and click the arrow pointed to the right in the case of the one this girl uses, each might work slightly different but it's all on the same principle, and bingo the files are sent and you have your homepage(character page)

Also there is more you can do with html pages but wanted to give you a good start here, the html codes that was used in this training are all listed on one long page
http://www.geocities.com/mistieas/htmlcodes.html

bookmark this sight and you will have an easy reference page
also never know might find this girl adding to it from time to time to
winks

so any questions now?
hope your not totally lost.

Useful Links:
Html Guides
HTML Class 1- text html
HTML Class 2 - images and links
HTML Class 3 - frames, tables and lists
HTML Class 4 - page building
HTML Codes - all the html tags learned in these classes on one page
Html Basics
Stone Throw's qwic and easy html course
Html Primer
Colors
Lick Me's Color Specifier for Netscape 3.0
Basic Color Code
Colors in Netscape
Backgrounds
there are alot of background sights out there with free graphics, if you want more just message this girl
Background tiles
Absolute Background textures - over 3100 textures here
Teaser's Backgrounds
Giant background page
Marvelous Backgrounds
Wallpaper
Smoking Dragon Wall Paper links
Wallpaper by Stormi
Desktop Wallpaper
Desktop Heaven
Fantasty Artwork
ImageNETion
Lots of Fantasy art links
Huge list of artists
Graphics
Doctor Draac's animated gif's
Fantasyland Graphics
Chosen Graphics
Clip art and graphic links
Music
Master AShton's Music Page
SeaDance Midi and wave files
Ultimate Midi collection
The Midi Library
Downloadable Programs to Help
ws_ftp - ftp program
cute ftp - ftp program
Thumbs Plus - useful for graphics file viewer
Paint Shop Pro - graphics program where you can manipulate or make graphics
Color Fazer - a neat little program to make colorful text with easily
Text Fade '99 - another neat font program
Other things you can learn
Great java script page
Java Applets
Another page of java applets
Webreference - a wonderful page for learning
Free Webpage sights-
check them out see what's right for you each is different and there are alot of others other there as well
Geocities - they have pop up screens which i find distracting but offere 15 megabytes of free webspace
FortuneCity - they also use a banner but offer 20 megabytes of free web space
Tripod - and here they use pop up screens also and offere 11 megabytes of free space to you
Other helpful links
Free Guestbooks
All kinds of free stuff - from counters, guest books, email accounts
Cool Text - online graphics generator
Design your own web graphics

Hosted by www.Geocities.ws