Authoring web pages in the IfA format

  1. Introduction
  2. Authoring with an simple text editor
    1. Introduction
    2. Logging onto the web servers
    3. Getting the template
    4. Editing the template
    5. Adding a navigation menu
    6. Validating your web page
    7. Hints for satisfying the validator
  3. Further information

Introduction

The IfA web pages make extensive use of style sheets and server-side includes. This make maintenance of global properties easy, but can lead to difficulties in preperation since the many included objects make it only feasible to edit a document in situ within the web server directory tree.

The general format of the IfA webpages, such as this page, has the body of the text in the white rectangle in the centre. To the left and right are menus. The lower left menu is document-specific. It is called "Internal Info", here.

Authoring with an simple text editor

Authoring web pages with a text editor is the most trivial method for creating and maintaining documents, but a working knowledge of HTML markup code is required.

There are a variety of editors available on spider, including emacs, vi, kedit, and xedit. Also available but not supported is /home/ert/bin/nedit.

Logging onto the web servers

Presently the machines hosting web services are:

spider
Hosts www.roe.ac.uk Public
corvus
Hosts intra.roe.ac.uk Internal only
katrine
Hosts apache.roe.ac.uk Internal only

For first-time users, follow the instructions in Personal WWW Pages and FTP Areas

Files for http://apache/roe.ac.uk/~username/ require no special access, as they are in your /home/username/public_html/ direoctory.

Getting the right templates

There are two slightly different versions of the template. One has the added functionality that tests if the visitor's browser is Netscape-4. This script providing this test cannot be executed from a user's /home/user/public_html/ directory.

Decide in which tree you intend to place the documents. Then, from the table below, click on the appropiate files to copy the template files to your local directory. Extract the files using
tar xzf filename.

Document treeFiles
spider:/home/httpd/html/ifa/ IfA_Web_Templates.tgz
spider:/home/user/public_html/ IfA_Web_local_Templates.tgz

Editing the template

In template.html or template_local.html (renamed appropriately), the text of your document must be placed in the body of the file delimited by:

<!-- InstanceBeginEditable name="content" -->
<h1>Title of your document</h1>
<p>
Text of your document.
</p>
<!-- InstanceEndEditable -->

Also, rename the document title in the 6th line of the file, between the <title> and </title> lables.

Adding a navigation menu

The file ifatemplatenav.html (downloaded above) is your navigation menu. Here, you place links to navigate your document(s) or external links. For the example below, the file has been renamed ifaMyProjectnav.html.

In template.html (again, renamed appropriately), replace:
<!--#include virtual="ifatemplatenav.inc"-->
with:
<!--#include virtual="ifaMyProjectnav.inc"-->

If you do not need or desire a navigation menu, simply replace
<!--#include virtual="ifatemplatenav.inc"-->
with:
<!--#include virtual="/includes/common/nosubnav.inc"-->
in your document.

Validating your web page

It is important to maintain web pages which conform to the standards browsers expect. Just because a page looks right, doesn't mean it is right. Broswers are lenient in their interpretation of HTML, which is a good thing, but how they interpret incorrect code is up to them. Erroneous code that produces pleasant results on your broswer might look terrible on another.

Check the page with a validator such as the W3 Consortium's MarkUp Validation Service . Just copy and paste the URL of your web page into the validation service's form.

Caveat: Conformance does not guarantee uniformity.

Hints for satisfying the validator

Markup that does not normally have a terminating mark can be made to self-terminate by adding a slash. Eg, replace <br> with <br /> (not <br/>). Same for <hr /> and <img ... />.

Images must have an alt tag. Eg:
<img src="PrimeFocus.jpg" alt="Picture of Prime Focus" />

Nested lists have changed. The nesting must be within <li> and </li> tags.

Further Help

For help authoring IfA pages, contact Eric Tittley.

For more information about the ROE web pages and authoring, please contact Jason Cowan.


All email addresses are username@roe.ac.uk

Unless explicitly stated otherwise, all material is copyright © The University of Edinburgh

IfA webmasters:
Eric Tittley (ET x366) ert
Jason Cowan (R11 x305) webmaster