0

I'm not sure what this is called, but when a site's navigation takes you to the relevant section on the same page that the navigation is on. Here's an example (click "Home" at the bottom): http://newcareersrevolution.com/

I have a new client who wants to work with a template that already does this. The problem is, it's an event production company offering quite a few services and quite a large portfolio they wish to display, so there's simply too much to fit on the home page.

Is it bad practice/UX to allow the nav to zoom to the relevant section, then, if appropriate, have further links on that section of the page to more in depth pages?

If not, the question then becomes, what happens to the nav/scroll aspect? My thought was to simply replace the above-the-fold content of the home page (just a big hero image and headline) with the content of the new page, and keep everything below it the same - that way retaining the nav functionality.

Can anyone think of a better solution, or is this a bad idea altogether and I should encourage the client to stick to a more conventional navigation structure?

2

So my one question would be: Does the top bar stay static and it is then used for in-page navigation?

In my experience there are two reasons people use top bars that navigate in page only:

  1. You have a lot of data on the page, and need to be able to easily move between sections.

  2. 'Feel' When you click 'WHAT WE DO' and are smacked in the face with some really attractive / engaging header it can feel like you are on a new page, but you aren't. Some of that 'Wow!' effect is lost if they just scroll down.

If you want to use both, consider why it is important.

Are you gaining anything from using an in-page navigation header that isn't already present by using the traditional scroll down?

If I was going to have both, a multi-page menu header and an in-page selection that auto scrolls you to a relevant section, I would probably use a format like this:

[MENU FOR MULTI-PAGE SITE NAVIGATION] - Static, always at top of page.

[MENU FOR IN-PAGE NAVIGATION] - Dynamic, as you scroll down, it detaches and continues down the page.

This format gives you the best of both worlds. You have a bar at the top that allows the user to always move between sections of the page, and then when they get to the top they can navigate to another page of the website.

I still advise you to take a good look at what you gain from using an in-page navigation bar. If a user can get the same, or better, experience by simply scrolling down then I think its not as important.

If you are using pop-in animations like having content elements slide when you get to a portion of the screen I think the in-page scroll header is a good thing, it means that your animations are guaranteed to trigger when the user is in the best place to view them. Instead of losing the 'Wow!' factor because the animations were firing while he was scrolling.

Good luck.

1

Psychology

From a behavioral perspective, scrolling up and down to find unrelated content just complicates things... leading to frustration and possibly hurting the brand subconsciously.

Learn more about Emotional Design.

Animation

You mentioned "zooming" to a different part of a page. Although as programmers we want to say animations are good, especially because they take more effort to make, real users have the attitude that animations make a website look "cheap."

Links

Linking to different parts of the page has been around for awhile. Tables of contents are prominent examples. According to Human-Information Interaction research, it's better to have more concise pages. People are in a hurry to get to what they need. They're going to hop to their page and look for where to click next, ignoring the irrelevant content (having no memory of that awesome, irrelevant graphic you spent a million dollars on). So if you have everything in one page, it's going to be more cluttered and contain irrelevant information. The more relevant and high "information scent" your content, the greater authority and trust you establish with the user. Extra time spent sifting through information trying to find relevant bits is going to lead to users abandoning the website out of frustration.

Learn more about Information Foraging Theory.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.