This paragraph is an HTML 3 Banner using the <BANNER> element. It shouldn't scroll with the rest of the document, but rather stay at the top of the window, or at least stay visible while the viewer is looking at this page.

The HTML 3.0 spec as expired and will be succeded by HTML 3.2 . This document may be updated sometime in the Future to refect 3.2, but as 3.2 actually dropped much of HTML 3.0's functionality due to lack of commitment from browser vendors, and the fact that HTML 3.2 still seems to be under scrutiny, it may not be soon.

This is a Level 1 heading in an HTML 3 Test Document

Feb 9, 1996

About this Document

The purpose of this document is (1) to get an idea of how certain HTML looks on all browsers by viewing this document with the browsers in question, and (2) to determine if new HTML tags, such as footnotes, text attributes, etc. are implimented in those browsers, mostly (2). Because this is a test document, there has been very little effort to provide for backward compatibility.

This document also tests styles, tested using the Beta-1e version of Arena (with a few problems.) The intent was to make the colors stand out, so the colors may be a bit garish.

The markup for these styles are at the very top of the document in the <HEAD> ; they shouldn't be visible in the document as text, but are in some browsers. If your browser doesn't support styles, you can still see what this page looks like by viewing a jpeg (40k) of this web page; note that because of the very tight compression of this file, the image is of low quality (but it's very net-friendly this way).

All of the HTML elements used here are found in the HyperText Markup Language Specification 3.0. Styles were written to the Cascading Style Sheet draft specification.

Headings

This is a Level 2 heading

This is a Level 3 heading

This is a Level 4 heading

This is a Level 5 heading
This is a Level 6 heading

This is a Level 7 heading..... Psyke! there is no level 7 heading.

This is a Level 4 heading using the " align=center " option

This is a Level 4 heading using the " align=right " option

This is a Level 4 heading using the " align=justify " option

Definition List

This is a list of WWW terms.

Home Page
A Starting point or center of an Infostructure.
HTTP
Hypertext Transfer Protocol = An efficient, stateless protocol used on the World Wide Web.
HTML
Hypertext Markup Language = the format in which web pages are written.
InfoStructure
A group of documents linked together on one or more information servers, usually providing information concerning a certain subject or idea.
This is the same thing in a "compact" format:

Home Page
A Starting point or center of an Infostructure.
HTTP
Hypertext Transfer Protocol = An efficient, stateless protocol used on the World Wide Web.
HTML
Hypertext Markup Language = the format in which web pages are written.
InfoStructure
A group of documents linked together on one or more information servers, usually providing information concerning a certain subject or idea.

Other Lists

HTML 3 brings us lot's of new things to do with lists. Here's where I test out some of those new attributes.

This tries out the SRC (source) attribute of unordered lists, which allows you to specify an image file, in this case, a gif file called m_bullet.gif ( ) to be used instead of the usual plain old bullet.

The following is a nested list using the PLAIN attribute, which is supposed to cause the list to be rendered without bullets.

Character Effects

Presentation Emphasis

This sentence is italic
This sentence is bold
This sentence is underlined
This sentence is in Strikethrough using < S > < /S > tags (this is HTML 3)
This Sentence is in Strikethrough text using the <strike></strike> tags This is only supported in a few browsers, and is not HTML.
This sentence is superscript <SUP> For contrast, this one isn't.
This sentence is subscript <SUB> For contrast, this one isn't.
This sentence is in a monospaced font (<TT>)
This sentence is in big text (<BIG>) For contrast, this one isn't.
This sentence is in small print (<SMALL>) For contrast, this one isn't.

Generic Emphasis

This sentence is in strong text
This sentence is in emphasized text

Logical Emphasis

This sentence is in " Short Quotation " text (as opposed to block quote) (<Q>)
This sentence is in Citation text (<CITE>)
This sentence is in " code " text (<CODE>)
This sentence is in " keyboard " text (keyboard text is something the user would be required to type) (<KBD>)
This sentence is in " variable " text, that is, text that would normally represent a variable of some sort (<VAR>)
Author - an authors name (<AU>)
Person - a person's name (<PERSON>)
Acronym (<ACRONYM>)
Inserted Text (as in for legal documents) (<INS>)
Deleted Text (as opposed to inserted) (<DEL>)

Notes and Admonishments

Notes are used for alerting people to possible problems. They are usually displayed with an accompanying graphics that are supplied by the browser (ie. they are internal to the browser and not specified in the web page.) The CLASS attribute specifies the type of note and therefore the type of graphic displayed. The recommended common classes are NOTE (<NOTE CLASS="NOTE">), CAUTION (<NOTE CLASS="CAUTION">), and WARNING (<NOTE CLASS="WARNING">).

This is a note:
Computers work best when plugged in.

This is a caution:
Super-Glue is not a child's toy

This is a warning:
Do not taunt the alligators

Graphics

The graphic section was too large, so it got it's own page.

Horizontal Rules

Often graphics are used in the place of Horizontal rules, but when viewed with a non-graphical browser (or a graphical one with images turned off,) the effect of a line is totally lost. Also, many of these images are being encapsulated in paragraph tags, which is not logical since the graphic is not a paragraph. HTML 3 allows the author to specify graphics in place of lines within the horizontal rule.

For example, the following is a graphic from the NPS home page:

and this is a normal Horizontal Rule:


By using this HTML code: <HR SRC="/images/line.gif" > an html 3 browser should be able to show the following as a graphic if images are on, or a horizontal rule if not:


Paragraph Alignment

The purpose of this section is to test for alignment in paragraphs. This is done using the "<P>" tag with the align option. For example, this paragraph is written to be centered using the <P align=center> tag.

In HTML 2.0, <P> tags are placed at the end of paragraphs. In the upcoming HTML 3.0, paragraph tags are paired, enclosing the text in <P> and </P> tags. By the way: this paragraph is written to be presented flush right using the <P align=right ></P> tag.

Another feature of the HTML 3.0 spec is that you can skip the </P> part and the browser is supposed to understand that the next <P> will be the beginning of the next paragraph. This paragraph is written to be fully-justified using the <P align=justify> tag.

Divisions

Divisions are generic containers that divide a document into, well, divisions (funny, that.) Divisions can also be used with the CLASS attribute to represent different logical sections such as chapters, abstracts, stuff like that. <DIV>'s can be used with the ALIGN="" attribute to align whole sections of text, which saves typing time as you don't have to align each element within. You can even have divisions inside of divisions.

I've run out of things to write in this document to provide examples for all of the HTML 3 elements, so I'm using something I've written for my departments bulletin. It's from a first draft, and the end result will probably have changed by the time it reaches the bulletin. This paragraph and the next are in a <DIV> that is center-aligned.

Have you ever had data in a format that you could not use? Perhaps you have sent a word processing file to another person, only to find it is useless to them because they do not have the same program as you. This happens a lot in the computer industry, and it could happen soon with HTML. Some corporations that make web browsers are introducing new tags that are not part of the standard, or even the proposed standard. Worse, they are ignoring very useful parts of the proposed HTML 3 standard to introduce nearly identical tags of their own. The effect is that some sites are serving pages that are "text-only", netscape-enhanced", and "mosaic-enhanced" versions of the same page.

These next three paragraphs are aligned to the right, as they are within a <DIV ALIGN=right>.

This is why I have sternly stuck to the standard published by W3C. Helping to keep uniformity on the web, by not putting browser-specific tags on a document, lets me know that I'm not part of the problem.

Good HTML needs to be written only once, in valid HTML. Tables can have paragraphs, headings, etc. inside so you don't need a separate version even for that.

Tables

Tables are probably the most used new feature in HTML 3. The following data is a table, the text in which is aligned in various ways:

miscellaneous Pet opinions I have
Type of Pet Friendly? Petable? Smart? Cool?
Cats Sometimes, not often Sometimes not really no, not unless you consider a snob cool
Dogs Yeah! Mostly sorta, of you call fetching sticks smart sorta, yeah.
Parrots If you're worth being friendly to some are sometimes too smart very much so
Fish well, they come when you have food nope. nope kinda

The "Cats" row didn't have any alignment specified. The "Dogs" row was horizontally centered (align=center) and vertically aligned to the top (valign=top.) The "Parrots" row was horizontally aligned to the right (align=right and not politically.) The "Fish" row was vertically aligned to the bottom (valign=bottom .) The blank rows were made using <TR> <TD> </TD> <TR>. Note that all of these tables were written to the March 95 HTML 3 draft; there is another draft for tables that may or may not make it into the final HTML 3 draft.

In order to test the "align=" attribute inside of the <TABLE> element, I've created a few more tables below. This time, instead of testing how text inside a table is aligned, we are testing how the entire table is aligned on the HTML page.

The following Table is written to be aligned to the center.( ALIGN=CENTER )

Center-Aligned Table
0 A B C
1 1A 1B 1C
2 2A 2B 2C
3 3A 3B 3C

The following Table is written to be aligned to the right.( ALIGN=RIGHT )

Right-Aligned Table
0 A B C
1 1A 1B 1C
2 2A 2B 2C
3 3A 3B 3C

The following Table is written to be fully justified.( ALIGN=JUSTIFY )

Justified Table
0 A B C
1 1A 1B 1C
2 2A 2B 2C
3 3A 3B 3C

Block Quotes

Block quotes went through two changes in HTML 3: the addition of a <CREDIT> element to allow the originator of the quote to be credited, and the shortening of the name from <BLOCKQUOTE> to <BQ>

The following is an HTML 3 blockquote:
"Education refines our ability to see more than the final statistics of a conflict or operation. It enables us to see war's lessons and the thinking of its masters, as well." -- Naval Doctrine Publication 1 Naval Warfare, Chapter 3, "How We Fight - Naval Warfare"

Footnotes

Footnotes are a new feature in Html 3.0. Basically, you put the marked text in regular anchor tags, with an href attribute, much like marking text for a link. For example, I marked the text associated with this footnote like so: <a href="#fn1">footnotes</a>. The foot note itself is enclosed in <fn id=(some id) > and </fn> tags. For example, I marked the text you are reading now like so: <fn id=fn1>Footnotes are ....soon in browsers <fn>. I hope footnotes are implemented soon in browsers.


Other HTML 3 Pages

In no particular order ...


-- E-Mail:ctaylor@nps.navy.mil mailto.gif