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.

Standards for Menus

The Office of Communications is developing standards for local navigation (the menus on the left panel of sections of the UNBC website).

This will be an ongoing project and we’ll post updates as we develop the standards. We’re looking at things such as terminology that makes sense to the user, placement of links that are common across sections, and content that does not belong in the menu.

Here are some that we’re working on now.

UNBC Menus will Link to UNBC Content

Menus on the UNBC website are intended to help the user find content within the UNBC website.

We are not able to indicate that a link in the menu takes the user to content outside of the UNBC website, which can result in us losing our web user.

In addition, we have no control over the function of the external link. Including the external link on a web page, rather than the menu, allows us easier ability to find and fix broken links.

  • Links to any online content that is not part of the UNBC website should not be part of a local menu
  • Links to external content should be accessible on a webpage
  • The webpage with external link(s) can be linked from the local menu
  • We recommend that a brief description of what the user will find when they click on an external link be included (wherever appropriate)
Links to Files Do not Belong in Menus

In order to better track online assets and to keep navigation simple, files (PDFs, etc.) will not be included as direct links from menus.

In addition, we are finding that documents links in the local navigation are frequently updated. This results in menus that are harder to maintain.

Instead, the document(s) should be included on a webpage(s) and the menu links be directed there.

Faculty, Staff, Contact

  • Faculty listings will be included on their own dedicated page.
  • Staff listings will be included on the contact page.
  • Faculty and staff will not be combined on a common page.

Search Functionality Updates

Search Functionality

The search tool for the UNBC website has been updated. The indexing system for content is better and users are presented with several tools to help filter their search results.

We hope that you’ll see an improvement in finding content thanks to these updates.

A – Z Site List

By popular request, the UNBC website has been enhanced with an A-Z Site List.

The link is in the topmost right corner of the global navigation (green bar at the top of every webpage) or directly at www.unbc.ca/search/a-z

The list is manually maintained and contains over 500 links. The list has been extensively reviewed and updated to ensure the list is current and accurate as possible.

Please let us know at communications@unbc.ca or using the Website Feedback form (http://www.unbc.ca/contact/web-feedback) if there are any links that are missing, should be removed or that are producing erroneous results.

Many thanks to Pablo Gosse and Emilie Madill for their work in getting these updates published.

Cheers,
Kim

Update: Hourly Publishing of Content

Currently web content updates are being pushed to the live site at 11:00am and 4:00pm.

Pablo Gosse has been working on our Drupal environment to accommodate increased publishing of updates. We will be testing hourly publishing of content starting today, for the next week.

If we encounter any problems we will be reverting to twice-daily publishing. We’ll be sure to keep you informed if this is necessary.

The hourly publishing schedule will occur at quarter past the hour.

So, the publishing schedule for the next week will be as follows:

  • Thu April 4th:                                       Hourly publishing, 10:15am – 4:15pm
  • Fri April 5th:                                         Hourly publishing, 9:15am – 4:15pm
  • Sat April 6th:                                        No publishing
  • Sun April 7th:                                       No publishing
  • Mon April 8th – Thu April 11th:      Hourly publishing, 9:15am – 4:15pm

If the testing period performs without error, we will continue the hourly publishing from 9:15 am – 4:15pm weekdays.

If you have any questions, please don’t hesitate to contact us.

Regards,

Kim and Pablo

Accessing Drupal Off-Campus

To access Drupal off-campus, use UNBC’s VPN (Virtual Private Network) to access the Drupal servers. You will need administrator access to your computer as you’ll need to install software.

  1. In your browser (Firefox or Chrome) go to: http://www.unbc.ca/vpn
  2. Choose the appropriate download for your operating system.
  3. At this point, you’ll be prompted to install the Cisco AnyConnect Secure Mobility Client. Follow the instructions to download the Client.
  4. Once installed, the VPN Client will request a Server. Type in the following: vpn-gw1.unbc.ca and click connect.
  5. Enter your username as “uni\username” and password.

You can then proceed to log in to Drupal at: https://drupal.unbc.ca/editor-login.

If you require further assistance accessing Drupal off campus, please contact the help desk or put in an online support request.

Help desk:  250-960-5321
Online support: http://support.unbc.ca

 

Microsoft Word is Bad

Never copy and paste content directly into a web page from Microsoft Word.

UNBC Uses Web Style Sheets

All content on the UNBC website is designed with specific styles for text in terms of font, sizes, colours and more. This helps all content share a common look and feel so that it is distinctly recognizable as being UNBC branded. It’s not just about branding, however; it’s also about creating a strong user experience.

The use of common styles across the website means that a web user can easily browse the UNBC website and scan content without having to relearn how content is presented.

Microsoft Word also uses Styles

And they are not the same as the UNBC web styles.

Microsoft Word is a word processing tool and is not meant for publishing web content. Fonts in Word may not be accessible online; text sizes are defined by styles and code meant for printing, not for the web; etc. The coding used by Microsoft Word to define styles of content for word processing just does not work online.

Copy/Paste from Word Corrupts Web Code

When you copy content directly from a Word document, the styles defined in Word will attach to that content and be pasted into the web code along with your text.

Code that has carried over MSO (Microsoft Office) code is easily identifiable:

What Goes Wrong

Everything.

It is nearly impossible to style content with MSO code attached using UNBC’s web styles. The web code will have a very hard time resolving what should display. And not just about what text to make Header 3, but it can break the entire layout of the webpage.

When the UNBC website migrated into Drupal, we encountered many pages with MSO code. As the old content management system used outdated HTML standards, these pages would

often display fine. Now that we are using current web standards, this is no longer the case.

Here are some screenshots of some worst case examples of how MSO code broke UNBC webpages:

 

Recognizing the Problem

You might have an MSO code problem if you find that you are having difficulty editing a webpage, even when following simple, step-by-step editing directions.

MSO code has caused problems ranging from not being able to apply UNBC web styles, to content disappearing or shifting on the page, to not even being able to edit/select text on the page.

Fixing the Problem

There are two options:

  1. Review and repair the code on the page, line by line.
  2. Start from scratch.

Most often, we will delete all content and code from a page that has MSO code embedded within it as repairing the code manually is simply too time consuming and prone to error.

Preventing the Problem

Preventing this problem is easy peasy.

Simply past your content from MS Word using the “Paste as Plain Text” button within the Drupal WYSIWYG editor.

This will remove all formatting and MSO styles and paste your content into the page as plain text. It’s just like copy and pasting your content through Notepad before pasting in the web page.

From there, you can add appropriate styles as selected from the UNBC web styles.

Tip: Don’t waste your time formatting your content in Word if it will be displayed online. You’ll just end up doing it again in Drupal. 

In Conclusion

  • MS Word is excellent word processing software.
  • MS Word is not meant for web publishing.
  • Editing pages that have MSO code embedded within them is a nightmare.
  • Never copy and paste into a web page directly from MS Word.
  • Always use the “Paste as Plain Text” when copying content from MS Word into a web page.