Design specifications of the templates
The new UniSA corporate templates have been designed to create and ensure a consistent look and feel throughout the website in line with the University's corporate image. The templates have been developed using Server Side Includes (SSI) and Cascading Style Sheets (CSS). The Style Sheets control the look of elements such as font, line spacing, header sizes, text placement, image placement, bullets etc. The templates have been designed for the author who has little or no experience of web authoring, so are custom made to make web authoring easier by eliminating some of the planning process of web design.
Standard elements and features of the templates
Banner
The corporate banner is a standard part of the template. The following are its specifications
- a specified width
- UniSA logo only, located in the left hand side
- solid colour in 8 'web safe' colours (5 University division colours and 3 UniSA corporate colours)
- a graphic in the right hand side composed to corporate requirements (see more information about graphics, or go straight to the banner graphics)
- the name 'University of South Australia' for web pages with corporate content. For banners of division/school/administrative unit websites, the name will appear on the left hand side beside the UniSA logo
Note: Each division has a colour assigned to it which is used for publications and for web banner colours. All schools and research centres/groups are required to use the same banner colour as their division.
Once you have selected the colour and graphic for your banner, MDU will provide you with the banner incorporating all the selected elements as part of your templates. A degree of flexibility for administrative units, divisions and schools to incorporate their individual identities is available through the following ways.
Eight 'web safe' colours ('web safe' means the colours will display consistently across browsers) can be used for the banner, of which
- five are assigned exclusively for divisions and schools (schools and research centres/groups are required to use the same banner colour as their division)
- three (UniSA corporate colours) can be used by any unit, school or division
| UniSA corporate colours | |
 |
University blue |
 |
University red |
 |
University yellow |
| Divisional colours | |
|
|
BUE |
|
|
EASS |
 |
HS |
 |
ITEE |
 |
Whyalla |
Name and logo
The UniSA logo must feature in the left side of the banner. No other logo can be featured. Names of administrative units, divisions and schools feature immediately beside the UniSA logo. For school and research centre/group names, the name of the related division appears above it but in a smaller font. These are illustrated below.
As part of the standard requirement, a graphic is featured in the right side of the banner. A set of graphics, composed to corporate requirements, is available for administrative units, divisions and schools to choose from. If you would like to use your own image for the graphic, supply the JPEG to MDU for incorporating into your banner. The format and quality of this image will be negotiated between you and MDU.
Toolbar
The grey toolbar is mandatory on all sites. An option to change the toolbar may be provided if an area uses a University sub-site home page template. This occurrence is expected to be rare and is subject to approval by the Web Management Group.
Site-wide links (pillars)
The five major headings beneath the grey toolbars are known as the pillars (About UniSA, Study at UniSA, Research, Business and community, Resources for staff)
The five pillar headings are a mandatory feature of the templates. If areas choose to modify the pillars, approval must be obtained from the Web Management Group, providing the following specifications are followed:
- Only those who have received approval to use the sub-site home page template can modify their pillars
- There must be a minimum of three pillars and up to five pillars.
- There must be a minimum of three and no more than six subheadings beneath each pillar
- The pillars on the sub-page template will reflect the pillar structure of their home page
- The wording of area specific pillars must be substantially different from that used on the University home page to avoid confusion.
If areas choose to delete the pillars completely, approval also needs to be obtained from the Web Management Group. Contact the Web Management group.
Footer
The footer is a standard part of the template. It has the following links
- Disclaimer
- Copyright
- Privacy
- Australian Technology Network
- Web accessibility
- CRICOS Provider no: 00121B
- Contact UniSA
Page design
Pages in the templates have the following features
- designed for screen resolutions of 800x600 pixels (considered the ideal screen size for accessibility for all users)
- fixed width of content area
- no use of frames as frames pose a web accessibility issue
- use of images and graphics in the content area
Content and Cascading Style Sheets (CSS)
- Arial as default font: normal text, medium text, small text, alert
- three headings: heading 1, heading 2, heading 3
- horizontal rule (if used) of 1 pixel in height, standard FrontPage grey
- left hand navigation in pre-set font and style (Arial bold, Arial light)
Navigation
- left hand navigation comprising three collapsible levels (only one level 2 heading can be open at a time)
- no use of drop down rollover navigation as this poses a web accessibility issue
Colours
- 'web safe' colours for banner, logo and fonts
- 'web safe' colours for navigation elements (blue for all links, red for on-click links)
- white background for content area, black text for normal style, header 1 red, headings 2 and 3 black, hyperlinks blue
Images
- all images flushing to the right side of the page
- use of formats compressed for the web (JPEG and GIF)
- use of alternative (alt) text on all images
Types of templates
There are three standard types of templates:
leftmenu.asp
This template will be the one you use in most circumstances. It includes the left hand navigation designed for a three level menu. Fewer links to other pages in your site will be needed as they will be present in the left hand navigation This template is used for the home page of converted sub-sites.
no_left_menu.asp
This template will be used when no navigation is required but it has a left margin to ensure that the same look and feel is maintained. This may be used for fourth level pages (eg About UniSA/Introduction to UniSA/History/Milestones which is four clicks from the home page) or long pages with content headings
fullscreen.asp
This template will be used for large diagrams and/or images or any content where you need as much space as possible eg maps and organisation charts. There is no left hand column in this template
Subsite homepage template
A University subsite template is available in rare instances for areas to use as their home page, which incorporates several of the design and function features of the University home page. All areas that use this subsite home page template must have their home page design approved by the Web Management Group. Subsequent pages must revert to the left hand navigation as provided for in the other three templates. Areas may also develop their home pages by using one of the other three templates provided. Refer to the Web Management Guidelines (PDF 574kb - download Adobe Acrobat).
File type of the templates
The template files have been created in 'asp' which stands for 'active server pages'. Asp files contain special scripting necessary because of the use of server side includes (SSI) in the design of the templates. Through the use of SSI, common files control standard elements such as the banner, toolbar, site wide navigation, left hand navigation style and footer.
As a result of the use of asp files, the URLs of pages created using the new templates will end with .asp as opposed to the current .htm. Therefore links on your current site to new corporate pages on the UniSA website will need to be changed. Similarly, after your site changes over to the new templates, you will need to create redirect pages for your second level index pages. See Requesting link changes for details.