Web guidelines

Brunel’s web pages are created in a content management system (CMS) designed to ensure that the University is presented in a consistent, professional and unified way.

Web policy

All pages on the website, and any documents that are accessible from those pages, must conform to the current policies of the University. Heads of Schools, Centres, services and administration departments are responsible for ensuring that the content, format and linking of documents emanating from their domain conform to the Brunel guidelines as outlined in the University’s web policy: www.brunel.ac.uk/web

The Director of External Affairs is empowered, if necessary, to arrange with the Director of the Computer Centre for pages that do not conform to these policies to be removed or their access curtailed.

Graphics and logos

The fast access provided by the Brunel server may not be enjoyed by everyone accessing Brunel pages, such as visitors from overseas or those with more humble equipment.

Photos and graphics, especially large or animated files, can take a long time to download. Research has shown that the average reader will wait no longer than a few seconds for a page to load unless waiting for a specifically requested graphic.

The size and resolution of graphics should therefore be optimised for the Web. Check the Web Templates page for guidelines.

If you have a large or complicated image, give the reader the option of whether or not to load it by putting it on your page as a link, preferably quoting the file type and size. Be sure to give a brief description for those using text browsers or with graphics turned off. For example: House Style Manual (pdf 2.0 MB).

Backgrounds

Backgrounds, especially those containing a watermark, can also be slow to download and can make text hard to read. Editors should use only a plain background on their pages. Individuals accessing Brunel pages who prefer a coloured background (if, for example, they have dyslexia, an off-white cream or pale blue is sometimes preferred) can automatically change it if they wish to. More information is available on Brunel’s Disability and Dyslexia website: www.brunel.ac.uk/life/welfare/dis/accesshelp

Photo use and data protection

It is essential that you have permission to use an image of an identifiable individual in any photos used on your pages. All photos taken and supplied by the University Photographer for use on the web will automatically have such permission but this can be withdrawn by an individual at any time.

The photos available to editors in the CMS have no restrictions on usage.

More information on Data Protection can be found on the Web: www.brunel.ac.uk/policies

Fonts and headings

The website is built from formatted templates that use specially selected fonts and heading styles. This ensures consistency between pages and between different sections of the web.

Fonts

The designated font for header and body text is Arial (which will default to Tahoma, Helvetica and then the next default sans serif font).

Headings

Body text will be pre-set within the standard style sheet. Heading sizes can be selected according to the following hierarchy:

  • Heading 1 – the main page heading, H1, is set automatically for the title of a new page;
  • Heading 2 – sub-section headings;
  • Heading 3 – headings within an H2 Section;
  • Heading 4 – headings within an H3 section.
It is important to maintain a headings hierarchy on your web pages for a number of reasons, including:
  • clarity: your main page heading should be obvious;
  • accessibility: visually impaired people use voice screen-readers to browse the web, and these read out page headings in the above hierarchy. If you mix and match, these user groups will find your pages difficult to navigate and understand.
  • search engine optimisation: tracking software used by search engine sites
    (eg Google, Yahoo, Ask) rate H1 headings higher in their rankings than, for example, H2, so always using H1 as the main page title increases your page ranking in their results.

Web accessibility and Special Educational Needs legislation

All Brunel web content and services should be available to everyone, including:
  • users with disabilities (eg visual impairments, cognitive impairments, motor impairments);
  • users of various software (eg different browsers); in fact any user who may need something from our website.
Accessibility is important in ensuring all users can access content on our website, but the University also has a legal obligation to meet accessibility standards under the Special Educational Needs and Disability Act 2001 (SENDA).

This legislation rules it unlawful for responsible bodies to treat a disabled person ‘less favourably’ than a non-disabled person for a reason that relates to the person’s disability.

All University web pages must therefore comply with the requirements of the SENDA legislation.

To ensure accessibility, the Brunel website templates are coded to W3C’s Web Accessibility Initiative standards.

Web accessibility essentials

The Web Accessibility Initiative has produced a list of basic tips for improving web accessibility, some of which follow.

  • Images and animations: Make sure each image has an <alt> tag to describe its function. This appears as a yellow flag description. Users who switch off the images will be able to see what is important.
  • Multimedia: Provide captioning and transcripts of audio, and descriptions of video.
  • Hypertext links: Use text that makes sense when read out of context. For example, avoid “click here”. People expect links to be blue and underlined.
  • Page organisation: Use headings, lists, and consistent structure.
  • Scripts, applets and plug-ins: Provide alternative content, in case active features are inaccessible or unsupported.
  • Frames: Use NOFRAMES and meaningful titles.
  • Tables: Make line-by-line reading sensible. Summarise. Data tables should have the headings marked.
  • Drop-down menus: Avoid the use of drop-down menus that use JavaScript. Disabled users can’t tab to them. Also, they can fail badly if the user tries to alter the style sheet or customise the browser.
  • Javascript and Flash: If you do use these technologies, which may cause accessibility problems for some users, you should provide an accessible alternative.
  • New browser windows: Avoid opening new browser windows or tabs unless essential. This breaks the browser back button making it harder for disabled users to navigate backwards. Warn your users if a new window is going to open.
  • Background colour: Ensure that there is good contrast between the background and the text, and avoid overlaying text onto textured or patterned backgrounds and images.
  • Changing font size: Provide information on how to change font size or background colour for users with, for example, visual impairment or dyslexia.
For information on how to change font size and colours, and about adjusting background tints, please check our guidelines.

Another valuable source of information on adjusting web pages to suit the needs of users with disabilities including hearing and mobility difficulties is the BBC accessibility website: www.bbc.co.uk/accessibility
 

Page last updated: Wednesday 06 April 2011