MedNet

Common Look & Feel (CLF)

​Learn about UBC's Common Look & Feel, and how to apply it to your website. 


What is the CLF?

The UBC Common Look and Feel (CLF) theme is a web design framework that supports the University’s brand identity and online reputation by providing a common look, feel and functionality to UBC websites.  It includes a header, footer and background that appears on every page of the site.

If your site is to be hosted through CMS (WordPress) at UBC Faculty of Medicine, the CLF is provided by default.

All websites using the CLF are required to use a UBC subdomain​.

Benefits 

The UBC CLF initiative is administered by UBC Communications & Marketing and addresses some important goals regarding the overall quality and functionality of UBC websites:
 
  • ensuring that HTML code meets appropriate standards
  • allowing users to navigate easily from one UBC site to another
  • providing some consistency in user interface elements across UBC sites
  • providing easy access to standard website tools (e.g., Search and Directories)
  • avoiding duplication of cost and effort in developing UBC websites
  • ensuring that UBC websites consistently support the brand identity of the university.

Current Version

The latest version of the UBC CLF was released in September 2012​.

The updated CLF comes with a number of design and usability improvements aimed to improve the user experience.  The biggest change is an integrated Responsive Web Design framework that adjusts or responds to a user's device. This means that all websites with the CLF will be compatible across device platforms, ranging from desktop computers to tablets and smartphones - addressing a growing trend of mobile device usage.  


Parts of the CLF

The CLF website splits the various design elements into three categories:
 
  • Minimum Requirements (mandatory): Red
    In order to maintain compliancy with the CLF, all Minimum Requirements must be met and remain unchanged
  • Highly Recommended: Yellow
    The Highly Recommended components of the design, as the name suggests, are not strictly required but have been designed and tested for optimal usability, accessibility, and browser compatibility.
  • Optional: Green
    Can be changed if necessary.

Making Changes

In general, it's important to carefully consider the motivation for making changes to the style and structure of your site. Considering the users of your site – who they are, what they might need, and so on – should assist in planning any potential changes.

The CLF was designed to accommodate the widest group of users possible, accounting for technical compatibility (such as older browsers and operating systems), usability (structural and functional elements of the site), and web accessibility guidelines (see WCAG for more information). Making changes without taking these same concerns into account could result in a degraded experience for your users.

Additionally, the Website Guidelines page on MedNet details current standards and best practices for websites. Should you choose to change any of the optional elements on your site, or if you are hiring an external developer to implement any changes, please refer to these documents for guidance.

CLF Colours in the Faculty of Medicine

There are various colour schemes that UBC has made available for websites. To maintain consistency across all Faculty of Medicine related websites, the Faculty is requesting that you use:

  • Main Header: UBC Blue (#002145) 
  • Unit Header: UBC Grey (#2F5D7C for websites) in the unit header . 

We also request that the words “Faculty of Medicine” appear in the unit header along with your unit name, in accordance with recommendations from UBC Communications & Marketing. (The Faculty’s template will be provided in this format.) A link to the Faculty of Medicine should also be included in the unit address in the footer; this can be set in the Theme Options for sites using the CMS service.

Any units wishing to deviate from either of these requests should contact Com​munications.

Example

CLF Header Example.JPG  

How to Adopt the CLF in the Faculty of Medicine

Send a request to Communications with “CLF template request” in the subject line, indicating that you want Communications to begin the process of applying the CLF to your website. 

For units whose websites are serviced by an external consultant, complete the online request form.  Please specify UBC Blue (#002145) as the colour code for the header and UBC Grey (#2F5D7C) for the unit header.

Who is eligible for the UBC CLF?

See the Guidelines and Requirements listed on the UBC CLF website.

Who isn't eligible for the UBC CLF?

 

See the Guidelines and Requirements listed on the UBC CLF website.​