WWW Manual for the AIUB


by J.M.B.


(HTML Primer for the AIUB,

... and more - HPAM 1.15)

0. Table of content

  1. Introduction
  2. URLs and places for HTML documents
  3. HTML dialects and the general structure of HTML documents
  4. Empty tags
  5. Container tags
  6. Special characters
  7. Style Sheets
  8. Available set of icons
  9. Useful hints for creating good homepages
  10. Useful hints for webmastering
  11. Links for further information

1. Introduction

This document started as a translated cut of the German manual "Bedienungseinführung in die Computer der AI Bonn" internally available as GNU zipped PS file in the directory '~webstw/Manual' as 'aibonn97.ps.gz'. In my notation everything written in italic should be replaced by a proper text (e.g. 'username' by 'jbraun') and everything which is written in typewriter and embraced by 'quotation marks' can be typed in as source code for a World Wide Web (WWW, W3) document. The simple quotation marks (' ') mustn't be typed in, the double quotation marks (" ") have to be typed as is. If there is a choice in an option, the possibilities are given separated by a vertical bar ('|') - choose only one (and leave out the separation mark).
[WWW is one method (beneath E-Mail, File Transfer Protocol (FTP) etc.) to use the Internet, a global computer network.
The roots of the Internet are lying in the military network ARPANET, which started with 4 hosts end 1969 (to be compared with more than 28 thousand internet hosts in December 1987 and more than 16 million hosts in 1997). ARPANET was given up in March 1990.
CERN made the WWW techniques 'public domain' in April 1993.]
This document should help the members of the Astronomical Institutes of the Rheinische Friedrich-Wilhelms Universität Bonn (AIUB) to create own homepages, give some tricks and serve as a test for the browser YOU use.
As it is recommended to download this document to use it locally, you may visit the original version of this page at the URL:
http://www.astro.uni-bonn.de/~webstw/w3_man.html
to look for the latest version of HPAM.

2. URLs and places for HTML documents

Since 23rd November, 1996 the WWW address, called Uniform Resource Locator (URL), of the AIUB is no longer 'http://aibn55.astro.uni-bonn.de:8000' but 'http://www.astro.uni-bonn.de'.
Generally speaking, a URL consists out of three parts:
  1. The access method, normally specified by 'http:' which is the abbreviation for Hypertext Transfer Protocol. HTTP 1.0 is standard, but version 1.1 will be available soon (improvements: persistent connections, intelligent caching, digest authentication, virtual hosts) [the first internet draft on HTTP is dated July 1993]. Other alternatives for 'http:' are: The method is separated from the rest of the URL by the double slash '//'.

  2. The name of the computer or the Internet Protocol (IP) number (or E-Mail address etc. for special methods of accessing a server). Generally the computer name has a (normally three letter - for USA locations [in the "Memorandum of Understanding" (Geneva, May 1997), 7 new TLDs for the US are planned, which do not follow this convention], or two letter - for codes of other countries) suffix, the so called Top Level Domain (TLD), which should identify the organization running this server: The allocation of domains including the IP number blocks are currently done by the Internet Assigned Numbers Authority (IANA) and by Network Solutions (NSI), but will soon be shifted to the international organization Internet Corporation for Assigned Names and Number (ICANN).
    If not the standard port 80 is used, one has to add the port like ':8000'.
    This second token is separated by a slash '/' from the last part.
    [The Transmission Control Protocol (TCP) was published ('A Protocol for Packet Network Internetworking') by Bob Kahn and Vinton Cerf in May 1974, 4 years later the Internet Protocol (IP) is discussed;
    the concept of the Domain Name Service (DNS) was published by Paul Mockapetris as RFSs 882 and 883 in November 1983.]

  3. The path of the file. If this is not specified, the default 'index.html' is searched. Additionally to the file name one can link to an anchor in the given HTML (see chapter 3) document, with '#' as separation mark (see the container tag '<A>').
  To read the homepage of the user 'username' just set the URL
'http://www.astro.uni-bonn.de/~username'.
The pages of the Astronomical Institutes (AI) can be entered by the following web accounts set for 'username':
'webaiub':
web account of the Astronomical Institutes of the University of Bonn (AIUB; not necessary to specify it for the URL),
Webmaster: G. Lay   (room 2.23, E-Mail: glay@astro.uni-bonn.de);
'webstw':
web account of the Institute for Optical Astronomy (Sternwarte, including the Observatory Hoher List),
Webmaster: J.M. Braun   (room 3.08, E-Mail: jbraun@astro.uni-bonn.de);
'webrai':
web account of the Institute for Radio Astronomy,
Webmaster: C. Brüns   (room 1.14, E-Mail: cbruens@astro.uni-bonn.de);
'webiaef':
web account of the Institute for Astrophysics and Space Research,
Webmaster: M. Römer   (room 3.01, E-Mail: roemer@astro.uni-bonn.de);
'webgk':
web account of the Bonn/Bochum Graduiertenkolleg,
Webmaster: J.M. Braun   (room 3.08, E-Mail: jbraun@astro.uni-bonn.de).
If the links are made in the web pages of the institutes to a special user of the AIUB, the only thing for him to do is to make a directory 'public_html' in his home directory '~' (or making a link with the same name to a special HTML document, see the useful hints of chapter 9) and to create a text file 'index.html' with a general structure described in chapter 3 and HTML orders described in chapter 4, chapter 5 and chapter 6.

3. HTML dialects and the general structure of HTML documents

A WWW document is written in the HyperText Markup Language (HTML), which exists in multiple versions. To be sure that many browsers can display the desired results, one should use HTML 2.0 only. The latest generally supported standard version is HTML 3.2  [local AIUB link] with some enhancements (but not the interesting features like mathematical formulae, which should come up with HTML 3.0 - but the version 3.0 was supported only by the former W3C browser Arena). HTML 3.2 is the new standard (including all HTML 2.0 operations), because it is supported by many firms (IBM, Microsoft, Netscape Communications Corporation, Novell, SoftQuad, Spyglass, and Sun Microsystems), and first browsers are getting available (e.g. Netscape 4.0, which has some additional goodies like absolute positioning, layering and [cascading|Java script] style sheets, see chapter 7). The hottest version is HTML 4.0  [local AIUB link] which has become the new W3C Proposed Recommendation in November 1997, but we all have to wait for browsers using its enhancements.
All HTML tags & attributes together with the first Netscape Navigator/Communicator version which has implemented their functions are given in the local HTML Tag Reference and the local HTML - NN release - sheet by Netscape.
Overview on todays Browsers:

The concentration on Netscape (NN 1.0 was launched on 15. Dezember 1994) is due to the availability (since 31. March 1998 most parts can even be downloaded as sorce code, see the MOZILLA project) and amount of implemented functions, which made NN the number 1 webbrowser in sciences. The current release is 4.51 which seems to be as stable as 4.08, all other versions of 4.xx should not be used. The next real release after so many bugfixes is version 5, which will contain the new rendering engine 'gecko' and will fully support HTML 4.0, CSS 1.0 and 2.0, DOM, and XML - let's wait for the revolution to come in July '99 (as announced, more than 13 months later than I had expected) ...

This position was kept in the first WWW years by the graphical browser Mosaic (with its first release published in September 1993), but NCSA has stopped the development in January 1997 (i.e. no frame, style sheet or scripting support in the latest version).

