Best way to handle multiple navbars for a products site?

Question

I'm designing a responsive website which has different software products (apps) and one main homepage.

Desktop Homepage navbar menu has:

Website name (right side)               | Apps | About-us | Contact

On mobile, it shows the website name (right) and a hamburger menu (left) with links (apps,about us,contact) inside it.

Individual App page should have navbar with menu:

App name                                | Getting Started | Features | Download

Clicking on any of (Getting started,features,download) will scroll to the corresponding section of the app page.

Now I'm confused how to show secondary navbar on the app page along with the homepage navbar. This should also compatible with the mobile view.

One approach I found from https://www.jetbrains.com/idea/?fromMenu and https://www.freshworks.com/freshsales-crm/?fworks_navbar is to add both navbar but make the app navbar sticky to the page.

Website name (right side)               | Apps | About-us | Contact
App name                                | Getting Started | Features | Downloads

But I personally think double navbar is not a great way. Also, Unfortunately, Jetbrains does not support mobile view so I'm not sure how to handle this in mobile.

I'm open to all ideas.

Answer 1

Had the same problem a few days back. I liked the approach used by atlassian.com. This is a bit similar to freshworks.com. But I really like stackideas.com. Their site has a clear navigation hierarchy on mobile. See if that helps sort out your problem.