Making Full Use of Your School Website Navigation

Apr 15, 2016

Your school website navigation isn’t only there to act as a static map or as a general guide for touring your website. It can also be used for marketing – you just have to make the user more aware of it. How? By treating your navigation not only as a directional tool but as one of your main advertising outlets.

Here’s a few ways to re-invent your school website’s navigation.

Point Out What Sets Your School Apart

The first thing prospective parents are likely to click on is your navigation so why not just put the main thing that sets your school apart in there? Use its position and consistency to deliver additional information about your school programs that would make you the better choice from the competition. Mixing in your school’s theme and website color scheme will also do you good, as well. Take a look at this example from Summercroft Primary School’s main navigation:

Summercroft Primary School

Make a Point of Highlighting Your School’s Mission

Your school’s mission is the very essence of what your school stands for so it’s very important to capitalise on every chance you can get to share it online — and your school’s navigation is no exception. Marriotts School’s use of their official logo provides a subtle impact whenever the user scrolls or navigates through their website.

The image below is Marriotts School’s full menu.

Marriotts School

When the user scroll down, the menu shrinks in depth but is always available for fast and clear navigation alongside the school’s logo.

Marriotts School's sticky menu

Associate with a Specific Course or Student Body

Prospective or current students can immediately identify which pages to go to when navigation items are assigned to them. We can learn from how William Edwards School design their navigation. When you display exactly what the user wants, in this case, students, you deliver relevant content easily and immediately within their reach.

William Edwards School

Use Secondary/Tertiary Navigation To Provide Quick Links

A secondary menu allows you to keep your main navigation structure clean and concise while still highlighting crucial links and information like social media and, more importantly, contact information.

Manshead School takes this into effect by using their top navigation to list their contact details, as well as offer quick links to their social media page.

Manshead School

Marriotts School also uses their top navigation menu but this time, instead of social media links, they advertise their training academy and sports centre.


Normally, limiting the amount of sections in your navigation to two can help in making it simpler and less obstructive but the use of a third or tertiary section can be as effective, especially if positioned properly. One very good example of this is Onslow St. Audrey School’s hidden flyout menu. Its position is unobtrusive and the unexpected entrance animation can add some extra glamour to your overall design.

Onslow St. Audrey

Streamline Your Visitor’s Journey

Have you ever visited a web page and scrolled all the way to the bottom, only to realize that the page didn’t have what you’re looking for and you need to scroll all the way back up to the top to go to another page? While it isn’t difficult, it can become slightly annoying.

As long, scrolling pages become more popular, sticky navigation is important in providing a great user experience.

Sticky menus are navigation elements that stay in one location on a site even when the user moves a webpage up or down. Ralph Sadleir school’s website has a navigation that stays at the top of the screen as you scroll down through every page.

Ralph Sadleir sticky menu

One excellent UI feature is to have your site’s navigation always present so users can easily navigate around your site or a page without having them scroll back up again to the top of the page.

Simplify Your User’s Experience

A successful website always has a great navigation. Not only does having one improve your user’s experience, it also makes them stay longer as all relevant information is just a click away.

Before you start thinking of redesigning your next site: think about how you design your navigation first. Remember, it’s not only a means to an end but can make or break user experience. Having a great website navigation can potentially lower bounce rates, set your school apart and can spark excitement in your website visitors.