New Buttons

We’ve included some new button styles with the updated designs:

Buttons created before the design updates are displaying as solid grey buttons. To get the arrow or file extension to display, you will need to re-apply a button style as either a link style or document style.

Some Facts

  • Document Buttons will detect the type of document and display its extension.
  • If there is too much text for the button, the arrow or doc extension won’t display.
  • If there is way too much text for the button, the text will be cut off at the end of the button.
  • Buttons that take up the entire width of the page are not recommended.
  • If a link has too much text for a button, then it should be styled as a regular link.

 

Global Navigation Updates

The Office of Communications has been working on refining the global navigation for the UNBC website. We’ve received a lot of feedback since we launched the new navigation system nearly a year ago, and we have been working to address many of the concerns that you’ve brought to our attention.

We’ve also improved the way the links display in the mega menu to improve use.

These updates will be put into effect the evening of January 2nd, 2014, in conjunction with the design updates http://blogs.unbc.ca/web/design-tweaks/.

Research

In addition to the feedback that we’ve received from a variety of web audiences, we’ve conducted in depth analysis of our web analytics to see how our web users are searching for UNBC online content, analyzed a report of over 2,000 higher ed website navigation systems and trends, as well as evaluated other navigation trends and analytics.

Using common terminology and organization of links helps web users such as prospective students, who may be looking at several higher ed website, find the information they are looking for quickly and easily.

The Result

Overall, the navigation has not changed substantially. Some terminology has changed (ie: from “Apply to UNBC” to “Admissions, from “Careers” to “Jobs”) and the location of some links has shifted.

Below you will find screenshots of the updated global navigation for your reference until we launch them in January 2014.

Global Navigation

Global Navigation – will display at the top of every page on the UNBC website. Click the image for a closer view.

Admissions Mega Menu Expanded

Global Navigation with the Admissions mega menu expanded. Click the image for a closer view.

Programs & Courses Mega Menu Expanded

Global Navigation with the Programs & Courses mega menu expanded. Click the image for a closer view.

Campus Life Mega Menu Expanded

Global Navigation with the Campus Life mega menu expanded. Click the image for a closer view.

Services Mega Menu Expanded

Global Navigation with the Services mega menu expanded. Click the image for a closer view.

About Mega Menu Expanded

Global Navigation with the About mega menu expanded. Click the image for a closer view.

 

Design Tweaks

The Office of Communications has been working on some design tweaks for the UNBC website. We’ve received a lot of feedback since we launched the new designs nearly a year ago, and we have been working to address many of the concerns that you’ve brought to our attention.

These updates will be put into effect the evening of January 2nd, 2014.

The examples below are just a sample of the improvements that we’ve been making.

Slideshows

Current slideshow design.

 

New Slideshow design

  • Easier to read caption
  • Button that allows the user to clearly see that they can link to additional information
  • Button also serves as a call to action to invite the user to explore more
  • Play/Pause Controls – allows the user to pause the slideshow for more time to read the captions and is an asset in terms of accessibility
  • Funky slant that mimics the angle in the “N” of the UNBC logo

Grid Alignment


  • The website has been fine tuned to align to a baseline grid. This helps ensure that text, images and other web content has consistent spacing and alignment. The changes here are subtle, but result in a significant improvement to the display of the content, enhancing the user experience.

Mega Menu

Current mega menu

 

New Mega Menu

  • We’ve improved the way that links display in the mega menus, improving the navigation experience.
  • We’ve also adjusted the sensitivity on the expansion of the menu, making it easier to use as well.
  • We’ve updated links in the global navigation as well: http://blogs.unbc.ca/web/global-navigation-updates/

Our Alumni

New Alumni Profile

Current Alumni Profile

We’ve fixed the issue of how the text  in Alumni Profiles wraps.

Events

Current event tab on the left, new designs on the right.

  • Times how display on a 12 hour clock, making it easier to understand at a glance
  • We’ve also displayed the campus and location for all events in the tabs

Buttons

Current buttons

New Buttons

Current Grey Buttons

New grey buttons

Web users often complain about clicking on a link when they don’t realize that it will open a file. We’ve added functionality to the buttons so that if the button links to a file, it will display the file extension showing the user what to expect before they click.

Colours

The colour palette has become more neutral. This allows greater emphasis on the content and less on any particular design element. The user will be drawn quickly into images, navigation, links and headings. These are the elements that are primarily sought when a user skims a web page for the content they seek.

We’re using the official UNBC green and gold, accented by grays pulled from various natural elements found on the UNBC campus, as well as a blue/green, again pulled from campus elements, that is used for links.

Adding a Menu Link

When adding a new item to the menu, it can’t link to nothing, therefore the page needs to be created first. We also won’t link to an empty page, so if you create a new page, add your content, and then submit your request for the new link.

Steps:

  1. Create the new webpage (if it doesn’t already exist).
  2. Submit your request at support.unbc.ca and include the URL of the webpage.

Communications manages all navigation content for the website. We will evaluate how the request relates to all navigation across the UNBC website in terms of consistency of language, content, user experience, and general web standards prior to adding the link.

Learn more about our standards for menus here.

A Simplified File Browser

We’ve simplified the file browser so that you’ll only have access to files from sections you have access to.

So, instead of seeing files from every section of the website, you’ll only see the files that matter to you :)

Those changes will be pushed out today, Sept 26, 2013.

Self-Guided Drupal Training is Available!

New User Drupal Training is now available as self-guided training. This new training involves watching a series of videos and submitting an assignment that demonstrates your new skills.

Estimated time commitment: 2-4 hours.

Register for training here: http://blogs.unbc.ca/web/drupal-training-registration/

If you’ve already registered, or taken in-class training, get started here: http://blogs.unbc.ca/web/new-user-drupal-training/