![[Univ of Cambridge]](http://www.eng.cam.ac.uk/images/house_style/uniban-s.gif)
![[Dept of Engineering]](http://www.eng.cam.ac.uk/images/house_style/engban-s.gif)
CUED WWW House Style
THIS DOCUMENT HAS BEEN SUPERCEDED BY http://www-h.eng.cam.ac.uk/help/www/webstyle/
This document describes the procedures to be followed by providers of information available on CUED's WWW servers and gives details of the editorial control mechanisms which exist to ensure that the information provided
and its presentation are of high quality.
In 1997 the department's
Web Strategy Committee discussed the future structure,
appearance and maintenance of our WWW material. This will be an ever
more important issue. Already there is evidence to suggest that the WWW
version of some CUED
documents (the Annual Report
for example) are read over 20 times more than the paper versions, and
a high proportion of new Ph.D students say that WWW material is an
important factor in their selection of university. The success of our
WWW material depends on the usefulness, accuracy, currency and quality of
presentation of the information which it contains. Some basic style and
format elements are required to portray a consistent, predictable and
cohesive appearance. A well co-ordinated
and properly managed service is essential in order to present a quality
image to internal and external users. Prompt action is
necessary if we are not to fall behind those competing with us for
students and funding, so we have
prepared this "house style" for CUED WWW publications. All authors
of official documents are expected to conform with these guidelines.
Staff and students mounting unofficial material on the WWW are asked to
set similar standards of presentation to those described here and to inform
themselves of
departmental requirements.
One requirement is that privately published material must not contain any material which gives the
impression that it is an official publication and must indicate who is publishing the material. In particular, the University crest should not
be used
on unofficial pages.
The advantage in reproducing on the WWW the existing
administrative structure of CUED is that it would be easier to
identify who should maintain what. However, it was felt that the
internal structure of the department might confuse some external
viewers, so a more user-centred approach has been adopted. In
particular, the divisional structure of the department will not
be emphasised online.
Tree structures are to be adopted where possible, though cross-links
will be used if they're easy to maintain and are considered useful.
The University's
Press and Publications office are encouraging a
house style for
paper publications.
We have decided to adopt the paper House Style wherever practicable
and appropriate.
However, there are many aspects that we have decided
upon ourselves.
- Backgrounds should be white.
- The primary text colour should be black.
- Headings will normally be black, though some of the colours above
may be useful alternatives
sometimes. <H1> headings should be centred, other headings
should be left-aligned.
- We would have liked to use the official colours for links, but
the onscreen "Cambridge Dark Blue", "Cambridge Green" and "Burgundy"
aren't easily distinguishable from black or each other. So we've
chosen bright versions of the official colours - blue for unvisited links,
red for active links, and burgundy for visited links.
These features can be achieved by using
<BODY BGCOLOR="#ffffff" TEXT="#000000" LINK="#0000A3" VLINK="#760076"
ALINK="#FF0000">
In general visitors will not arrive through the "front door" of the
departmental Home Page, so on each page there needs to be a CUED identifier
and a way for
visitors to get to the departmental Home Page. This identifier is
in a small and large form
and ![[Dept of Engineering]](http://www.eng.cam.ac.uk/images/house_style/engban-l.gif)
and will link back to the departmental home page.
These identifiers, when used as a banner header need to be separated by
some white space. GIFs to provide the appropriate amount of space are
available. Their use is demonstrated by the following code which
produced the header on this page
<A HREF="http://www.cam.ac.uk">
<IMG BORDER=0 ALT="[Univ of Cambridge]"
SRC="http://www.eng.cam.ac.uk/images/house_style/uniban-s.gif"></A>
<IMG BORDER=0 ALT=""
SRC="http://www.eng.cam.ac.uk/images/house_style/spacer-s.gif">
<A HREF="http://www.eng.cam.ac.uk">
<IMG BORDER=0 ALT="[Dept of Engineering]"
SRC="http://www.eng.cam.ac.uk/images/house_style/engban-s.gif"></A>
The basic structure of a Web Page contains three main sections; the header, body
and footer. The example official pages contain the
required elements in the header and footer. Little or no modification of these is
required so that authors may focus their efforts on the information they wish
to present in the body. The header is used to indicate document status,
indicating whether the page represents the views of the department, a group
or an individual.
- Header - All the examples contain a small logo graphic at the
top which doubles as a link back to the CUED home page. Depending
on the level of the page, other logos may also be specified. A <title>
is also required, containing "CUED".
These are
followed by a horizontal rule.
- Body -
The body or content of the document may be designed according to the
information needs of the department.
General policies
concerning inappropriate
material should be followed. Links should be used to official identifiers and data sources instead of
copying data that exists elsewhere.
- Footer -
The standard footer contains a horizontal rule, an email-able author name and the
date of the last revision.
The 'e-mailable author name' should have the e-mail address as visible text
(i.e.
<a href="mailto:jb123@eng.cam.ac.uk">jb123@eng.cam.ac.uk</a> not
<a href="mailto:jb123@eng.cam.ac.uk">Joe Bloggs</a>) -
for browsers where mailtos aren't usable, and to make the information
usable if printed out. Phone numbers should be in "international"
format -
+44 1223 33xxxx
We have identified
4 main types of official pages -
Our home pages for external
and internal (intranet)
use are stable now.
Across the top should be the University Identifier, the CUED Identifier
and optionally, a link to a division.
There should then be a horizontal rule, the title of the page (in <H1>,
and including the text CUED)
and then another horizontal rule.
Headings should be
Introduction - Introduction and mission statements
Research Topics
People - with links to staff profile pages
Research Seminars
Current final year projects
Prospective final year projects
Recently completed PhD thesis abstracts
Web Links
Contact Information
An Announcements item can be added as
the first header if there are jobs, courses, or anything else
of a similar nature that a group wishes to draw immediate attention
to.
Then there should be horizontal rule followed by a centred line
of text links to "higher levels"
[Cambridge University | CUED | Division]
followed by the footer. An example is the
draft structures
group page
An official profile page for each staff member has been created
(the URL is http://www.eng.cam.ac.uk/~uid). If the
information on these pages is wrong, mail
operators@eng.cam.ac.uk so
that they can update the underlying database.
You can edit the page using the Teaching System's edit_homepage
command to add a college address, a link to your research group home page,
and various sections as described below. Mail webadmin@eng.cam.ac.uk
if you would like calls to this page forwarded to a page you've already
written on a reliable research machine. Note that replacement pages need
to conform to the following style -
Across the top there should be the University Identifier and the CUED Identifier.
Then there should be a horizontal rule, the name of the person
(title, initials, surname) in <H1>
with a link to a photo and a link to the research group (if any)
and then another horizontal rule.
Headings should be
Introduction - Introduction, including short biography
Research
Teaching
Other Work - which may contain a link to the person's
personal Home Page on www2.eng.cam.ac.uk
Publications
Contact Information
Sections can be omitted, if appropriate, (they're left out of the
default home pages)
but any other information should be held on the person's personal home
page.
Finally there should be another horizontal rule then a centred line
of text-links to "higher levels"
[Cambridge University | CUED | Research Group]
followed by the footer.
The page shouldn't be much bigger than a screen's worth.
An example is Chris Burgoyne's draft home page.
These should be minimal, providing access to other areas of departmental information.
This access should be provided as clear links with additional description where necessary. In general, there should be
no more than 10 such links. The links at this level should not be contained within flowing
text but should be isolated in some way. A single block of links in an unnumbered list can be used; acceptable
alternatives are graphic bullets and sections separated by headings. Where graphics are used alternatives should
be provided and consideration given to the speed with which they are likely to be delivered. Large graphics for
links or a mapped graphic page are probably not desirable for the front entry point.
Across the top should be the University Identifier and the CUED Identifier.
There should then be a horizontal rule, the title of the page (in <H1>,
and including the text CUED)
and then another horizontal rule.
Headings should be
Introduction - Introduction and mission statements
Staff - with links to staff profile pages
Teaching - with links to syllabus pages
Research - with links to Research Group pages.
Then there should be another horizontal rule followed by
contact information.
There are many official pages (those covering Research and Teaching, for
example) that are not covered by the 4 sections above. Though
no specific details are given here, they
should follow the general guidelines.
Maintenance and Responsibility
Responsibility for the material on our Web servers rests ultimately with the
Head of Department but in practice
is devolved by him through the
Computer Systems Committee to the
Web Strategy Committee. This committee includes Divisional Web Administrators and representatives from Admin and the Teaching Office who have
authority delegated by the Head of
Department to ensure that others produce the required material. They may
further delegate responsibility and
authority to those in charge of Research Group Web sites.
An individual (or group of individuals) will be assigned responsibility for each page. This individual or group will be responsible for
- its content
- compliance with the Worldwide Web Departmental Guidelines and
appropriate licensing agreements relating to intellectual property,
- its maintenance (e.g., accuracy, currency).
The person(s) will
be expected to signify acceptance of or compliance with these provisions and computer
account agreement prior to such pages being posted or linked to the Home Page level.
If these pages contain links to non CUED pages, the person(s) assigned
responsibility for these pages may wish to include an appropriate disclaimer adjacent to such
link or prior to any transfer to that page.
For some locally produced material a copyright notice may be appropriate.
Contact the department's web administrators
(webadmin@eng.cam.ac.uk) in
the first instance for further information.
The department's web administrators undertake to do periodic automated
scans of online material to
- check on the validity of links
- check for old documents
but the main responsibility for these issues rests with the authors.
The WWW has complicated the copyright issue in various ways. As well as making
material much easier to copy, it has blurred the distinction between
documentation and programs, and, by using frames, web-authors can
seamlessly incorporate distant material into their own. Adding a copyright
statement may help with issues relating to liability and intellectual
property. We suggest that you add the following code (with the appropriate year) into the <ADDRESS> -
<A HREF=http://www.eng.cam.ac.uk/copyright.html> (copyright © CUED, 2001)</A>
The Disability Discrimination Act (Part III) requires that providers of information and services available through the web make them
accessible for people with disabilities. See http://www.disability.gov.uk/dda/ for the code of practice.
Skill publishes information about the impact on technology of forthcoming legislation on Disability in Higher Education.
It is the information provider's duty to anticipate the need for access by
disabled people, so
the W3C Accessibility Guidelines (http://www.w3.org/) should be understood and acted upon.
We require compliance with Priority 1 issues. See the checklist at
http://www.w3.org/TR/WCAG/full-checklist.html for details.
The University's Access Guidelines provide further information.
The practice we would like to promote includes the
following points (not necessarily in order of priority):
- Try to
- attract visitors - identify all your audiences and all the
purposes you want the site to accomplish.
- encourage them to look around once they are here by providing easy
navigation, making answers to common queries easy to find, and making
our coverage of material uniform
- encourage revisits - have job offers, current events,
what's new etc.
- Although the technology used at present to provide information is the World Wide Web, this will undergo
developments over the next few years and it is advisable to use the absolute minimum of vocabulary
specific to this technology when you are writing your pages. Remember that text browsers will also be used
to access the information therefore all instructions should appear in text, even if you have an image saying
the same thing. Frames and tables are not understood by some ancient browsers.
You should test your pages with as many browsers as you can and check that
the information you want to provide is legible, etc.
-
HTML is likely to be around for a long time, but will eventually be
superseded by XHTML and related standards. If you wish, you can produce
pages now in xhtml, and they will work in most browsers. But, in terms of
future-proofing your pages, the most important thing is to make sure that
your pages are valid, whether in XHTML or HTML. This will make any
conversion in the future much easier.
- Don't use only absolute font names and sizes. Use a range of type faces for any given style, always
ending with the generic font type (serif or sans serif). We have about 70-75% users of Windows systems, others are split between
various Unix-based and Macintosh systems, so bear this in mind when selecting any named fonts and choosing sizes. Users with
special requirements (and many others with incompatible set-ups) must be able to adjust pages so they can see them.
- Use relative pathnames whenever possible. This will make it easier to move whole directories or directory
trees. To refer to the parent directory of the one you are in, use ".." (an easy way to remember this is to
remember that we all have two parents!)
- Remember that using graphics slows things down; using lots of graphical buttons will be
counter-productive if browsers take ages to download them. It is possible to provide little boxes that
expand into images when they are clicked on.
- Coloured bullet-marks will slow pages down but can be used in
moderation. A collection is available amongst our
Standard GIFs
- Design for interactivity. Mail requests, and e-mail forms can build
interest and will give readers a break from the sometimes monotonous
surf-and-scroll syndrome.
See the Technical Guidelines for more technical details.
Acknowledgements
The following documents were consulted:
Heriot-Watt's handbook, the
Moray House Style Guide,
Indiana University Guidelines,
McMaster University Guidelines, the
Yale C/AIM WWW Style Manual.
Chris Burgoyne,
Patrick Gosling,
Michael Gray,
James Matheson,
and
Paul Taylor
all contributed to this document.
Updated December 2001
Tim Love, tpl@eng.cam.ac.uk
