Web Development Team Meeting March 16, 2005 Attended: Carell Jackimiek Ginny Aho Betty Braaksma Amrit Chhina Caroll Cooke Ganga Dakshinamurti Lyle Ford Richard Jones Gail Mackisey Mullai Manickavalli Elviera Mearon Susan Miller Juliette Nadeau Carolynne Presser Elizabeth Serhal for Val Ward Lori Webb Marina Webster Jared Whiklo Lesley Wise Bill Wsiaki Meeting Summary The meeting had two main agenda items, a presentation by Richard Jones on the university’s new web page design, and a discussion of how the Libraries’ would respond to the new design. The new web page design is the result of a new approach to the university’s website by the university’s administration. The design was created by BIMM communications, a marketing company from Ontario. BIMM was hired by the university administration and the university’s Public Affairs department. UMinfo has been tasked with implementing the design but does not have the authority to make any changes to the BIMM design which has already been approved by the president’s office. The new design is expected to be implemented by UMinfo by the end of March. All subsequent new website work being done by university faculties and departments, including the Libraries, will be expected to adopt the new look. This includes the current work that is being done in RedDot.

Regrets: Norma Godavari Heather Racano Ryan Schultz George Talbot Liv Valmestad Joe Westra Asako Yoshida

In general the new website strategy has the university homepage now under the direction of Public Affairs for the purpose of attracting new students and presenting university news and information to the public at large. The “jump” portal, faculty and department pages will offer the main local access points to university information and resources. During the presentation of the new home page design, several questions and comments were made by the WDT members regarding the new design and issues surrounding its implementation by the Libraries. Summary of Comments: Overall impression:

• New design has a corporate layout and presentation. • Many images competing for attention. • Lots of text and very little white space. • The new design does not incorporate the latest web technology. Appears

to be a step backwards from current web design practices. • Overall response from some people on campus who have seen the new

design has been favourable. Accessibility concerns:

• The drop down menus and fly out menus are difficult to navigate by people who struggle with fine motor control.

• There is not much contrast between the font colour and the background colour of the drop down menus, which can be difficult to read.

• The lettering on the sidebar menu of the faculty pages is all capitals which can also be difficult to read.

• The font size cannot be changed without the page breaking up. Richard’s group is looking at adding 2 buttons on the menu bar (+) and (-) to change font size within the page without adversely effecting the page layout.

UM Home page:

• The page is basically a program. Most of the feeds are automated, and this increases the loading time of the page. This could cause performance issues on older computers.

• User statistics may change on the new UM Home page if students bypass this page and use the JUMP page instead.

• The JUMP portal link does not appear on the UM main page.

Top banner: • The top banner of the page will appear on each page of the website along

with the drop down menu bar. • The image on the top banner is required but could be any image the

faculty or department would like to present and can be rotating, eg. seasonal scheme was suggested during the design phase.

• Google search appliance will not be featured, only a search box will appear.

• Search box will search UMinfo and entry point. To search google will require going to a search page.

• People Search will not appear on the web page. Might appear under one of the drop down menus, perhaps under Faculties & Staff.

• The top banner colour is fixed, no colour deviations permitted. • Department name and unit name must “fit” on the banner. This could

present space problems for long names: e.g. Libraries Eckhardt-Gramatte Music Library Both of the names will be links back to either Libraries’ home page or Music Library’s home page.

• Richard thinks there may be some opportunities to make alterations to the menu bar.

Faculty or unit splash page:

• Basic layout has not changed a great deal (3 column layout) with the exception that the top banner and top menu bar is fixed.

• The left-side menu bar will be able to accommodate some colour changes based on palette guidelines by BIMM. Font on the left-side menu bar is caps only.

• The centre column has an area for an image and/or logo and some text for ‘about’ the faculty or unit. UMinfo is building a library of stock photos for faculties and departments to use. Imaging Services will also take photographs for individual departments for their web pages.

• The third column has news and events and a photo area at the top to associate with the news item.

Content pages:

• So far BIMM has not provided a template for a two column page but Richard believes this would not be a problem.

