===================== STEP 1 ===================== Setting up a personal homepage on seidata How to create a directory and index.html on seidata for your Homepage Telnet to seidata.com and logon as normal Type the following commands in order mkdir public_html What you have done is; using the mkdir command you created a new directory called public_html. chmod u=rwx,g=x,o=x public_html Then using the chmod command you changed the access permissions for this new directory. cd public_html The change directroy command (cd) moved you into the new directory. touch index.html By touching index.html you created a new empty file. chmod u=rw,g=r,o=r index.html The chmod command again assigned new permissions for access to index.html, which is your empty homepage. ls -l the list command (el es space minus el) now shows your index.html on the screen in the public_html directory with access permissions correct. Your homepage address is: http://www.seidata.com/~userid/ Don't forget to include the tilde (~) in front of your userid. This is neccessary. Also in your public_html there is an underline character between the words. These are musts. ======================== STEP 2 ======================== How to Creat Your Own Home Page Creating Your Own Home Page Go directly to HTML Links Creating an HTML File The first thing to do is to create an HTML file. Use any text editor to create a file called index.html. The suffix of html or on PCs of htm is required, It tells the Web browser (WebSurfer, Netscape, Lynx, Mosaic) that the file is a hypertext file. An HTML document is actually only a text document that contains Tags telling the browser how to display the information. An HTML document is composed of a single element: . . . that is, in turn, composed of head and body elements: . . . and . . . The only tag we will concern ourselves with is the title tag. Sample Title In its simplest form, an HTML file would contain something like: Simple HTML example

This is a level-one heading

Welcome to my home page.

one paragraph.

a second paragraph. This is a level-one heading Welcome to my home page. one paragraph. a second paragraph. Headers and Sub-Headers Headers range from H1 to H6 and are coded in pairs:

Heading Level 1

Heading Level 2

Heading Level 3

Heading Level 4

Heading Level 5
Heading Level 6
(sizes not to scale in text version) Heading Level 1 Heading Level 2 Heading Level 3 Heading Level 4 Heading Level 5 Heading Level 6 Links and URLs An "anchor" tag is used to link one document to another in HTML. The following example creates a link to the file "madusers.html": HTML: Here is a list of SEI Data Users with home pages. Result: Here is a list of SEI Data Users with home pages. This tells the browser that it should display the text "SEI Data Users " as an active link, and when the user selects that link, to fetch the file "webpages.html". Linking to a WWW site outside of Your Own is just as easy. The following creates a link to "Yahoo" an excelent WWW site. HTML: Yahoo Result: Yahoo The easiest way to put URLs in your home page is to copy them out of your browser. Most browsers have some method of showing the URL of the current document. Netscape and Mosaic users will find this in the Document URL field at the top of a window; Lynx users can use the "=" command to show the information page for a document. Graphics If you want a picture or graphic in your home page this is how. Pictures are often in GIF format, which can be viewed on nearly any computer with a graphic display. Not all browsers support the same graphic formats so it is a good idea to stay with GIF formated grapics. You can link to a graphic the same way you link to a site. The following code makes a link to a graphic file called "iuball.gif": HTML: Indiana University Basketball Result: Indiana University Basketball Now when someone selects the "Indiana University Basketball" link, the file called "iuball.gif" is shown. Another type of graphic linking is inline graphic. An inline graphic si displayed on the document and is not displayed in a different window. HTML: Result: Note that there is no ending "" code; the IMG code stands on its own and simply shows the file or URL that is specified in the SRC section. A picture can tell a thousand words. It can also take a thousand seconds to download. A graphics-intensive home page can slow things down, depending on your system, or the system of the person reading your home page. Large graphics may appeal to you but if you want them let the user have the option, not inline, make sure you tell them what size the graphic is so they can choose whether waiting 15 minutes to see a picture of your vacation to The Grand Canyon is worth waiting for. Remember that not all users have a graphical browser. Using graphics can present problems to these people if you do not take measures. Fortunetly HTML probvides an option for this problem. The ALT tag within the IMG tag allows a text alternative to the graphic on a text only browser. You should include this within all graphics that you include on your page. HTML: Madison Home Page Result on TEXT ONLY browser: [Madison Home Page] A Few Other Useful Tags The following Tags are non-paired. They consist of only the tag and do not have a closing tag.

This tag is used to end paragraphs, skip lines, or force the formating of the previous lines of text as you want them. Examples This is pagagraph one.

This is Paragraph two. This is paragraph one. This is Paragraph two. This is Topic One

Topic Two

Topic three

The end This is topic One Topic Two Topic three The end
For the average user the

and the
are going to seem to do about the same thing. There are differences though. This is pagagraph one.
This is Paragraph two. This is paragraph one. This is Paragraph two. This is Topic One
Topic Two
Topic three
The end This is topic One Topic Two Topic three The end

The Horizontal Rule Tag creates a line across the page. This is very useful for dividing sections of your page or in focusing the readers attention upon a section of your home page. The default appearance for this is a 3-D engraved line. Section one =============================================== Section two Styles Physical Styles . . . Bold font . . . Italics . . . Underline . . . Typewriter font Logical Styles . . . Emphasis . .. Stronger emphasis Ron.Marriage Created 6/12/95.