To find the instructions on how to set up your own home page on the Web: go to UVM's home page and type in the URL for "Developing your own Webpages at UVM": http://www.uvm.edu/~hag/webpub/
Here's probably the best tutorials on the web for learning HTML from www.w3schools.com.Also, here is a good summary of HTML you may want to check out: http://www.werbach.com/barebones/
Another popular web design resource site is Web Monkey: http://www.webmonkey.com/ (check out navigation on right)
Here's the link to the organization that
standardizes web protocols: http://www.w3.org/
It is also a good idea to read about copyright issues in:
http://www.clari.net/brad/copymyths.html
BRIEF SUMMARY OF HTML STRUCTURE OF THE HTML FILE:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> {this appears on the very top title bar in the browser,
not in the page itself} </title>
<style type="text/css"> </style>
</head> <body>
. . {This is the main section of the web page where you put in text, pictures, sound, video, etc.} .
</body >
</html>
QUICK LIST OF HTML TAGS: HEADINGS, BREAKS, LISTS, etc.:
Include at the top of your html file:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
so the browser processes the file correctly.
Include inside the <head> section of your code
</head>:
For BACKGROUND COLOR, add this style tag to the head section:
<style type="text/css">
body {
background-color: #FFFFCC;
}
</style>
See the following page that lists the color names, RGB number values and their
hexidecimal numbers
(such as #FFFCC):
http://www.w3.org/TR/css3-color/#svg-color
For BACKGROUND FILE add this style tag to the
head section:
<style type="text/css">
body {
background-image: url("file.jpg");
}
</style>
You could combine the above two style together
into one with:
<style type="text/css">
body {
background-color: #FFFFCC;
background-image: url("file.jpg");
}
</style>
See this page for some background files you may use:
http://www.uvm.edu/~jleonard/cdae85/backs.html
(right-click on the image and Save-As)
Inside the <body> of your code you may use the following </body>:
<h1> Largest header
</h1>
<h6> Smallest header </h6>
<p> paragraph with surrounding
space</p>
<br> line break with no surrounding space
<hr> horizontal
rule
<b>bold
text</b> or <strong>strongly emphasized
text</strong>
<i>italic text</i> or <em>emphasized text</em>
For text color of some of your text:
<span style="color: red;">red text</span> or
<span style="color: #FF0000;">red text </span>
Try other colors
To Center some of your text or images:
<div style="text-align: center;"> Text or images
</div>
For Text Sizing:
<span style="font-size: xx-large;"> Text </span>
values are xx-small, x-small, small, medium, large, x-large, xx-large
You may also use font sizes such as 14pt, 32mm, or 2em
<ul>
<ol>
<li> This is an unordered
list</li>
<li> This is an ordered list </li>
<li>
This is another list item
</li>
<li> This is another list item </li>
</ul>
</ol>
<img src="file.gif" alt="short description of the image"> This is an image tag. Make sure the file.gif is in the same directory as the html file, and that permissions have been changed.
<pre> Here is some text in a text file format that you would like to be displayed as text in your web page. Preformatted text is usually rendered with whitespace intact and in a fixed-width font.</pre>
Once you have saved your .html file, upload it to your public_html directory on zoo (use SSH-FTP).
A validator that will check your html file is found here: http://validator.w3.org/
On the Windows platform, create the html file in Notepad, and save it as a plain text file with the .html (or .htm) file extension (do not have .txt as a file extension). Then upload the html file and image files to your public_html directory on zoo using WinSCP.
On the Mac platform, create the html file using TextEdit. You must have the text edit preferences set so that Plain text is chosen for New Documents, and that in Open and Save files the box Add ".txt" extension to plain text files" is NOT CHECKED:
Also the format should be set as Make Plain Text:
Upload the html to your public_html directory on zoo using Fetch or Fugu.
The "chmod" means "Change Mode". The next three numbers refer to the Owner, that's you (6); the group (4); and everyone else (4). The Permission numbers as follows:
Permission
Number Permission
0 No Permission at
all
1 Execute Only
2 Write Only
3 Write and execute
4 Read only
5 Read and execute
6 Read and write
7 Read, write, and
execute
By typing 644 *.* when you are in your public_html directory, you are giving yourself Read and write permission, your group and everyone else read only. This way only you can change the files in your public_html directory. If, for example you wanted to make the file MINE.HTML so that only you can see or edit a file, then:
chmod 600 MINE.HTML The public_html folder and any folders inside should be set to 755: chmod 755 foldername