• For items such a BISON, the page could remain the same with the exception of having the fixed top banner and menu bar.

Actions: Richard Jones will send a link to the new web pages to Carell for distribution to the rest of the WDT. Carell will send out new web page links and meeting summary to WDT members. WDT members are asked to take the new design and discussion points to their constituents for feedback. A new meeting will be arranged to review the feedback and compose a document of Libraries’ issues and concerns regarding the new web page design. This document will be sent by Carolynne Presser to the appropriate parties.

Document Created for:

University of Manitoba

Project:

Website Style Guide

February 11, 2005

Table of Contents

Image Treatments ......................................................................................7 Template Layout ........................................................................................8

Standard Header Bar .........................................................................8 Standard Navigation Bar ....................................................................8 Standard Footer .................................................................................8 Standard Section Home Page............................................................9 Standard Section Content Page.......................................................10

Font Treatments:......................................................................................11 Main Navigation Bar .........................................................................11 Left Navigation Bar...........................................................................11 Default Body Copy: ..........................................................................11 Links within Body Copy: ...................................................................11 Default Article Summary Copy: ........................................................12 Links after article summary: .............................................................12 Content Page Title ...........................................................................12

Please Note: 1. Colours used within this document to illustrate examples are not accurate,

please use the hex colour code provided within each style’s details. 2. Font sizes used within this document to illustrate examples are not accurate,

please use the exact sizing provided within each style’s details.

Image Treatments Ideally, images should include: - Student/Faculty/Researcher in their environment of study and/or

research e.g. the laboratory - Feature subjects looking at the camera, smiling or with positive manner

suggesting accomplishment - Campus shots that are sunny, bright, avoiding backdrops of areas that

are unkempt or under construction and dreary winter shots Examples:

Template Layout Please note:

- Diagrams show width and height of key elements in pixels - These dimensions are a guide only, and may need to be altered

slightly when the actual templates are being constructed. If variances are needed this document should be updated to reflect them.

Standard Header Bar All pages will utilize a section specific header bar containing the university logo, department or faculty name and a graphic specific to the university as demonstrated below:

If no section specific header bar is available then a generic one can be used as demonstrated below:

Standard Navigation Bar This navigation bar is found directly underneath the header bar for all sub sites as demonstrated below:

Standard Footer

- Breadcrumbs may shift to the right to accommodate a left navigation bar (See standard section home page below)

- University address and phone number are centered

Standard Section Home Page

Standard Section Content Page

Font Treatments:

Main Navigation Bar

| THIS IS A MAIN NAV BAR | Font: Verdana Colour: White

Treatment: Small Caps Size: 11 (Photoshop sizing) Line Spacing: n/a

Left Navigation Bar

| THIS IS A LEFT NAV LINK | Font: Verdana Colour: White

Treatment: All Caps Size: 11 Line Spacing: 13

Default Body Copy:

This is generic body copy Font: Verdana, Arial Colour: Black

Treatment: None Size: 12 Line Spacing: Normal

Links within Body Copy:

This is generic body copy. This is a link this is more copy. Font: Verdana, Arial Colour: Black

Treatment: Underlined Size: 12 Line Spacing: Normal

Default Article Summary Copy:

This is an article title This is the generic article summary copy

Font: Verdana, Arial

Colour: Black on light coloured backgrounds, White on dark coloured backgrounds

Treatment: Title is bold Size: 12 Line Spacing: Normal

Links after article summary:

This is generic body copy. Full Story Link >> Font: Verdana, Arial Colour: # 601F01 if on white, # FFFFFF if on dark background # FDB71B if on light grey background

Treatment: Title Case Size: 12 Line Spacing: Normal Notes: The alignment of this type of link can change in

order to make the best use of space within the article box area.

Preferred verbiage include:

• Full Story >> • More News >> • Event Details >> • More Events >>

Content Page Title

THIS IS A CONTENT PAGE TITLE

Font: Verdana, Arial Colour: Black

Treatment: Small Caps Size: 18 Line Spacing: Normal