<TAG></TAG>.
They consist of a left angle bracket
(<) followed by the name of the tag
and closed by a right angle bracket (>). Tags are usually paired,
e.g. <TITLE> and </TITLE>. The ending tags is
similar to the beginning tag except for a slash (/) that precedes the text
within the bracket. For example, <TITLE> tells the Web browser the
beginning of the document title and </TITLE> tells the Web browser the
ending of the document title.
Note: HTML is not case sensitive. <TITLE> is equivalent to
<title> or <TiTle>. Not all tags are supported by all Web
browsers. If a browser does not support a tag, it just ignores it.
A web document consists of two parts: Head and Body. The HEAD primarily contains one piece of information: the TITLE of the document. All of the remaining contents of the web document are contained in the BODY.
The following five (5) tags are used to create a web document.
<HTML>Your entire document</HTML>
<HEAD>Document Title Information</HEAD>
<BODY>document context</BODY>
<TITLE>Joe Smith's Home Page</TITLE>
<H1>Joe Smith's Home Page</H1>
In general, the browser ignores any indentations, multiple spaces or blank
lines in the source text. One noted exception is "pre-formatted" text
which we will cover later. Therefore, HTML relies entirely on the tags for
formatting instructions and without the <P> tags, the document would be
one large paragraph. The ending paragraph tags </P> is optional.
Note: multiple paragraph tags are ignored. In other words, <P> has the
same affect as <P><P><P>.
A line break is used to start a new line of text or to break a line at a
specific point. A line break, like the paragraph tag, is usually a single tag,
i.e. There is no </BR>.
Horizontal Rules are used to visually separate text and can be place
almost anywhere in the document.
The <CODE> tag defines text that should be shown in a fixed width font.
Many browsers use the same font for the CODE and TT tags.
For many lines of fixed width text, with the line breaks
and other whitespace specified by the page author, use the PRE tag.
The pre-formatted text tag <PRE> is used to preserve the tabs,
indentations, and line spacing in your original source text. Netscape and
other graphical browsers display pre-formatted text in fixed font, such as
Courier; other text appears is a proportional font, such as Geneva or
Times.
Block quotes tags are used to set paragraphs apart from the text. This tag
set indents a block of text from the left and right margins, and inserts a
single line space above and below the block.
Unordered lists are commonly referred to as bullet lists.
Use the <UL> tag to begin an unordered list and </UL> tag to
end the list. Individual items in the lists are specified with the <LI>
or "list item" tag. Note: there is no corresponding </LI> tag.
To create a ordered list use the <OL> tag at the beginning of the list
and the </OL> at the end of the list. Again, items within the list are
specified by the <LI> tag.
Ordered List
Nested List
Definition Lists are usually used, as stated in the name, for definitions.
The list is made up of alternating a term (identified by the <DT> tag)
and a definition (identified by the <DD> tag).
Web browsers generally format the definition on a new line.
I like Disneyworld, but I <B>do not like</B>
standing in line.
Many, but not all, browsers display text in italics when you use the
<I></I> tag set.
where:
Example: remote file
Example:local file
You can also link to a target that is defined in another document, using the
following HTML code:
<a href="sample.html#rams">VCU Rams
</a>
The "mailto" link allows electronic mail to be sent directly from a HTML
document. As a web author adding an email link to your home page 1) tells
visitors to your page who is responsible for its content and 2) enables
visitors to contact them with questions or suggestions about their pages.
The form for adding an e-mail link to your page is:
Example:
An in "in-line" image is a graphics file (e.g. gif, jpeg) that displays as
part of your HTML document. It appears automatically if the user
turns on "Auto-Load images" in the Options menu. If that option
isn't turned on, a place holder appears instead, and the graphics file can be
downloaded later. To add an in-line image, you specify the image source
using this format:
For Netscape: If images are turned off, you will
see some type of graphical marker. Netscape 2.0 displays
For LYNX: If alt is not included then the browser will display
Be sure to include the quotation marks around the file names.
All VCU Web Pages should include a signature with the following attributes.
All VCU Personal Home Pages must include a disclaimer, such as:
Note: Saturn is an IBM RS/6000 multi-user, timesharing computer running
the AIX (UNIX based) operating system.
Moving Your Account to Saturn (from atlas or titan)
If your account is on either the atlas or titan RS/6000 computer system, you
will need to move your account to the saturn system. To move your account,
you will need to enter the command
Initial Saturn Setup
In order to create a "home page" in your saturn account, you must create a
"Web" directory to contain your HTML documents and allow the WWW
server "read" access to the documents. While this will slightly relax the
security of your account area, if you follow these instructions your
exposure will be minimized.
You will need to modify the permission on your "home directory" and
create the "public_html"
directory before you can start creating Web pages. We have created a
program to do this for you.
from the Unix prompt on saturn. If you use the UCS-AC menu, you need to
"quit" the menu (type 'q') to get to this prompt.
After you are done, type "menu" to get back into the menu or logout, as
desired.
Uploading a file to saturn
If you created your homepage on a Macintosh or a PC, you will then need
to upload the homepage to saturn with Fetch
or Winsock FTP respectively.
These applications are available from the
Network
Desktop page.
Setting Permissions on your Documents
Your "home page" (the initial entry point to your Web documents) should be
named "index.html" to keep people from looking at all documents in your
Web directory without following your specific links. After you have
created a new document you must enter the command
before you or anyone else can view it using the Web server.
There are certain standards in the way the WWW server operates that
dictate the way you must set things up. The server runs as a standard
"user" on the system so it uses the "other" permissions on your directory
and files. It will look for Web documents ONLY in a directory called
"public_html" in your home directory (or in sub-directories under that
directory). The URL address for these documents is
where "[userid]" is your login id on the system and "[filename]" is the
actual name of the file (do not include the brackets "[ ]" in your actual
address). Remember, in order for browsers to process HTML documents
properly, the "filename" must end in ".html". If no filename is included
then the browser looks for a file named index.html.
Once you have completed your home page and you are satisfied with its
appearance, you can
submit
your URL to be included in the
VCU Faculty and Staff Homepage Directory.
HTML: <HTML>
The HTML tag indicates to the web browser that this is a readable HTML
file. This will be your first and last tags in your page source file.
Example:
Head: <HEAD>
The HEAD primarily contains one piece of information: the TITLE of the
document.
Example:
Body: <BODY>
All of the remaining contents of the web document are contained in the
BODY.
Example:
Title: <TITLE>
Every HTML document should have a title. The title is generally displayed
separately from the document and is used primarily for document
identification in other context (e.g. Bookmarks). Note: Please limit your
title of 6 words or less.
Example:
Heading: <Hn>
HTML has six (6) levels of headings, numbered 1 (largest) through 6
(smallest). Headings are displayed in larger and/or bolder fonts than
normal body text. Note: H4-H6 are smaller than regular text. Also, a blank
line is inserted above and below each header.
The following is the skeleton of a basic WWW Document.
Example:
Example:
<HTML>
<HEAD>
<TITLE>Title of the Document</TITLE>
</HEAD>
<BODY>Contents of the Document</BODY>
</HTML>
Action: Start Home Page
Tags that Control Spacing
Paragraph: <P>
A paragraph tag is used to separate one paragraph from another. A
paragraph tag inserts a blank line between the text prior to paragraph tag
and the text following the paragraph tag.
Example:
Welcome to HTML. This is the first paragraph<P>Now you
Click to see Results
are reading the second paragraph. Line Break: <BR>
Example:
This part of the sentence is on the first line<BR>and this part is on the
second line.
Click to see Results
Horizontal Rule: <HR>
Example:
Here are the items above the line.
<HR>
And here are the items below the line.
Fixed Width Font: <CODE>
Example:
<CODE>
This is text displayed in a fixed width font.
</CODE>
<BR>
This is text displayed in a variable width font.
Pre-formatted Text: <PRE>
Example:
<PRE>
NCAA BB COLONIAL ATHLETIC ASSN 1996 FINAL
FINAL 1ST 2ND TOTAL
--- --- -----
NC WILMINGTON 26 17 43
VA COMMONWEALTH 23 23 46 FINAL
</PRE>
Block Quotes: <BLOCKQUOTE>
Example:
In May, Virginia Commonwealth University's School of Business unveiled its
professional Direct Marketing
Certification program. It delivers graduate-level studies that businesses are
demanding to keep pace with this
contemporary marketplace phenomenon. The new modular weekend program --
offered through VCU's
Interactive Marketing Institute -- combines elements of a traditional M.B.A.
program with direct marketing tools
and techniques that professionals need as this strategy expands.
<BLOCKQUOTE>
"To do marketing well today, it needs to be direct," said Pamela Kiecker,
Ph.D., executive director of the
Interactive Marketing Institute. A 15-year veteran marketer, Kiecker also
chairs the school's Department of
Marketing and Business Law.
</BLOCKQUOTE>
"We're moving away from broadcast messages to one-on-one communications," she
said. "People don't want to
be a number, an account. People want to be addressed as individuals, and
direct marketing is the way
businesses can do so effectively and efficiently."
Action #2: Update Home Page
Lists
HTML supports three (3) types of lists: unnumbered, numbered, and
definition. It should be noted that lists are indented and can be nested.Unordered: <UL>
Example:
Here are things that I need to do this weekend
Click to see results
<UL>
<LI>Do some outside work (between the rain drops) such as wash the car,
rake gum balls, and spread some mulch
<LI>Organize my toolshed
<LI>Clean the bathrooms
</UL>
I hope I have time to finish them.
Ordered Lists: <OL>
Examples:
My four favorite sports are
<OL>
<LI>professional baseball
<LI>college football
<LI>college basketball
<LI>golf
</OL>
Enjoy the games!!!
Click to see results
My four favorite sports are
<OL>
<LI>professional baseball
<LI>college football
<LI>college basketball
<UL>
<LI>VCU
<LI>Penn State
<LI>Wake Forest
</UL>
<LI>golf
</OL>
Enjoy the games!!!
Click to see results
Definition Lists: <DL>
Example:
<DL>
Click to see results
<DT> Browser
<DD> A program which allows a person to read hypertext. The browser gives
some means of viewing the contents of nodes and of navigating from one
node to another. Netscape and Lynx are browsers for the World Wide Web.
They act as clients to remote servers.
<DT> Hypertext
<DD> A term coined by Ted Nelson around 1965 for a collection of
documents (or "nodes") containing cross-references or "links" which, with the aid of an interactive browser program, allow the reader to move easily from one document to another.
</DL>Action #3: Revise Home Page
Character Formatting
Boldface Text: <B>
Most, but not all, browsers display text as bold when you use the
<B></B> tag set.
Example:
Italics: <I>
Example:
My favorite place in Disneyworld is <I>Adventureland</I>.
Click to see results
Action #4: Update Home Page
Links
One of the most important features of HTML is its ability to
interconnect with other documents.
Linking to Remote Files
The basic format for links are:
<A HREF="protocol://<domain name>/<requested
file>">visible link</A>
<A
HREF="protocol://<domain name>/<requested file>"
visible link is text (or graphics) that will serve as the
hypertext link in the current document
</A>
Example:
<A HREF="HTTP://www.vcu.edu/index.html">remote file</A>
Results in:Linking to Local Files
The basic format for linking to a local file is:
Example:
<A HREF="localfile.html">local file</A>
Results in:Linking to a Section within a Document
You may link a particular section within a document.
First you need to set the target using the anchor tag along with the name
attribute.
<a name="target_name"></a>
To set a link to that target from somewhere else in that document you would
use the html code:
<a href="#target_name">visible text</a>
<a href="computer/file/#target_name">visible text</a>
Example:
Electronic Mail
<A HREF = "MAILTO: your_email@address">your_email@address</A>
Note:
<A HREF="MAILTO:webmaster@www.vcu.edu">VCU Webmaster</A>
Action #5: Update Home Page
In-line Images
where "graphics filename" is the name of the graphics file and
"alternate text" is displayed if graphics is turned off of if the pages is
being viewed by a non-graphical browser like lynx.
The alt="alternate text" is optional.
<IMG SRC="graphics filename" ALT="alternate text">
.
If alt="graphic name", then the words "graphic name" will appear beside
the graphical marker.[IMAGE]. If alt="", nothing will be displayed.
If alt="graphic name", then the browser will display
graphic name.
Page Signature and Disclaimer
Examples of appropriate last update lines include:
Date Last Modified: September 26, 1996
Expiration Date: June 30, 1998
Updated each business day.
This page does not reflect an official position of Virginia
Commonwealth University.
Action #6: Finish Home Page
Putting Home Page on Saturn
goto-saturn
from the Unix prompt. If you use the UCS-AC menu, you need to
"quit" the menu (type 'q') to get to this prompt.
After you are done, type "menu" to get back into the menu or logout, as
desired.
To learn more about this process, please
visit the web page Moving to
the Saturn Computer System.
Simply enter the command
makeweb
chmod 644 [filename]
Accessing your Web Page
http://saturn.vcu.edu/~[userid]/[filename]
Publishing your Home Page
General Comments:
<B><I>Title 96</B></I>
Date Last Modified: October 6, 1998
Please send comments to Web Support