Web templates for Departments

How to adapt the index page templates

Navigation bar and header

The navigation bar and header are global elements and should be used as supplied. Apart from the breadcrumb trail, this header should be the same for every page on your site.



  • The search box should be changed to link directly to the packaged search for your web server (see http://search.cam.ac.uk/server-list for links to all packaged searches available). If there is no packaged search available for your site and you'd like to use one, please mail web-support@ucs.cam.ac.uk and we'll set one up. The example pages are set up for packaged searches so that you can see how they are coded and there is further information at http://www.ucs.cam.ac.uk/web-search/searchforms.
  • The a-z link is intended to point to the central information at http://www.cam.ac.uk/global/az.html. If a local file is used instead, use the page supplied as a template and add a link to the central a-z at the top.
  • The contact link should be to a local file, which can be based on http://www.cam.ac.uk/global/contact.html but please ensure you have either changed the link to the comment form to your local form or deleted it, and created links to your email and/or staff directories.

On a departmental home page, the breadcrumb trail 'top level' entry for the University has been used to free departmental sites of the difficult concept of 'Home'. The breadcrumb trail should give the user a route out through information logically above them in the information tree to ensure that they can find their way. For a department the top entry should be the University, and once away from the departmental home page that page should be included as the next step:

The header

If you wish to customise the header (to include your department's logo for example) please contact Barney Brown in Communications Services. There are strict guidelines in place as to how the University Identifier appears alongside partner logos, and working with us will help you avoid any pitfalls. If you're going to use the header as is, please maintain the hyperlinks from the logos to www.cam.ac.uk.

The footer

The footer information is essential for giving provenance to the page. A user may enter your site at any page and needs assurance that it is up-to-date and can be trusted. Adding full contact information in the footer of the home page may be useful, but only a reduced version is needed on every page. The following should be considered:

  • Although copyright is asserted without it being stated, state the ownership of a page to dissuade people from copying it.
  • Include the email address of the information provider and/or the webmaster address or a link to a comment form. This information is essential for people who have a problem with the page.
  • The home page must have a link to a privacy policy for the web server, which may be based on the policy of the University Computing Service for the server www.cam.ac.uk (http://www.cam.ac.uk/privacy/webserverprivacy.html). The Computing Service has formulated a raft of privacy policies for all services (see http://www.cam.ac.uk/privacy/) for a page with links to these plus a link to CERT and the Data Protection Office.
  • Have a link to accessibility information from your home page. This can give contact information for those who might have access problems with parts of your sites, and may also be used to detail information about physical access to your building, particularly for disabled visitors.

On the home page you may have the following:


whereas you may choose a reduced version on other pages:

Title

Ensure that the title of your page is a succinct and descriptive reflection of its purpose. This text will be used by browsers to bookmark the page and is ranked as significant text by search engines, so it is important to get it right - it might be useful for you to create a simple scheme for titles of pages on your site. Keep the title short as significant words become less so in longer titles than in short ones.

Metadata

In order to add information for indexing purposes you must add a metadata description to each page so that search results reflect the content of page rather the presence of the navigation bar. Keywords can be useful to produce search results for associated words not on the page. The following html has been inserted into the head section of the templates and on each page the entries must be completed: 

<meta name="description" content="insert here" /> 
<meta name="keywords" content=" " />

The description should be limited to about 50 words and the keywords to a maximum of about 10. Do not add more keywords or your page will be ignored by external indexing engines. Only plain text should be used.

Skiplink and accesskey information

The global navigation bar of the templates has built in skiplinks and accesskey information, which should be of help to those using speaking browsers. Those using graphical browsers should be unaware of the extra information built in. The link to information about access keys is to a file at http://www.cam.ac.uk/site/accesskeys.html. Please ensure that the placeholder for the skiplink does not get removed from its location at the start of the page content.

Character encoding

In order that pages can be correctly interpreted it must be possible to identify which character encoding (sometimes called 'character set') they use. There are two ways of providing this information for a web page:

  • it can be provided by a web server in the HTTP headers sent with the page, or
  • it can appear in an HTML meta-tag in the document.

On the web server http://www.cam.ac.uk/ we use the first option, adding a default character encoding using the Apache directive 'AddDefaultCharset'. An appropriate meta-tag for an HTML document using the ISO-8859-1 ('Latin 1') character encoding might be:

<meta http-equiv="Content-type" content="text/html; charset=ISO-8859-1" />

A meta-tag has been added to the templates but one will not appear if you save an existing page from www.cam.ac.uk as a template. If you do not take action to add the information by one of the two methods the pages will not be seen as valid.

Using scripting

To produce pages you can use scripted or content management solutions as is useful for you, with the proviso that the complete page that results should resemble the example template shown here. In the case of web applications, the structure of the page will need to be maintained in order to make the styles work properly, so your content will need to be added in specific places in the templates.

The title of this document is: Use of University of Cambridge web design: Adapting the index page templates
URL: http://www.cam.ac.uk/about/webstyle/adapting.html

Last updated: 12 April 2010