Contents

1. Introduction
   • Publishing course-related items online: what and why?
2. Creating simple web pages
   • a few useful html tags
   • creating your first html page
   • resources on html
   • math in html
3. Preparing documents with math notation for web dissemination
   • Step 1: Create the document
   • Step 2: Print to Adobe Distiller .ps file
   • Step 3: Distill the .ps file to the .pdf format
4. Publishing your pages on the web
   • /public_html directories in unix
   • Rapid Filer
   • Let PB know
5. Final thoughts
   • Beyond html

1. Introduction

• the course syllabus, sample tests, solution keys, lecture notes,
• current announcements, extra-credit problems,
• interactive material such as animations or interactive tutorials,
• links to other web sites with relevant information.

• reduction of the amount of paper needed to produce handouts,
• more convenient access for students than postings on the instructor's door,
• timely access, including weekends and breaks,
• ability to include material impossible to present on paper,
• opportunity to advertise your course (and, implicitly, all our course offerings) among prospective students, and the general public.

2. Creating simple web pages

a few useful html tags

Tags are always enclosed in angle brackets. Many tags have to be specified in pairs: <tag> and </tag> act as opening and closing parentheses, respectively. Here is a list of a few basic tags which control the document's appearance:

tag		example in html	example rendered in Netscape
headings	<h1> ... </h1>	<h1>First level heading</h1>	First level heading
	<h2> ... </h2>	<h2>Second level heading</h2>	Second level heading
	...	...	...
	<h6> ... </h6>	<h6>Sixth level heading</h6>	Sixth level heading
new paragraph	<p>	abcde fgh<p>ijk lmnopq	abcde fgh ijk lmnopq
line break	<br>	abcde fgh<br>ijk lmnopq	abcde fgh ijk lmnopq
bold	<b>...</b>	abc<b>def</b>ghi	abcdefghi
italics	<i>...</i>	abc<i>def</i>ghi	abcdefghi
unordered list	<ul> <li>... <li>... </ul>	<ul> <li>first item <li>second item </ul>	first item second item
ordered list	<ol> <li>... <li>... </ol>	<ol> <li>first item <li>second item </ol>	first item second item

One of the key features of html documents is the ability to include hyperlinks. These hyperlinks can point to other web pages (in html or other formats) or to items within the current document.
Both the source and destination anchor tags, <a ... >...</a> are used to define a hyperlink. To define a "hot spot", which triggers the hyperlink, use the syntax:

where URI stands for the Universal Resource Identifier, which can be used to refer to html pages, pictures, etc.

The table below contains two simple examples of hyperlinks.

example	html	rendered in Netscape	After following the hyperlink, click on "Back" to return here.
relative URI	<a href="simpage.html">Simple page</a>	Simple page
absolute URI	<a href="http://www.math.odu.edu">Math & Stat</a>	Math & Stat
link to a destination within this document	<a href="#toc">back to the Table of Contents</a>	back to the Table of Contents

some important observations related to the above examples:

• the relative URI used in the first example specifies the location of the target document relative to the current document. Thus, the document simpage.html referenced in the first example has to reside in the same directory as the current document.
  Different directories can be specified by using the standard operators "." ".." and "/" to move up and down the directory tree, e.g. <a href="files/simpage.html"> would point to the subdirectory files of the directory containing the current document, while <a href="../simpage.html"> would point to the parent directory.
  The second example illustrates an absolute URI, which contains the complete web address of the document.
  Whenever creating a collection of related pages, use the relative links so that moving the entire collection to a different location will not render the links invalid. The absolute links should be used to reference documents located elsewhere (even on our Departmental server).
• The first example refers to the document "simpage.html", even though under DOS (or Windows 3.1x) the file name would have to be abbreviated to "simpage.htm". When moving the documents from DOS to Unix, they should be renamed to get the standard extension ".html".
• in the third example, the hyperlink requires that a destination anchor be defined using the html code

creating your first html page

Before you get started on a new web page project, it is a good idea to create a new directory under your home drive (F: on MATHPC), e.g. F:\WEBPAGE (this can be done using Windows File Manager or from DOS). Also, create a subdirectory FILES in the WEBPAGE directory.

Start Windows Notepad, and type the html contents of the main page. For example:

Once you finish typing the Notepad document, save it as a file INDEX.HTM (or another file with the .HTM extension) into the F:\WEBPAGE directory. You can then use Netscape to view the file (in Netscape 3, from the File menu, select Open File..., and select the file you've just saved.)

Both Notepad and Netscape can remain open simultaneously, so that you can make changes to the file and then preview the document instantly by hitting the "Reload" button in Netscape.

resources on html

• The official html specification
• HTML - related items on Yahoo include a list of guides and tutorials.
• Macmillan Personal Bookshelf contains complete books online, including "The Complete Idiot's Guide to Creating an HTML Web Page".

math in html

• superscript: <SUP>...</SUP>
• subscript: <SUB>...</SUB>

In next section, we outline how such files can be created on the MATHPC network.

3. Preparing documents with math notation for web dissemination

Step 1: Create the document

• Scientific Workplace,
• AmiPro,
• WordPerfect.

Step 2: Print to Adobe Distiller .ps file

The file must have the .PS extension.

Step 3: Distill the .ps file to the .pdf format

You can create hyperlinks to PDF files in the same way as those leading to HTML files, e.g.

When a user clicks on such a hyperlink, the browser should start Acrobat Reader which would then display the contents of the PDF file.

Since some users may not have their browser set up to do that, your page should include a link to the Adobe web site (http://www.adobe.com) from which the free Acrobat Reader software can be downloaded.

4. Publishing your pages on the web

/public_html directories in unix

For files to be accessible to the outside web users, these files must be located within the directory public_html under your Unix home directory. (If you do not have such directory, you can create it using Rapid Filer).

Rapid Filer

Here are a few comments related to the Rapid Filer:

• For improved performance, it is suggested that you type tick.math.odu.edu as the "Remote Host Name" when establishing the connection under Rapid Filer.
• Because of the 3-character limitation on the file name extension imposed by DOS, html files there are saved with the .htm extension. However, on file systems such as Unix that support long file names, it is best to end the html file names with the full .html" extension. This could be accomplished in two ways:
  • copy the html files from DOS with their original .htm extensions, and then rename them using File--Rename, or
  • use File--Copy to New Name to change the extension .htm to .html while copying.
• Selecting Copy--Copy Options... will bring up the "Copy Options" dialog. Selecting "Recursively Copy Directory Trees" will allow for copying of entire directory structures by dragging the parent directory icon.

Let PB know

5. Final thoughts

Another possibility for generating fairly good html pages is to use word processors capable of direct output to html format (e.g., Lotus WordPro). However, at the moment, there is usually a need to do at least some editing of the html code manually (this may change as the tools improve).

Beyond html

• Interactive MATH 304 by Wu Li, and
• Calculus Interactive Tutorials and Tests by Przemyslaw Bogacki.

Last updated on September 10, 1998