Microsofts Internet Explorer (MS IE, version 1.0 emerging in mid 1995) is still not available for most Unix systems (until now only Solaris and HP-UX [SUN's and HP's UNIX derivates] were supported by IE 4.0 and 5.0 - no Linux, DEC Unix [formerly called OSF/1] or AIX [IBM's Unix derivate] version is available). Furthermore MS seems to have different thoughts about stability of programs and the keeping of standards (IE 5 still has problems with HTML 4.0, CSS and DOM). The use in the scientific community is thus extremely rare.

Amaya by the W3C was launched in February 1997 and is still in the phase of extreme development (basing on Thot), but may soon be the best browser available - the actual release 2.0a is more than interesting, with 95% HTML 4.0 support - it only lacks complete support of frames [who needs them anyway?] and a part of new features in tables and forms (next release: end of April '99). This test-bed browser/authoring tool of the W3C supports many platforms, keeps the given standards (which is not the case for all the above cited browsers, having advantages and disadvantages) and houses really new features: Amaya is also an editor, supports the first XML DTD Mathematical Markup Language - MathML (see the local W3C Recommendation) and can view a document in many ways, e.g. giving the structure of an HTML document (see the local Manual for V. 1.4a).

If the described browser situation changes, you will read it right that place. Personally I hope that one day in future we all can stop recommending special browsers; if you share this dream, you should look at the homepage of The Web Standards Project fighting for standards in our browsers since 10. August 1998!

HTML is an application of the Standard Generalized Markup Language (SGML), which was standardized in 1986 by the International Organization for Standardization (ISO 8879) for data and document interchange in open system environments. The formal specification of a markup language written in SGML is called Document Type Definition (DTD), so HTML is a SGML DTD (if you are wild about abbreviations).
[You may note that SGML has its own language to define the format: Document Style Semantics and Specification Language (DSSSL).]
Tim Berners-Lee (see also this link) invented HTML while at CERN, the European Laboratory for Particle Physics in Geneva [the proposal was dated March 1989 and the first draft on HTML 3. November 1992]. He is now the overall Director of the WWW Consortium (W3C, founded on 1. Oktober 1994 at the MIT), which is responsible for the evolution and standardization of HTML.
The latest version of PostScript (PS, see Adobe), called Level 3, will digest HTML documents. First devices understanding postscript level 3 will be available in mid 1997.

Future developments:

Coming back to present day worldwide information exchange, HTML has two groups of operators:

Most of these operators are used in the document body and fall in one of the following 2 cathegories: Note that text level elements never contain block level elements.

Generally, an HTML document should have the following structure:

<HTML>
<HEAD>
<TITLE>title_text</TITLE>
other_head_elements
</HEAD>
<BODY>
<!-- Here comes a commentary, afterwards the main document -->
main_text_with_HTML_orders
</BODY>
</HTML>

Even if most web browsers don't need this structure (e.g. a normal browser will get the '<HTML> </HTML>' information by the ending of the file name: '*.html' or '*.htm'), it is very advisable to build every document out of this skeleton. Feel free to use as many comments as you find useful to arrange your documents.
If you write an HTML 3.2 document, you must say '<!DOCTYPE ...>' as first element (i.e. before the '<HTML>'-tag, e.g. '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">' for the final version of HTML 3.2 or '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">' for the transitional version of HTML 4.0). Such an HTML 3.2 document also has to include exactly one title specification: '<TITLE>title_text</TITLE>'.

If you want to use frames (see container tag 'FRAMESET'), you must have a document with a special structure working together with normal HTML documents of the above structure.
Just try this frame document containing the following lines:

<HTML>
<HEAD>
<TITLE>WWW Manual, frame test</TITLE>
</HEAD>
<!-- Now the fame structure of the homepage 'w3_man_f.html' -->
<!-- Created: 16th February, 1997, last changes: 20th February, 1997 -->
<FRAMESET ROWS="270,*">
  <FRAME SRC="w3_man_h.html" SCROLLING="NO">
  <FRAMESET BORDERCOLOR="RED" COLS="33%,33%,*">
    <FRAME SRC="http://www.astro.uni-bonn.de/~webstw/" NAME="3rd floor">
    <FRAME SRC="http://www.astro.uni-bonn.de/~webrai/" NAME="2nd floor">
    <FRAME SRC="http://www.astro.uni-bonn.de/~webiaef/" NAME="1st floor">
  </FRAMESET>
</FRAMESET>
<NOFRAMES>
Your browser doesn't understand frame definitions.
Try with a Netscape browser (2.0 or higher)!
<BR>
Go back to the <A HREF="w3_man.html">WWW Manual</A>
for the Astronomical Institutes of Bonn.
</NOFRAMES>
</HTML>

Before going into details with special HTML commands, I want to make a remark about what is going on behind the scenes. Server (delivering data) and client (user agent - UA, or normally called 'browser', see above) are working together, so it is possible to run programs from one of these sides. A program running on the server is able to use the Common Gateway Interface (CGI), like forms (see the container tag 'FORM') and image maps via the option 'ISMAP' (see empty tag 'IMG'), while other programs like image maps via the option 'MAP' (see empty tag 'IMG') or Java scripts (see container tag 'SCRIPT') use the client.

4. Empty tags

Empty tags are single tokens out of a name in angle brackets ('<name>') with or without further options. These are namely:
'<ISINDEX>':
Indicates (with a special message, if one uses the option 'PROMPT="prompt_message"', which is a Netscape/HTML 3.0/3.2 special, or with the default message "This is a searchable index. Enter search keywords:") that the user agent (normally a CGI script of the used WWW server) should provide a single line text input field for entering a query string; employed in the container tag 'HEAD' - note that 'ISINDEX' is deprecated in HTML 4.0, so please use 'INPUT' for a single-line text input control;

'<BASE HREF="base_URL">':
Defines a special base URL 'base_URL' (normally not necessary, the default is the URL of the document); employed in the container tag 'HEAD';

'<META>':
Supplies meta info as name/value pairs describing properties of the document, e.g. '<META HTTP-EQUIV="Expires" CONTENT="Tue, 20 Aug 1996 14:25:27 GMT">'; employed in the container tag 'HEAD';

'<LINK>':
Defines relationships with other documents, e.g. '<LINK REL="Chapter" REV="Contents" HREF="chapter2.html">'; employed in the container tag 'HEAD'; this HTML 2 tag is oftenly used to embed a style sheet (see chapter 7), e.g. '<LINK REL="stylesheet" HREF="name.css" TYPE="text/css" MEDIA="screen">', or to give search engines additional information about related documents, e.g. '<LINK MEDIA="print" TITLE="Docu_in_PS" TYPE="application/postscript" REL="alternate" HREF="WWW_URL">';

'<P>':
Beginning of a new paragraph (for HTML 3.0/3.2 or higher one can use '</P>' as delimiter and one can use further options like 'ALIGN="RIGHT|CENTER|LEFT"',

so you can write right,

centered and

left [default] aligned paragraphs);

'<BR>':
Forcing a linebreak - normally this is made automatically by the used browser. In HTML 3.0/3.2 one can give the option 'CLEAR="LEFT|RIGHT|ALL"' to specify whether text should flow around images (see 'IMG') on left/right/both margin(s);

'<HR>':
Horizontal ruler to seperate text. With Netscape or an HTML 3.2 browser one can use the options 'SIZE' to define the thickness and 'WIDTH' to define the length of the line in pix. You can also use the options 'ALIGN="LEFT|RIGHT|CENTER"' for the alignment and 'NOSHADE' for the use of one single color. Don't use '<P>' and '<HR>' together, that would be bad HTML style;

'<WBR>':
Introducing a place were line break is allowed (not forced as by 'BR'), normally used in the 'NOBR' environment - NN 1.1 special;

'<LI>':
Defines a list element (possible options are depending on the special list type, see the container tags 'DIR', 'MENU', 'OL' and 'UL' for the different types of lists);

'<DT>':
Definition term (1st element of container tag 'DL', see empty tag 'DD');

'<DD>':
Definition description (2nd element of container tag 'DL', see empty tag 'DT');

'<IMG SRC="picture_name" ALIGN="TOP|MIDDLE|BOTTOM" ALT="[text_instead_of_picture]">':
Displays the GIF (graphics interchange format) or JPEG (joint photographic experts group) picture 'picturte_name' with the specified alignment or the '[text_instead_of_picture]' if one uses a text browser or force not to display any picture. In HTML 3.2, one can make an image map by giving the option 'USEMAP="#map_name"' and defining the areas and links by the container tag 'MAP' and the empty tag 'AREA' (the older 'ISMAP' option, an operation of the server, should no longer be used). In HTML 4.0 the new option 'LONGDESC' can be used to give an URL to a long description of the image and the 'ALT' option is always required;

'<FIG SRC="picture_name">':
Displays the GIF (graphics interchange format) or JPEG (joint photographic experts group) picture 'picturte_name', options (and function) like the empty tag 'IMG' (but additionally with the possibility to overlay other graphics) - only defined in HTML 3.0, so use 'IMG' instead;

'<AREA HREF="linked_URL" ALT="help_text" SHAPE="shape_of_area" COORDS="coord_values">':
Defines an area of shape 'shape_of_area' out of 'DEFAULT' (specifying the entire region; HTML 4.0 addition), 'RECT' (Default), 'CIRCLE' or 'POLY' with coordinates 'coord_values' (in the notation: 'left_x, top_y, right_x, bottom_y' for 'RECT', 'center_x, center_y, radius' for 'CIRCLE' or 'x_1,y_1, x_2,y_2, x_3,y_3, ...' for 'POLY' with 'x,y' in pix or per cent if used with the suffix '%') of an image embedded by 'IMG' as a link to the URL 'linked_URL' (or to nothing if one uses 'NOHREF' instead of 'HREF' to cut a hole in the underlying hot zone) with the text label 'help_text', the option 'TABINDEX' can get a value between 0 and 32767 specifying the position in the tabbing order and 'ACCESSKEY' sets a single character to give focus to an element (beneath 'AREA' this option is also applicable to 'A', 'BUTTON', 'INPUT', 'LABEL', 'LEGEND', and 'TEXTAREA'; 'AREA' is used in the HTML 3.2 container tag 'MAP' (in HTML 4.0 the 'ALT' option is always required);

'<INPUT TYPE="text" NAME="name" SIZE="45">':
Creates an input field with a specific type, name and size in characters (here 45), see the container tag 'FORM';

'<INPUT TYPE="radio" NAME="choice" VALUE="remark">':
Creates a button and deliver 'remark' if choosen, see the container tag 'FORM';

'<INPUT TYPE="submit">':
Creates a button to submit the form, see the container tag 'FORM';

'<INPUT TYPE="reset">':
Creates a button to erase all given entries of a form, see the container tag 'FORM';

'<OPTION>item_text':
Defining an item in a selection list on an HTML form (with the attribute 'SELECTED' specifying a pre-selected item), see the container tags 'SELECT' and 'FORM' (note that there can be an optional end tag);

'<KEYGEN NAME="name" CHALLENGE="challenge">':
Facilitates the generation of key material and submission of the public key as part of an HTML form suited for web-based certificate management systems, see the container tag 'FORM' - NN 1.0 special;

'<TR>':
Introduces a table row (line) with horizontal/vertical alignment options 'ALIGN="LEFT|CENTER|RIGHT"' and 'VALIGN="TOP|MIDDLE|BOTTOM"', see the container tag 'TABLE' - HTML 3.0/3.2 (in HTML 4.0, the end tag is optional);

'<TD>':
Introduces a table data cell. If a cell should span more than one column or row one can use the options 'COLSPAN' or 'ROWSPAN', to set the alignment use the options 'ALIGN' with 'LEFT' (Default), 'CENTER' or 'RIGHT' and 'VALIGN' with 'BOTTOM', 'MIDDLE' (Default) or 'TOP', to suppress word wrapping say 'NOWRAP' (i.e. automatical use of '&nbsp;' between words of a cell) and in purpose of giving the absolute size of the cell try 'HEIGHT' and 'WIDTH' [you can choose the background color of cells when viewed with Netscape 3.0 / Internet Explorer 2.0 by 'BGCOLOR', see container tag 'BODY'], see the container tag 'TABLE' (in HTML 4.0, the end tag is optional);

'<TH>':
Introduces a table header cell; one can use the options introduced for the tag '<TD>' above, see also the container tag 'TABLE' (in HTML 4.0, the end tag is optional);

'<COLGROUP>':
Creating an explicit column group, e.g. specifying the width of 40 columns by: '<COLGROUP SPAN="40" WIDTH="20"></COLGROUP>' (the 2nd tag is optional), see the 'COL' tag - new HTML 4.0 empty/container tag employed in the container tag 'TABLE';

'<COL>':
Groups together attribute specifications for table columns (e.g. via the attributes 'SPAN' and 'WIDTH' or by using them as anchors for style sheet definitions (see chapter 7) - new HTML 4.0 empty tag employed in the container tag 'COLGROUP';

'<SPACER TYPE="HORIZONTAL|VERTICAL|BLOCK" SIZE="n">':
Inserts horizontal/vertical/both space of 'n' pix for absolute positioning, like this space of 32 pix between the two normal quotation marks:
'' - Netscape 3.0 special;

'<PARAM NAME="param_name" VALUE="param_value">':
Gives parameter 'param_name' with the value 'param_value' to a Java Applet, see the HTML 3.2 container tag 'APPLET', also used in combination with 'OBJECT' tag (note that only ``children'' will feed their information) - NN special and new HTML 4.0 tag;

'<FRAME SRC="URL_of_embedded_HTML_document">':
Gives the URL 'URL_of_embedded_HTML_document' of the HTML document, which should be loaded in the current frame introduced by the embracing container tag 'FRAMESET'. Other options available are 'SCROLLING="YES|NO|AUTO"' to enable/disable scrolling in the frame, 'NORESIZE' to prohibit the user from changing the frames size, 'NAME' to specify a name of the current frame and 'MARGINWIDTH' and 'MARGINHEIGHT' to give the size of the borders of the frame [in Netscape 3.0 one can choose the color of the frame border by 'BORDERCOLOR', see container tag 'BODY', in HTML 4.0 the new option 'LONGDESC' can be used to give an URL to a long description of the frame] - Netscape special and new HTML 4.0 tag.

5. Container tags

Container tags consist of two tokens, one introducing and the other deliminating the operation. The 1st token can include options, the 2nd token has a slash '/' in front of its name but no options. Here comes the (complete ?) list:
'<HTML>main_document</HTML>':
Declares the file as an HTML document (see chapter 3), with possible options 'LANG' specifying the language, e.g. 'en' [for English], 'en-US', 'en-cockney', 'de' [German], 'nl' [Dutch], 'it' [Italian], 'fr' [French], 'es' [Spanish], 'i-navajo', 'x-klingon' ['x' for experimental language], and 'DIR' specifying the base direction of directionally neutral text, i.e. 'LTR' (default: left to right) or 'RTL';

'<HEAD>head_of_the_document</HEAD>':
Declares the head of the document where one can set a title with the container tag 'TITLE' or use other head elements, namely the container tags (see chapter 5) 'STYLE' and 'SCRIPT' and the empty tags (see chapter 4) 'ISINDEX', 'BASE', 'META' and 'LINK' (see chapter 3);

'<TITLE>title_text</TITLE>':
Sets the title of the HTML document, which is displayed by the browser - this command is used in the container tag 'HEAD';

'<STYLE> <!-- style_definition_text --> </STYLE>':
Reserved for use with style sheets (see chapter 7); employed in the container tag 'HEAD' (note that the commentary tags are to stop older browsers [e.g. NN < 4.01 or IE < 3.01] from displaying the style sheed code and that the tag is not defined in HTML 3.2!);

'<SCRIPT LANGUAGE="JavaScript"> <!-- Java_Script_program_code //--> </SCRIPT>':
Embedding client-side JavaScript code (or another specified scripting language) 'Java_Script_program_code' for all Java enabled browsers (NN 1.0/3.0 special; for future versions of HTML, not defined in HTML 3.2, but marked as reserved; in HTML 4.0 the option 'LANGUAGE' had been marked as deprecated and should be replaced by the option 'TYPE', e.g. giving the value 'text/javascript'); this tag is employed in the container tag 'HEAD';

'<NOSCRIPT>alternative_text</NOSCRIPT>':
Giving 'alternative_text' for browsers not supporting JavaScript (not implemented or not activated), employed in the container tag 'BODY' - NN 3.0 special and new HTML 4.0 tag;

'<SERVER>JS_appl</SERVER>':
Embedding server-side JavaScript statements that are used in a JavaScript application on the server (see the local Netscape Manual "Writing Server-Side JavaScript Applications") - NN 1.0 special;

'<BODY>main_document</BODY>':
Declares the main part of an HTML document (see chapter 3). In the first (i.e. starting) tag you can use options for Netscape or an up-to-date HTML 3.2 browser to control the displayed colors of the text by 'TEXT', of the background by 'BGCOLOR', of a normal link by 'LINK', of a used link by 'VLINK' and of an active link by 'ALINK', each value given in HEX in red-green-blue notation, e.g. to get black-gray-yellow-red-green combination just type in '<BODY TEXT="#000000" BGCOLOR="#BBBBBB" LINK="#FFFF00" VLINK="#AA0000" ALINK="00AA00">'. Instead of the color codes you can use the following names:
'BLACK' corresponding to '#000000',
'SILVER' corresponding to '#C0C0C0',
'GRAY' corresponding to '#808080',
'WHITE' corresponding to '#FFFFFF',
'MAROON' corresponding to '#800000',
'RED' corresponding to '#FF0000',
'PURPLE' corresponding to '#800080',
'FUCHSIA' corresponding to '#FF00FF',
'GREEN' corresponding to '#008000',
'LIME' corresponding to '#00FF00',
'OLIVE' corresponding to '#808000',
'YELLOW' corresponding to '#FFFF00',
'NAVY' corresponding to '#000080',
'BLUE' corresponding to '#0000FF',
'TEAL' corresponding to '#008080',
'AQUA' corresponding to '#00FFFF'.
Without these options each browser takes default colors. If you want to play with colors, just use my small Java example. To use a (automatically repeated) picture as background just type the option 'BACKGROUND="name_of_picture"' (please note that all color and background defining options are deprecated in HTML 4.0 and should be replaced by style sheets);

'<Hx>header_text</Hx>':
Makes a header with charactersize 'x' - '1' for the greatest and '6' for the smallest characters. The option 'ALIGN="CENTER"' can be used to create centered headings. Before and after its use an automatical line break is set;

'<BASEFONT SIZE="5"> ... </BASEFONT>':
Setting the base font size (here '5', values: '1' - '7', default: '3'), employed in the container tags 'HEAD' and 'BODY' - NN 1.0/1.1 special, deprecated in HTML 4.0 (see the 'FONT' tag);

'<FONT SIZE=[+|-]1|2|3|4|5|6|7>text</FONT>':
Chooses the size of the text (absolute or relative to the used character size defined by 'BASEFONT') and color (with option 'COLOR=RRGGBB' in hexadecimal red-green-blue - code, see '<BODY>') [you can choose the special font (if available on the system of the viewer) and some alternatives by the option 'FACE' with Netscape 3.0 / Internet Explorer 2.0, e.g. this text in Times New Roman (or Helvetica or standard) font by '<FONT FACE="Times New Roman,Helvetica">'], - Netscape / HTML 3.2 special - nowadays these settings should be declared via CSS, see chapter 7;

'<MULTICOL COLS="n">col_text</MULTICOL>':
Breaks the text 'col_text' into 'n' columns, the options 'WIDTH' and 'GUTTER' can be used instead of the automatic choice of the size and space between the columns - Netscape 3.0 special.
Is this (mad) text, gshasasah uwidiaa llldd lldsds lioldlds lldsl dl ld leldsd kKssaj kjahsh jhd J Hs jjdsjdjs kk JHJHSJDGZ llsa lls llasa llleffefl ll ll fefeox llde lllf llferropwm ldk dJhdsu fdfdk lklf l l feof oorioer dhffueuwegxcv JjhhdJDjfjffJ JJHJd dsdds d dskdjskj kkdsiwi dwdie iidewhidieih iihf ifhie iiesd Ihifefhi hHdjd, written in 4 columns?

'<MARQUEE BEHAVIOUR="SLIDE|SCROLL|ALTERNATE" DIRECTION="LEFT|RIGHT" LOOP="n">scrollable_text</MARQUEE>':
Marking text 'scrollable_text' by moving it in the specified manner/direction 'n' times ('-1' or 'INFINITE' for infinity), the options 'SCROLLAMOUNT' and 'SCROLLDELAY' could be used to give the step size and time, the options 'HEIGHT', 'WIDTH' and 'BGCOLOR' set the hight, width (in pix or per cent) and background color (see container tag 'BODY'), 'this text should scroll' - Internet Explorer 2.0 special;

'<CENTER>centered_text_or_pictures</CENTER>':
Displays the embraced items
centered
in the active line - Netscape / HTML 3.2 special (deprecated in HTML 4.0, so use the equivalent '<DIV ALIGN="CENTER">' instead);

'<DIV>structured_text</DIV>':
Structures a text, for alignment use the option 'ALIGN="RIGHT|CENTER|LEFT"' - HTML 3.0/3.2 special, so the container tag 'CENTER' should be replaced by '<DIV ALIGN="CENTER"> ...'; this block-level element is oftenly used to put style to a text block (see chapter 7);

'<SPAN>structured_text</SPAN>':
No opearation (NOP) command for all user agents, oftenly used to put style to an inline text (see chapter 7) - new HTML 4.0 command [remember that all browsers not familiar to this command will simply ignore it - so even they do the right thing ;-)];

'<B>text</B>':
Writes the text in boldface;

'<I>text</I>':
Writes the text in italics;

'<U>text</U>':
Underlining the text - nowadays it is better to use this function via CSS (see chapter 7), e.g. '<SPAN STYLE="text-decoration: underline">text</SPAN>';

'<BLINK>text</BLINK>':
Makes the text blinking; this command should not be used further, so use'<SPAN STYLE="text-decoration: blink">Blinking_Text</SPAN>' instead (e.g. for NN 4.x and higher, see chapter 7);

'<TT>text</TT>':
Writes the text in typewriter (not proportional);

'<S>text</S>':
Striking through the text (HTML 3.0/4.0 command, will replace the older container tag 'STRIKE'); nowadays it is better (i.e. this tag is deprecated in HTML 4.0) to use this function via CSS (see chapter 7), e.g. '<SPAN STYLE="text-decoration: line-through">text</SPAN>';

'<STRIKE>text</STRIKE>':
Striking through the text (Netscape / HTML 3.2 special, should be replaced by the container tag 'S'; if you want to use this style, say: '<STRIKE><S>text</S></STRIKE>');

'<BIG>text</BIG>':
Enlarges the font size of the text (HTML 3.0 command);

'<SMALL>text</SMALL>':
Writes the text in a smaller size (HTML 3.0 command);

'<SUB>text</SUB>':
Writes the text as subscript, i.e. lower and smaller (HTML 3.0 command);

'<SUP>text</SUP>':
Writes the text as superscript, i.e. higher and smaller (HTML 3.0 command);

'<EM>text</EM>':
Emphasizes the text - for most browsers this means italic;

'<STRONG>text</STRONG>':
Writes the text strong - for most browsers this means boldface;

'<CITE>quotation_text</CITE>':
Marks the text as a quotation - for most browsers this means italic;

'<DFN>definition_text</DFN>':
Marks the text as a definition;

'<CODE>program_code_text</CODE>':
Marks the text as program code, for most browsers this means typewriter;

'<SAMP>sample_output_text</SAMP>':
Marking text as sample output from programs, scripts etc., for most browsers this means typewriter;

'<KBD>user_typed_text</KBD>':
Marks the text as typed by the user, for most browser this means typewriter;

'<VAR>variable_text</VAR>':
Marking the text as variables or command arguments, for most browser this means italic;

'<Q>quotation_text</Q>':
Marks the text (inline content) as a quotation, with 'quotation_text' beeing a short quotation text without paragraph breaks, which should (if supported) be rendered with delimiting quotation marks (thus left out by authors using this tag), see also the 'BLOCKQUOTE' tag - new HTML 4.0 tag;

'<BLOCKQUOTE>quotation_text</BLOCKQUOTE>':
Marks the text (block-level content, thus suited for long quotations including paragraph breaks) as a
quotation,
displayed normally as an indented block (note that the usage of 'BLOCKQUOTE' to indent text is deprecated in favor of style sheets, see chapter 7), see also the new HTML 4.0 tag 'Q';

'<ABBR>abbreviation</ABBR>':
Indicating abbreviations (see also the 'ACRONYM' tag) - special HTML 4.0 command;

'<ACRONYM>acronym_name</ACRONYM>':
Marks the text as an acronym with the possible options 'TITLE' giving text to which the acronym expands and 'LANG' specifying the language (e.g. 'FR' for French and 'EN-US' for US-English acronyms), e.g. '<ACRONYM TITLE="World Wide Web">WWW</ACRONYM>', special HTML 4.0 command;

'<ADDRESS>address_text</ADDRESS>':
Marks the text as an
address,
the way (alignment, font etc.) this 'address_text' is displayed depends on the used browser;

'<INS>inserted_stuff</INS>':
Mark a text passage, a whole table etc. as new inserted text (also datable via the option 'DATETIME="1994-11-05T08:15:30-05:00"'), usually used together with 'DEL' to mark the old text, e.g. HTML 3.24.0 is the new standard - new HTML 4.0 tag;

'<DEL>inserted_stuff</DEL>':
Marking a text passage, a whole table etc. as old text, usually used together with 'INS' to mark the new text - new HTML 4.0 tag;

'<NOBR>text</NOBR>':
Forces the text to be displayed without line breaks (NN 1.1 special), see empty tag 'WBR';

'<BDO DIR="LTR|RTL">text</BDO>':
Turning of bidirectional algorithm for selected fragments of text and specifying the direction ``left-to-right'' or ``right-to-left'' (note that the 'DIR' attribute can be associated like the language attribute 'LANG' to many HTML tags) - new HTML 4.0 tag;

'<OL>list</OL>':
Creates an ordered list - the list elements are introduced by the empty tag 'LI' with the following options for the different "numberings":
  1. (i.e. arabic numbers) by 'TYPE="1"',
  2. (i.e. lower alpha) by 'TYPE="a"',
  3. (i.e. upper alpha) by 'TYPE="A"',
  4. (i.e. lower roman) by 'TYPE="i"',
  5. (i.e. upper roman) by 'TYPE="I"',
  6. (i.e. arabic numbers starting with a special value, here '30') by 'TYPE="1" VALUE="30"';

'<UL>list</UL>':
Creating an unordered list - the list elements are introduced by the empty tag 'LI' with the following options for leading symbols:

'<MENU>list</MENU>':
Creates an unordered list (similar to 'UL', but more compact), the list elements are introduced by the empty tag 'LI' - depracated in HTML 4.0, please use 'UL' instead;

'<DIR>list</DIR>':
Creating an unordered list for list elements with less than 20 characters - the list elements are introduced by the empty tag 'LI' - depracated in HTML 4.0, please use 'UL' instead;

'<DL>list</DL>':
Creates a definition list - the definition term is introduced by the empty tag 'DT', the definition description is introduced by the empty tag 'DD';

'<A HREF="URL_address">text</A>':
Makes an anchor out of 'text', i.e. a link to the given URL (in HTML 4.0 the option 'TITLE', which can be set on virtually every element not only 'A', can be used to offer additional advisory information);

'<A NAME="anchor_name">text</A>':
Defining a target location (e.g. a title of a chapter of an HTML text) in a document; please note that you can create such anchors by this 'A' command or by specifying the 'ID' attribute (new in HTML 4.0) to an HTML tag (all allowed except 'BASE', 'HEAD', 'HTML', 'META', 'SCRIPT', 'STYLE' and 'TITLE');

'<A HREF="#anchor_name">text</A>':
Links to a target location in the same document (if it would be in another document, one has to specify the URL in front of the '#'), see the previous command for the creation of such anchors;

'<PRE>text</PRE>':
Treats 'text' as preformatted text, i.e. all spaces and line breaks will appear as they are, useful to make tables or graphics out of text (in former times -before the definition of 'PRE'- one had to use the container tags 'XMP', 'LISTING' or 'PLAINTEXT' instead);

'<FORM>form_text_with_special_operations</FORM>':
Switching to form mode where one can use special form commands like 'INPUT', 'OPTION', 'SELECT' and 'TEXTAREA', etc. - frequently used options are 'METHOD="POST"' and 'ACTION="mailto:username@astro.uni-bonn.de"';

'<SELECT ...>select_defs</SELECT>':
Defining a selection list (where the user can select one or - with the 'MULTIPLE' attribute given - several options at a time) on an HTML form with items defined in 'select_defs' via the empty tag 'OPTION', see container tag 'FORM';

'<OPTGROUP ...>select_defs</OPTGROUP>':
Defining groups of options defined in 'select_defs' via the empty tag 'OPTION' in a form selection list, see the container tags 'SELECT' and 'FORM' - note that future versions (i.e. > 4.0) of HTML may extend the grouping mechanism to allow for nested groups (i.e., 'OPTGROUP' elements may nest) - HTML 4.0 special;

'<TEXTAREA NAME="name" ROWS="15" COLS="60"></TEXTAREA>':
Creates an input area of multiple lines (here 15 with 60 columns each) used in the container tag 'FORM';

'<LABEL FOR="identifier">label_text</LABEL>':
Attaching information to a single form control (which carries the attribute 'ID="identifier"' to determine the association, e.g.
    <FORM ACTION="http://somesite.com/prog/adduser" METHOD="post">
      <P> 
      <LABEL FOR="firstname">First name: </LABEL>
                <INPUT TYPE="text" ID="firstname"><BR>
      <LABEL FOR="lastname">Last name: </LABEL>
                <INPUT TYPE="text" ID="lastname"><BR>
      <LABEL FOR="email">email: </LABEL>
                <INPUT TYPE="text" ID="email"><BR>
      <INPUT TYPE="radio" NAME="sex" VALUE="Male"> Male<BR>
      <INPUT TYPE="radio" NAME="sex" VALUE="Female"> Female<BR>
      <INPUT TYPE="submit" VALUE="Send"> <INPUT TYPE="reset">
      </P>
    </FORM>
using 'LABEL' for specification of an input field) - new HTML 4.0 command employed in the container tag 'FORM';

'<FIELDSET>form_definition_text</FIELDSET>':
Grouping thematically related controls and labels of an HTML form - new HTML 4.0 command employed in the container tag 'FORM';

'<LEGEND>caption_text</LEGEND>':
Assigns the caption 'caption_text' to a group of controls and labels of an HTML form - new HTML 4.0 command employed in the container tag 'FIELDSET';

'<BUTTON>button_def</BUTTON>':
Creating buttons in forms like 'INPUT', but with richer rendering possibilities ('button_def' may be text and or images embedded by the 'IMG' tag [but no image maps]) - new HTML 4.0 command employed in the container tag 'FORM';

'<MAP NAME="map_name">area_and_link_definitions</MAP>':
Creates an image map named 'map_name' with definitions 'area_and_link_definitions', see the empty tags 'IMG' and 'AREA' - special HTML 3.2 operation;

'<TABLE>table_text_with_special_operations</TABLE>':
Switches to table mode (HTML 3.0/3.2) where one can use special commands like 'CAPTION', 'TR', 'TD' and 'TH'. The new option 'SUMMARY="large_explicative_text"' should always be used to support people using speech or Braille-based user agents. To specify the width of the border lines, use the option 'BORDER="x"' (Default: 'x' = '0', i.e. no borders around the table or the cells), to give the vertical size of the table (in pix or per cent '%'), try the parameter 'WIDTH', the alignment is set with 'ALIGN="LEFT|CENTER|RIGHT"' and the spacing by 'CELLSPACING' and 'CELLPADDING'.
Simple example:

table_caption
header_col1 header_col2 header_col3
header_row1 data_1,1 data_1,2 data_1,3
header_row2+3 data_2,2+3 ..............
data_3,1 data_3,2 data_3,3

generated by:

<TABLE BORDER="3" SUMMARY="This is just a small table example.">
  <CAPTION>table_caption</CAPTION>
  <TR> <TH> <TH> header_col1 <TH> header_col2 <TH> header_col3
  <TR> <TH> header_row1 <TD ROWSPAN="2" VALIGN="TOP"> data_1,1
       <TD> data_1,2 <TD> data_1,3
  <TR> <TH ROWSPAN="2"> header_row2+3
       <TD COLSPAN="2"> data_2,2+3 ..............
  <TR> <TD> data_3,1 <TD> data_3,2 <TD ALIGN="RIGHT" BGCOLOR="RED"> data_3,3
</TABLE>

Just try own examples;

'<CAPTION>table_caption_text</CAPTION>':
Defines the caption of a table (i.e. 'table_caption_text') and with 'ALIGN="TOP|BOTTOM"' the position above or below the table (HTML 3.0/3.2);

'<THEAD>row_group_defs</THEAD>',
'<TFOOT>row_group_defs</TFOOT>' and
'<TBODY>row_group_defs</TBODY>':
Grouping together table rows ('row_group_defs' must contain at least one row defined by 'TR') into a table head, a table foot and one or more table body sections (note the order: ``'TBODY' definition(s) must be given at last'', and that the end tags are optional; thus in scrolling and printing of huge tables the head and foot [containing information about the table's columns] can always be shown) - new HTML 4.0 container/empty tags employed in the container tag 'TABLE';

'<APPLET CODE="applet_file_name">Java_applet_parameter_definitions</APPLET>':
Embedding a Java Applet of name 'applet_file_name' for all Java enabled browsers (NN 2.0/3.0 special and HTML 3.2); further options are 'ALT' to specify an alternative text for browsers understanding 'APPLET' but not beeing able to run a Java Applet, 'HEIGHT' and 'WIDTH' to give the size of the display area of the applet in pix and 'ALIGN="LEFT|CENTER|RIGHT"' for the alignment; the 'Java_applet_parameter_definitions' stands for possible single tags 'PARAM' - note that the use of 'APPLET' is deprecated (with all its attributes) in HTML 4.0 in favor of 'OBJECT';

'<EMBED ...> ... </EMBED>':
Displays output from a file that is executed by a plug-in as part of the HTML document in a rectangular area of the page - NN 2.0 special;

'<NOEMBED>alternative_text</NOEMBED>':
Giving 'alternative_text' for browsers not able to display content from plug-in programs specified by the 'EMBED' tag - NN special;

'<OBJECT CLASSID="URI">alternative_text</OBJECT>':
Controlling whether data should be rendered externally or by some specified program (here via the 'URI'), that renders the data within the user agent (if this cause a problem, then the 'alternative_text' is displayed instead) - special HTML 4.0 command;

'<FRAMESET>frame_definition_text</FRAMESET>':
Divides Web pages into multiple, scrollable regions to embed multiple HTML documents. A basic frame document has the normal structure with the body of the document replaced by a frameset region (see end of chapter 3). There one can use this container tag 'FRAMESET' with 'frame_definition_text' consisting of the empty tag 'FRAME' and possibly other (nested) 'FRAMESET' operations. With the options 'COLS' and 'ROWS', you can specify the width and height of a frame (in pix, per cent '%' or filling the rest of the page '*').
Even if most "professional" homepages make use of frames, there are many disadvantages: You must use one of the few browsers wich support frames (see container tag 'NOFRAMES'), you can't easily go back/forward in a frame document in the usual way, blind people have severe problems with frames (please be kind), and the transferred data amount is not getting less - originally the reason for introducing frames [in Netscape 3.0 one can choose the color of the frame border by 'BORDERCOLOR', see container tag 'BODY'] - Netscape special and new HTML 4.0 tag;

'<NOFRAMES>help_HTML_text</NOFRAMES>':
Implementing help for people using browsers without frame support. The 'help_HTML_text' include HTML operations, which are ignored by a browser which knows frames but are displayed by any other browser - if you want to use frames, don't forget to give here at least a message that one should use a frame supporting browser (Netscape and HTML 4.0 special);

'<IFRAME SRC="URL_of_embedded_HTML_document" WIDTH="400" HEIGHT="500" SCROLLING="auto" FRAMEBORDER="1">alternative_text</IFRAME>':
Specifying an inline frame and 'alternative_text' if the browser does not support frames (this tag is similar to 'OBJECT', see also the empty tag 'FRAME') - new HTML 4.0 tag;

'<LAYER ID="layer1" TOP="20pt" LEFT="5pt" BGCOLOR="#CC00EE" WIDTH="200">text_passage</LAYER>':
Combining a 'text_passage' (e.g. out of several 'P'-blocks) to a layer for exact positioning (here giving the layer an identifier, background color and width of 200 pixels); this NN 4.0 special should better be expressed via CSS properties 'position' (value: 'absolute|relative|static|fixed'), 'top', 'left', 'background-color', 'border-width', 'border-color' and 'width' (see chapter 7);

'<ILAYER>text_passage</ILAYER>':
Function like the above 'LAYER' tag, but this layer follows the natural flow of the page - NN 4.0 special;

'<NOLAYER>alternative_text</NOLAYER>':
Giving 'alternative_text' for browsers not supporting 'LAYER' and 'ILAYER' (this makes sense when the layer concent is specified via the 'SRC' option, so 'text_passage' is empty) - NN 4.0 special;

'<MATH>mathematical_text_with_special_operations</MATH>':
Switches to formula mode (HTML 3.0, not in HTML 3.2 or 4.0!) where one can use special math-commands like 'SUB', 'SUP', 'OVER', 'TEXT', etc. - this was intended to get the standard, but only the former W3C test-bed browser Arena supported this tag; now this tag should be used to embed the XML DTD MathML (specified via the 'META' tag in the header, see example below; see also the local W3C specs) in HTML documents, e.g.:
   ...
   <META Content-math-Type="text/mathml">
   ...
   <DIV ALIGN="CENTER"><MATH>
     <msup><mi>x</mi><mn>2</mn></msup><mtext>,</mtext>
     <mspace/ width="2em"><mi>α</mi><mo>=</mo><mn>0.4</mn>
     <mrow>
        <munder>
           <mo> ( </mo>
        </munder>
        <mfrac>
           <mi> a </mi>
           <mi> b </mi>
        </mfrac>
        <mover>
          <mo> ) </mo>
        </mover>
     </mrow><mtext>,</mtext>
     <mrow>
        <mi> x </mi>
        <mover>
           <mo> → </mo>
           <mtext> maps to </mtext>
        </mover>
        <mi> y </mi>
     </mrow>
   </MATH></DIV>
   ...
testing your browser:
x2, α=0.4 ( a b ) , x → maps to y
result of the new W3C test-bed browser Amaya 1.3 as picture:
[Math Result]
and programs for converting LaTeX documents to MathML are already available.

6. Special characters

For some characters have special meanings in HTML ('"', '&', '<', and '>'; never type these ASCII characters directly for usage in text but only in HTML commands) and to make characters of foreign languages (like the German Umlaute, 'ä' etc.) available in HTML, one can use tokens with a leading ampersand and a finishing semicolon. In case of a '#' followed by a number (160-255), it refers to an ISO Latin-1 character [or 8859-1-] code. Using the code is more secure for most signs, cos the names are mostly Netscape / HTML 3.2 specials (e.g. use '&#160;' instead of '&nbsp;'), except the first four in the list ('&quot;', '&amp;', '&lt;', and '&gt;') and some characteres for foreign languages (like '&ouml;' or '&eacute;'). Note that the codes 128 - 159 may only be available with Microsoft Windows fonts, so instead one should use the names for Unicode characters, see next section (e.g. '&#153;' for the (TM) sign should be replaced by '&trade;' [Unicode: '&#8482;']).
Here are all ISO Latin-1 characters, which should be known to all browsers:
'"' = '"':
'&quot;' equals '&#34;' (double quotation marks, HTML 2.0);
'&' = '&':
'&amp;' equals '&#38;' (ampersand, HTML 2.0);
'<' = '<':
'&lt;' equals '&#60;' (less sign, HTML 2.0);
'>' = '>':
'&gt;' equals '&#62;' (greater sign, HTML 2.0);
' ' = ' ':
'&nbsp;' equals '&#160;' (non-breaking space; some old browsers know the code, NOT the name);
'¡' = '¡':
'&iexcl;' equals '&#161;' (inverted exclamation mark);
'¢' = '¢':
'&cent;' equals '&#162;' (cent sign);
'£' = '£':
'&pound;' equals '&#163;' (pound sterling sign);
'¤' = '¤':
'&curren;' equals '&#164;' (general currency sign);
'¥' = '¥':
'&yen;' equals '&#165;' (yen sign);
'¦' = '¦':
'&brvbar;' equals '&#166;' (broken vertical bar);
'§' = '§':
'&sect;' equals '&#167;' (section sign);
'¨' = '¨':
'&uml;' equals '&#168;' (umlaut - dieresis);
'©' = '©':
'&copy;' equals '&#169;' ((C) - copyright);
'ª' = 'ª':
'&ordf;' equals '&#170;' (ordinal indicator, feminine);
'«' = '«':
'&laquo;' equals '&#171;' (left angle quotation mark);
'¬' = '¬':
'&not;' equals '&#172;' (not sign);
'­' = '­':
'&shy;' equals '&#173;' (soft hyphen);
'®' = '®':
'&reg;' equals '&#174;' ((R) registered trademark);
'¯' = '¯':
'&macr;' equals '&#175;' (macron);
'°' = '°':
'&deg;' equals '&#176;' (degree sign);
'±' = '±':
'&plusmn;' equals '&#177;' (plusminus);
'²' = '²':
'&sup2;' equals '&#178;' (squared - to the 2nd - superscript two);
'³' = '³':
'&sup3;' equals '&#179;' (cubed - to the 3rd - superscript three);
'´' = '´':
'&acute;' equals '&#180;' (acute accent);
'µ' = 'µ':
'&micro;' equals '&#181;' (mu - Greek alphabet - micro sign);
'¶' = '¶':
'&para;' equals '&#182;' (pilcrow - paragraph sign);
'·' = '·':
'&middot;' equals '&#183;' (small central dot);
'ç' = '¸':
'&ccedil;' equals '&#184;' (the French c with cédille);
'¹' = '¹':
'&sup1;' equals '&#185;' (to the 1st - superscript one);
'º' = 'º':
'&ordm;' equals '&#186;' (ordinal indicator - masculine);
'»' = '»':
'&raquo;' equals '&#187;' (right angle quotation mark);
'¼' = '¼':
'&frac14;' equals '&#188;' (1/4 - one fourth - one quarter);
'½' = '½':
'&frac12;' equals '&#189;' (1/2 - one half);
'¾' = '¾':
'&frac34;' equals '&#190;' (3/4 - three fourth);
'¿' = '¿':
'&iquest;' equals '&#191;' (inverted question mark);
'À' = 'À':
'&Agrave;' equals '&#192;' (the French A with accent grave);
'Á' = 'Á':
'&Aacute;' equals '&#193;' (the French A accent aigu);
'Â' = 'Â':
'&Acirc;' equals '&#194;' (the French A accent circonflexe);
'Ã' = 'Ã':
'&Atilde;' equals '&#195;' (A with tilde);
'Ä' = 'Ä':
'&Auml;' equals '&#196;' (the German Ae);
'Å' = 'Å':
'&Aring;' equals '&#197;' (A with ring);
'Æ' = 'Æ':
'&AElig;' equals '&#198;' (capital AE diphtong - ligature);
'Ç' = 'Ç':
'&Ccedil;' equals '&#199;' (the French C with cédille);
'È' = 'È':
'&Egrave;' equals '&#200;' (the French E with accent grave);
'É' = 'É':
'&Eacute;' equals '&#201;' (the French E accent aigu);
'Ê' = 'Ê':
'&Ecirc;' equals '&#202;' (the French E accent circonflexe);
'Ë' = 'Ë':
'&Euml;' equals '&#203;' (E with dieresis);
'Ì' = 'Ì':
'&Igrave;' equals '&#204;' (the French I with accent grave);
'Í' = 'Í':
'&Iacute;' equals '&#205;' (the French I accent aigu);
'Î' = 'Î':
'&Icirc;' equals '&#206;' (the French I accent circonflexe);
'Ï' = 'Ï':
'&Iuml;' equals '&#207;' (I with dieresis);
'Ð' = 'Ð':
'&ETH;' equals '&#208;' (the Icelandic Eth);
'Ñ' = 'Ñ':
'&Ntilde;' equals '&#209;' (N with tilde);
'Ò' = 'Ò':
'&Ograve;' equals '&#210;' (the French O with accent grave);
'Ó' = 'Ó':
'&Oacute;' equals '&#211;' (the French O accent aigu);
'Ô' = 'Ô':
'&Ocirc;' equals '&#212;' (the French O accent circonflexe);
'Õ' = 'Õ':
'&Otilde;' equals '&#213;' (O with tilde);
'Ö' = 'Ö':
'&Ouml;' equals '&#214;' (the German Oe);
'×' = '×':
'&times;' equals '&#215;' (x - times);
'Ø' = 'Ø':
'&Oslash;' equals '&#216;' (O slash - empty set);
'Ù' = 'Ù':
'&Ugrave;' equals '&#217;' (the French U with accent grave);
'Ú' = 'Ú':
'&Uacute;' equals '&#218;' (the French U accent aigu);
'Û' = 'Û':
'&Ucirc;' equals '&#219;' (the French U accent circonflexe);
'Ü' = 'Ü':
'&Uuml;' equals '&#220;' (the German Ue);
'Ý' = 'Ý':
'&Yacute;' equals '&#221;' (Y with acute accent);
'Þ' = 'Þ':
'&THORN;' equals '&#222;' (the Icelandic capital THORN);
'ß' = 'ß':
'&szlig;' equals '&#223;' (the German sz);
'à' = 'à':
'&agrave;' equals '&#224;' (the French a with accent grave);
'á' = 'á':
'&aacute;' equals '&#225;' (the French a accent aigu);
'â' = 'â':
'&acirc;' equals '&#226;' (the French a accent circonflexe);
'ã' = 'ã':
'&atilde;' equals '&#227;' (a with tilde);
'ä' = 'ä':
'&auml;' equals '&#228;' (the German ae);
'å' = 'å':
'&aring;' equals '&#229;' (a with ring);
'æ' = 'æ':
'&aelig;' equals '&#230;' (small ae diphtong - ligature);
'ç' = 'ç':
'&ccedil;' equals '&#231;' (the French c with cédille);
'è' = 'è':
'&egrave;' equals '&#232;' (the French e with accent grave);
'é' = 'é':
'&eacute;' equals '&#233;' (the French e accent aigu);
'ê' = 'ê':
'&ecirc;' equals '&#234;' (the French e accent circonflexe);
'ë' = 'ë':
'&euml;' equals '&#235;' (e with dieresis);
'ì' = 'ì':
'&igrave;' equals '&#236;' (the French i with accent grave);
'í' = 'í':
'&iacute;' equals '&#237;' (the French i accent aigu);
'î' = 'î':
'&icirc;' equals '&#238;' (the French i accent circonflexe);
'ï' = 'ï':
'&iuml;' equals '&#239;' (i with dieresis);
'ð' = 'ð':
'&eth;' equals '&#240;' (the Icelandic eth);
'ñ' = 'ñ':
'&ntilde;' equals '&#241;' (n with tilde);
'ò' = 'ò':
'&ograve;' equals '&#242;' (the French o with accent grave);
'ó' = 'ó':
'&oacute;' equals '&#243;' (the French o accent aigu);
'ô' = 'ô':
'&ocirc;' equals '&#244;' (the French o accent circonflexe);
'õ' = 'õ':
'&otilde;' equals '&#245;' (o with tilde);
'ö' = 'ö':
'&ouml;' equals '&#246;' (the German oe);
'÷' = '÷':
'&divide;' equals '&#247;' (division sign);
'ø' = 'ø':
'&oslash;' equals '&#248;' (o slash - empty set);
'ù' = 'ù':
'&ugrave;' equals '&#249;' (the French u with accent grave);
'ú' = 'ú':
'&uacute;' equals '&#250;' (the French u accent aigu);
'û' = 'û':
'&ucirc;' equals '&#251;' (the French u accent circonflexe);
'ü' = 'ü':
'&uuml;' equals '&#252;' (the German ue);
'ý' = 'ý':
'&yacute;' equals '&#253;' (y with acute accent);
'þ' = 'þ':
'&thorn;' equals '&#254;' (the Icelandic small thorn);
'ÿ' = 'ÿ':
'&yuml;' equals '&#255;' (y with dieresis).
If the mathematical environment becomes standard (see HTML 3.0 container tag '<MATH>'), there are plenty of additional special characters, for example:
'α': '&alpha;' (1st Greek character), '&ldots;': '&ldots;' ('...', low dots), 'a': '<VEC>a</VEC>':, etc. But it is doubtful whether this will get standard.

It is more probable that the support of the Unicode after ISO/IEC 10646 [I18N], proposed by the W3C in HTML 4.0  [local AIUB link] (since 10th November: Proposed Recommendation), will be part of all new browsers. This 16-bit extension of the above described 8-bit ISO-8859-1-Code will contain many special characters, e.g. the total Greek alphabet necessary for scientific publications.
(Until now its use is only possible by a big amount of GIF pictures grabbed normally from the screen output of a TeX DVI viewer.)
Just look at the following table of codes (which are all unknown to todays browsers, except Amaya 1.3a [and higher] knowing the entity names [not the codes] and delivering the right display, so don't be bothered about the beginning - it is just a test for future releases of browsers pretending to support HTML 4.0; but this makes new rendering engines necessary, so we have to wait for NN 5.xx and IE 5.xx):

'Α' = 'Α':
'&Alpha;' equals '&#913;' (greek capital letter alpha);
'Β' = 'Β':
'&Beta;' equals '&#914;' (greek capital letter beta);
'Γ' = 'Γ':
'&Gamma;' equals '&#915;' (greek capital letter gamma);
'Δ' = 'Δ':
'&Delta;' equals '&#916;' (greek capital letter delta);
'Ε' = 'Ε':
'&Epsilon;' equals '&#917;' (greek capital letter epsilon);
'Ζ' = 'Ζ':
'&Zeta;' equals '&#918;' (greek capital letter zeta);
'Η' = 'Η':
'&Eta;' equals '&#919;' (greek capital letter eta);
'Θ' = 'Θ':
'&Theta;' equals '&#920;' (greek capital letter theta);
'Ι' = 'Ι':
'&Iota;' equals '&#921;' (greek capital letter iota);
'Κ' = 'Κ':
'&Kappa;' equals '&#922;' (greek capital letter kappa);
'Λ' = 'Λ':
'&Lambda;' equals '&#923;' (greek capital letter lambda);
'Μ' = 'Μ':
'&Mu;' equals '&#924;' (greek capital letter mu);
'Ν' = 'Ν':
'&Nu;' equals '&#925;' (greek capital letter nu);
'Ξ' = 'Ξ':
'&Xi;' equals '&#926;' (greek capital letter xi);
'Ο' = 'Ο':
'&Omicron;' equals '&#927;' (greek capital letter omicron);
'Π' = 'Π':
'&Pi;' equals '&#928;' (greek capital letter pi);
'Ρ' = 'Ρ':
'&Rho;' equals '&#929;' (greek capital letter rho);
'Σ' = 'Σ':
'&Sigma;' equals '&#931;' (greek capital letter sigma);
'Τ' = 'Τ':
'&Tau;' equals '&#932;' (greek capital letter tau);
'Υ' = 'Υ':
'&Upsilon;' equals '&#933;' (greek capital letter upsilon);
'Φ' = 'Φ':
'&Phi;' equals '&#934;' (greek capital letter phi);
'Χ' = 'Χ':
'&Chi;' equals '&#935;' (greek capital letter chi);
'Ψ' = 'Ψ':
'&Psi;' equals '&#936;' (greek capital letter psi);
'Ω' = 'Ω':
'&Omega;' equals '&#937;' (greek capital letter omega);
'α' = 'α':
'&alpha;' equals '&#945;' (greek small letter alpha);
'β' = 'β':
'&beta;' equals '&#946;' (greek small letter beta);
'γ' = 'γ':
'&gamma;' equals '&#947;' (greek small letter gamma);
'δ' = 'δ':
'&delta;' equals '&#948;' (greek small letter delta);
'ε' = 'ε':
'&epsilon;' equals '&#949;' (greek small letter epsilon);
'ζ' = 'ζ':
'&zeta;' equals '&#950;' (greek small letter zeta);
'η' = 'η':
'&eta;' equals '&#951;' (greek small letter eta);
'θ' = 'θ':
'&theta;' equals '&#952;' (greek small letter theta);
'ι' = 'ι':
'&iota;' equals '&#953;' (greek small letter iota);
'κ' = 'κ':
'&kappa;' equals '&#954;' (greek small
'λ' = 'λ':
'&lambda;' equals '&#955;' (greek small letter lambda);
'μ' = 'μ':
'&mu;' equals '&#956;' (greek small letter mu);
'ν' = 'ν':
'&nu;' equals '&#957;' (greek small letter nu);
'ξ' = 'ξ':
'&xi;' equals '&#958;' (greek small letter xi);
'ο' = 'ο':
'&omicron;' equals '&#959;' (greek small letter omicron);
'π' = 'π':
'&pi;' equals '&#960;' (greek small letter pi);
'ρ' = 'ρ':
'&rho;' equals '&#961;' (greek small letter rho);
'ς' = 'ς':
'&sigmaf;' equals '&#962;' (greek small letter final sigma);
'σ' = 'σ':
'&sigma;' equals '&#963;' (greek small letter sigma);
'τ' = 'τ':
'&tau;' equals '&#964;' (greek small letter tau);
'υ' = 'υ':
'&upsilon;' equals '&#965;' (greek small letter upsilon);
'φ' = 'φ':
'&phi;' equals '&#966;' (greek small letter phi);
'χ' = 'χ':
'&chi;' equals '&#967;' (greek small letter chi);
'ψ' = 'ψ':
'&psi;' equals '&#968;' (greek small letter psi);
'ω' = 'ω':
'&omega;' equals '&#969;' (greek small letter omega);
'ϑ' = 'ϑ':
'&thetasym;' equals '&#977;' (greek small letter theta symbol);
'ϒ' = 'ϒ':
'&upsih;' equals '&#978;' (greek upsilon with hook symbol);
'ϖ' = 'ϖ':
'&piv;' equals '&#982;' (greek pi symbol);
'•' = '•':
'&bull;' equals '&#8226;' (bullet, black small circle);
'…' = '…':
'&hellip;' equals '&#8230;' (horizontal ellipsis = three dot leader);
'′' = '′':
'&prime;' equals '&#8242;' (prime, symbol for [arc]minutes or feet);
'″' = '″':
'&Prime;' equals '&#8243;' (double prime, symbol for [arc]seconds or inches/Zoll);
'‾' = '‾':
'&oline;' equals '&#8254;' (overline, spacing overscore);
'⁄' = '⁄':
'&frasl;' equals '&#8260;' (fraction slash);
'℘' = '℘':
'&weierp;' equals '&#8472;' (script capital P, power set);
'ℑ' = 'ℑ':
'&image;' equals '&#8465;' (blackletter capital I, imaginary part symbol);
'ℜ' = 'ℜ':
'&real;' equals '&#8476;' (blackletter capital R = real part symbol);
'™' = '™':
'&trade;' equals '&#8482;' (trade mark sign);
'ℵ' = 'ℵ':
'&alefsym;' equals '&#8501;' (alef symbol, first transfinite cardinal);
'←' = '←':
'&larr;' equals '&#8592;' (leftwards arrow);
'↑' = '↑':
'&uarr;' equals '&#8593;' (upwards arrow);
'→' = '→':
'&rarr;' equals '&#8594;' (rightwards arrow);
'↓' = '↓':
'&darr;' equals '&#8595;' (downwards arrow);
'↔' = '↔':
'&harr;' equals '&#8596;' (left right arrow);
'↵' = '↵':
'&crarr;' equals '&#8629;' (downwards arrow with corner leftwards, carriage return sign);
'⇐' = '⇐':
'&lArr;' equals '&#8656;' (leftwards double arrow, 'is implied by' symbol);
'⇑' = '⇑':
'&uArr;' equals '&#8657;' (upwards double arrow);
'⇒' = '⇒':
'&rArr;' equals '&#8658;' (rightwards double arrow, 'implies' symbol);
'⇓' = '⇓':
'&dArr;' equals '&#8659;' (downwards double arrow);
'⇔' = '⇔':
'&hArr;' equals '&#8660;' (left right double arrow, 'is equivalent' symbol);
'∀' = '∀':
'&forall;' equals '&#8704;' (for all);
'∂' = '∂':
'&part;' equals '&#8706;' (partial differential);
'∃' = '∃':
'&exist;' equals '&#8707;' (there exists);
'∅' = '∅':
'&empty;' equals '&#8709;' (empty set = null set, diameter sign);
'∇' = '∇':
'&nabla;' equals '&#8711;' (nabla, backward difference);
'∈' = '∈':
'&isin;' equals '&#8712;' (element of);
'∉' = '∉':
'&notin;' equals '&#8713;' (not an element of);
'∋' = '∋':
'&ni;' equals '&#8715;' (contains as member);
'∏' = '∏':
'&prod;' equals '&#8719;' (n-ary product, product sign);
'∑' = '∑':
'&sum;' equals '&#8721;' (n-ary sumation);
'−' = '−':
'&minus;' equals '&#8722;' (minus sign);
'∗' = '∗':
'&lowast;' equals '&#8727;' (asterisk operator);
'√' = '√':
'&radic;' equals '&#8730;' (square root, radical sign);
'∝' = '∝':
'&prop;' equals '&#8733;' (proportional to sign);
'∞' = '∞':
'&infin;' equals '&#8734;' (infinity sign);
'∠' = '∠':
'&ang;' equals '&#8736;' (angle);
'∧' = '∧':
'&and;' equals '&#8743;' (logical and sign, wedge);
'∨' = '∨':
'&or;' equals '&#8744;' (logical or sign, vee);
'∩' = '∩':
'&cap;' equals '&#8745;' (intersection symbol, cap);
'∪' = '∪':
'&cup;' equals '&#8746;' (union symbol, cup);
'∫' = '∫':
'&int;' equals '&#8747;' (integral);
'∴' = '∴':
'&there4;' equals '&#8756;' (therefore);
'∼' = '∼':
'&sim;' equals '&#8764;' (tilde operator, varies with or similar to sign);
'≅' = '≅':
'&cong;' equals '&#8773;' (approximately equal to);
'≈' = '≈':
'&asymp;' equals '&#8776;' (almost equal to sign, asymptotic to);
'≠' = '≠':
'&ne;' equals '&#8800;' (not equal to sign);
'≡' = '≡':
'&equiv;' equals '&#8801;' (identical to sign);
'≤' = '≤':
'&le;' equals '&#8804;' (less-than or equal to sign);
'≥' = '≥':
'&ge;' equals '&#8805;' (greater-than or equal to sign);
'⊂' = '⊂':
'&sub;' equals '&#8834;' (subset of);
'⊃' = '⊃':
'&sup;' equals '&#8835;' (superset of);
'⊄' = '⊄':
'&nsub;' equals '&#8836;' (not a subset of);
'⊆' = '⊆':
'&sube;' equals '&#8838;' (subset of or equal to);
'⊇' = '⊇':
'&supe;' equals '&#8839;' (superset of or equal to);
'⊕' = '⊕':
'&oplus;' equals '&#8853;' (circled plus, direct sum);
'⊗' = '⊗':
'&otimes;' equals '&#8855;' (circled times, vector product);
'⊥' = '⊥':
'&perp;' equals '&#8869;' (up tack, orthogonal to = perpendicular);
'⋅' = '⋅':
'&sdot;' equals '&#8901;' (dot operator);
'⌈' = '⌈':
'&lceil;' equals '&#8968;' (left ceiling, apl upstile);
'⌉' = '⌉':
'&rceil;' equals '&#8969;' (right ceiling);
'⌊' = '⌊':
'&lfloor;' equals '&#8970;' (left floor, apl downstile);
'⌋' = '⌋':
'&rfloor;' equals '&#8971;' (right floor);
'⟨' = '〈':
'&lang;' equals '&#9001;' (left-pointing angle bracket, bra);
'⟩' = '〉':
'&rang;' equals '&#9002;' (right-pointing angle bracket, ket);
'◊' = '◊':
'&loz;' equals '&#9674;' (lozenge);
'♠' = '♠':
'&spades;' equals '&#9824;' (black spade suit);
'♣' = '♣':
'&clubs;' equals '&#9827;' (black club suit, shamrock);
'♥' = '♥':
'&hearts;' equals '&#9829;' (black heart suit, valentine);
'♦' = '♦':
'&diams;' equals '&#9830;' (black diamond suit);
'Œ' = 'Œ':
'&OElig;' equals '&#338;' (latin capital ligature OE);
'œ' = 'œ':
'&oelig;' equals '&#339;' (latin small ligature oe);
'Š' = 'Š':
'&Scaron;' equals '&#352;' (latin capital letter S with caron);
'š' = 'š':
'&scaron;' equals '&#353;' (latin small letter s with caron);
'Ÿ' = 'Ÿ':
'&Yuml;' equals '&#376;' (latin capital letter Y with diaeresis);
'ˆ' = 'ˆ':
'&circ;' equals '&#710;' (modifier letter circumflex accent);
'˜' = '˜':
'&tilde;' equals '&#732;' (small tilde);
' ' = ' ':
'&ensp;' equals '&#8194;' (en space);
' ' = ' ':
'&emsp;' equals '&#8195;' (em space);
' ' = ' ':
'&thinsp;' equals '&#8201;' (thin space);
'‌' = '‌':
'&zwnj;' equals '&#8204;' (zero width non-joiner);
'‍' = '‍':
'&zwj;' equals '&#8205;' (zero width joiner);
'‎' = '‎':
'&lrm;' equals '&#8206;' (left-to-right mark);
'‏' = '‏':
'&rlm;' equals '&#8207;' (right-to-left mark);
'–' = '–':
'&ndash;' equals '&#8211;' (en dash);
'—' = '—':
'&mdash;' equals '&#8212;' (em dash);
'‘' = '‘':
'&lsquo;' equals '&#8216;' (left single quotation mark);
'’' = '’':
'&rsquo;' equals '&#8217;' (right single quotation mark);
'‚' = '‚':
'&sbquo;' equals '&#8218;' (single low-9 quotation mark);
'“' = '“':
'&ldquo;' equals '&#8220;' (left double quotation mark);
'”' = '”':
'&rdquo;' equals '&#8221;' (right double quotation mark);
'„' = '„':
'&bdquo;' equals '&#8222;' (double low-9 quotation mark);
'†' = '†':
'&dagger;' equals '&#8224;' (dagger);
'‡' = '‡':
'&Dagger;' equals '&#8225;' (double dagger);
'‰' = '‰':
'&permil;' equals '&#8240;' (per mille sign);
'‹' = '‹':
'&lsaquo;' equals '&#8249;' (single left-pointing angle quotation mark);
'›' = '›':
'&rsaquo;' equals '&#8250;' (single right-pointing angle quotation mark);
'€' = '€':
'&euro;' equals '&#8364;' (euro sign).

7. Style Sheets

The WWW has grown faster than expected, so polishing/styling got part of HTML (see e.g. the container tags 'FONT', 'S', 'BLINK' and the tag-options defining color and alignment) - which was never intended.
With HTML 4.0  [local AIUB link] it is planned to concentrate on the structuring of information and leave the styling to style sheets (see HTML and Style Sheets  [local AIUB link], W3C Working Draft March 1997).

The standard are Cascading Style Sheets (CSS), available -up to now- in two versions:

If you want to use CSS, you ought to set the default style sheet language to CSS by adding the line:
'<META HTTP-EQUIV="Content-Style-Type" CONTENT="text/css">'
to the header of the HTML file.

Style Sheets can be embedded in HTML files via the following mechanisms:

To put style to text passages and blocks, the two container tags 'SPAN' and 'DIV' are very useful, which have no effect on any UA (except in connecting the styling to the embraced text).
For selecting some tags in an HTML document for style sheet definitions, one can combine these tags of the same token (e.g. several - not all - of the 'P' tags; allowed are all HTML tags except 'BASE', 'BASEFONT', 'HEAD', 'HTML', 'META', 'PARAM', 'SCRIPT', 'STYLE' and 'TITLE') by the new HTML 4.0 attributes
'CLASS'
(i.e. '<P CLASS="MYPARAGRAPH">text_paragraph</P>') or
'ID'
(i.e. '<P ID="example">example_text</P>'; see also the container tag 'A').
Thus you can refer to all these paragraph elements in the CCS code, e.g., via
'P.MYPARAGRAPH { color: green }' and via 'P#example { letter-spacing: 0.5em }' respectively.

CSS definitions consist of a selector (in the most simple case just one HTML tag, or several tags separated by commas ',') and the declaration, the latter put in braces ('{' ... '}') and consisting of one or more sets, which are separated by semicolons ';', of combinations of a property (e.g. 'color') and a value (e.g. 'yellow') separated by a colon ':'.

All CSS style sheets are case-insensitive, except for parts that are not controlled directly by CSS, like URLs (so its the same as for HTML documents, but different from XML, which is totally case-sensitive).

CSS definitions will override prior definitions, so one can specify general styling first and give then all exceptions (e.g. writing at first 'H1, EM { color: blue }' setting the color of header-1 and emphasized text to blue and after this 'H1 EM { color: red }' defining the color of emphasized text in header-1 to be red.
Users can specify their own CSS definitions. In the case of double definitions, authors' definitions will override users' definitions. This is inverted (in the CSS 2 specifications, contradictory to the older CSS 1 rule) when the '!important' declaration is given - so in the end the user has the power to set fonts etc.! Styling defined by style sheets will always win against definitions in HTML (e.g. via the 'FONT' command or an 'ALIGN' or 'COLOR' option).

Even though many browsers support CSS (like NN 4.0x and IE 3.0x), most features do not work properly. For professional web designers it would not be wise to rely totally on CSS in respect of the styling, but a combination of HTML style settings and CSS definitions may be useful.
Please note that concerning the HTML successor XML one can use CSS and the new styling language eXtensible Stylesheet Language - XSL  [local AIUB link], which is a transformation language using XML syntax - but can not be used with HTML.

8. Available set of icons

If you want to embellish your websides with icons, just have a closer look at the icons at the WWW Manual Icons - Homepage.
They can be used by '<IMG SRC="/~webaiub/Icons/name">' with 'name' as the name of the special icon.

In former times this list was here but the Manual got to slow - even if called in Bonn. So think wisely about the use of icons in your own homepage.

9. Useful hints for creating good homepages

10. Useful hints for webmastering

11. Links for further information

Links back/forward to:
First version:23rdNovember,1996
Last update:06thAugust,1999
© 1996-99   Jochen M. Braun   (jbraun@astro.uni-bonn.de)