What's on the menu?

Designing an effective menu structure in the WMS

The design of a delicious website starts with a solid menu structure. The content may get the five star reviews but it's all thanks to the behind the scenes foundation on which the entire site rests. What makes for a great site menu?

The menu should be well organized. Like-items are grouped together so that visitors can easily navigate to the information they want to see.

The menu should have integrity. Too many off menu dishes, and a restaurant won't be able to manage inventory. Same with a website, disabled links can make the site unstable.

The menu should be as long or short as it needs to be. Your menu structure might require more than a short list of specials, and that's ok! Shorter menus are much easier to scan and read, but limiting your menu options to an arbitrary number can result in links that don't really fit the parent categories.

 

Why menu items should not be disabled

All pages should be browsable. Accessibility and find-ability is important when maintaining a McGill website. All sites should be easy to navigate, and people should be able to find their way around all the pages of a site with ease. Disabled menu items make it harder to get around. We have a responsibility to ensure all content can be found when a visitor is browsing the site, or has been directed by an external link. Both scenarios need to be considered to ensure all visitors are informed and not missing content. Disabling menu links prevents users from browsing all published pages.

All other McGill content types (McGill Profiles, articles, etc.) have an automatically generated way a visitor can browse all the content provided by the different types. This uses what's called an "aggregated listing" where you can find the content via the url eg., to see the articles on our site you can type https://www.mcgill.ca/web-services/articles. This automation ensures content is browsable and reduces the effort required for site managers to maintain the find-ability of all the site's content. 

Disabled menu items can pose other technical issues to a website. Specifically, disabled items can make the site structure unstable. Sites that have a number of disabled menu items can run into trouble where the menu can struggle to be saved after updates. Old menu items can briefly appear under the horizontal menu when your website loads, and sometimes menu items, that should exist, can disappear altogether.

All of this becomes even more challenging when working with new site managers that are not familiar with all the content decisions made in the past. If you strongly feel you have a legitimate need to have content without a menu link, reach out to us to discuss the details so we can explore options that can benefit everyone. 

 

Designing a great menu structure

So, how can you ensure that your site has the integrity of a perfect flavour profile? 

A great menu revamp starts with what's already on offer

Consider all the building blocks of your site and how they work:

  • Basic pages and restricted pages can be found via menu items. The key content for your site belongs on your pages, and those pages should be grouped together in a way that has a logical flow. 
  • Articles can be found through the listing /articles. This can be a great option for content that doesn't really fit into your menu structure. Articles offer a lot of flexibility: they can be categorized, and displayed as a block, or you can paste a link so folks can find the content. 
  • McGill Profiles can be found through the listing /people. They have a dedicated page on the site that makes it easy to feature your faculty, staff, and all the other cooks in the kitchen.
  • Channels news and events items can be found through the listing /events or on the channels hub. They are ideal for more timely content like your faculty in the news, or a call for submissions, or an academic talk or concert.

 

menu on a chalkboard sandwich boardReview:

Take a look at your existing menu structure, preferably in some sort of format where you can move things around to look at it in different ways. Maybe recreate it in excel, or a whiteboard tool, or throw it up on a chalkboard (or whatever scrap paper you have laying around). Who are you hoping to reach with your site- is there more than one audience? Jot down the key information that you expect folks will be looking for.

If you have menu links that are disabled- make a note. A good question to ask is why was that link disabled? Is it because it didn't fit with the parent? Or maybe because the menu was getting long? Perhaps you didn't want the side menu to appear on the landing page, or have too many items in the horizontal menu to display them all? (More on those two down below)

Rethink:

Experiment with other groupings to see if they accommodate the content with a better flow. There is a lot of choice here, and it will depend on what you are trying to do with your site. 

We recommend starting with the level one menu items. These typically appear along the top of your site in the horizontal navigation. They direct the attention of your visitors in the broadest sense. This might include an About page for some general information, a People page that showcases your staff. If you have content geared toward very specific audiences (students, the public, committees) or topics (research, publications, programs), the level one menu items provide the visitor with access to the information that they crave. Are there items that are a bit too specific here? Two or more items that might fit under a broader topic? Pick out the really great ones and start to sketch out a new look. Anything you're not sure of, set to the side for now.

Next, we suggest going page by page, looking at the child pages. Do they all fit under the topic of the parent?

Once you have done this exercise with each page and the pages nested underneath, it's time to take a look at the content that you have set aside. Could the content from these pages be combined into others? Is the content something that visitors can find on other sites? If you have 'stubs'- pages that really stand alone, but aren't important enough for the main menu, do they need to be pages? Could they be repurposed as articles?  

Removing the side menu

You might have a landing page or two, where you want to have a visual impact without a side menu taking up space. This is something that can be enabled by request on the IT Support site.

Before you make that request make sure that all the pages that are in that menu appear as blocks or links on the landing page- that way you don't sacrifice the function of your site for the sleeker look.

  • statement block for each page can have a great visual impact
  • list block can allow you to create a mini-menu without taking up that side menu real estate
  • Consider if a mega menu might be appropriate 

For more information, read this article: Vertical menus: to remove, or not to remove.

More items than the horizontal menu can display

If you have a significant number of primary menu items, you might find that only some of them appear on the horizontal menu. This is a space issue- the font needs to be easy to read, so the number of items that can be accommodated is limited. You can choose to prioritize menu items by adjusting the weight - making sure your key items weigh less so they rise to the top, and the less important items heavier so they sink. You can adjust the weight on the Edit page screen, or edit the menu link itself.

Another option would be to switch the horizontal menu to a vertical menu.

How long a menu is too long a menu?

A well designed menu is efficient. Your visitors don't have to memorize every item, they follow the path you put before them- recognizing the categories and sub categories that follow the logical flow.

A side-benefit to shorter menus is that they will adapt well to the accessibility improvements we make to the WMS, including larger text and space around words for easier readability. 

 

Delivery of the design

Ready to revise while the pan is hot? 

Check out the article that will give you the steps on how-to build and restructure menus in the WMS 

Would you rather do a taste test first?

Maybe you are thinking about some big changes, and you want to see what they look like before committing. You might like to work with a staging site.

If you'd like to combine this exercise with a more robust reinvention you can request a consultation

Now that you have put all your ingredients on the table, you can whip up a delicious menu that will have people lined up down the street! 

 

 

Back to top