That said, let\u2019s explore some secondary navigation examples, the role of secondary navigation in UX, the key differences between primary and secondary navigation, and share some strategies to aid your navigation.<\/p>\n
Summary of secondary navigation examples<\/strong><\/h2>\n\n- Secondary navigation refers to UI elements that guide users to additional information that may not be of primary importance but is still necessary for a comprehensive user experience.<\/li>\n
- Primary navigation gives users immediate access to the main sections of a website or application. Meanwhile, secondary navigation serves as an auxiliary guide to less prominent but still significant content.<\/li>\n
- Secondary navigation is essential to enhance feature accessibility, streamline the user journey<\/a>, optimize space, and increase feature adoption<\/a>.<\/li>\n
- Now, there are two types of secondary menus:<\/li>\n<\/ul>\n
\n- Separate menus are independently placed, offering complementary navigation without distracting from primary tasks.<\/li>\n
- Combined menus that integrate within primary navigation, expanding for detailed access and maintaining user focus.<\/li>\n<\/ol>\n
\n- We go over 5 secondary navigation examples from other SaaS businesses:<\/li>\n<\/ul>\n
\n- Mixpanel uses separate primary and secondary menus on its navigation bar for clear, organized access to features and settings.<\/li>\n
- Qualtrics broad combined menu under primary navigation elements that offers a comprehensive, all-in-one navigation hub.<\/li>\n
- Zoom places a thin secondary navigation bar atop the page for straightforward, unobtrusive access to secondary options.<\/li>\n
- HubSpot’s combined navigation allows detailed content exploration within major categories through a hierarchical structure.<\/li>\n
- Amplitude provides a side panel for historical navigation and resource discovery.<\/li>\n<\/ol>\n
\n- Let\u2019s explore some best practices for implementing secondary navigation menus:<\/li>\n<\/ul>\n
\n- Using path analysis<\/a> to tailor secondary navigation based on actual user behavior and preferences.<\/li>\n
- Organizing content with card sorting to reflect user expectations and make navigation<\/a> intuitive.<\/li>\n
- Implementing in-app guidance<\/a> for new or less visible secondary navigation to direct users to secondary features.<\/li>\n
- Collecting navigation feedback with surveys<\/a> to refine and improve secondary navigation based on user insights.<\/li>\n<\/ol>\n
What is secondary navigation?<\/strong><\/h2>\nSecondary navigation refers to UI elements that guide users to additional information that may not be of primary importance but is still necessary for a comprehensive user experience<\/a>.<\/p>\nIt provides easy access to secondary pages without cluttering the primary menu, enhances usability, and improves the overall site structure.<\/p>\n
For complex websites or apps, a well-designed secondary navigation system leads to a more intuitive and efficient user journey<\/a>.<\/p>\n![\"secondary](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/nyt-secondary-navigation_863f15888b0089bd2752af2ca8fc1df9_800.png\")
<\/picture>NYT\u2019s page navigation.<\/figcaption><\/figure>\nDifferences between primary and secondary navigation<\/strong><\/h2>\nPrimary navigation gives users immediate access to the main sections of a website or application. Meanwhile, secondary navigation serves as an auxiliary guide to less prominent but still significant content.<\/p>\n
A clear distinction between the two is crucial for a clean and effective navigational structure. So here are their main differences:<\/p>\n
\n- Hierarchy<\/strong>: Primary navigation houses the most important categories or pages, while secondary navigation supports additional, often more specific content.<\/li>\n
- Visibility<\/strong>: Primary navigation is immediately visible, often as a top horizontal bar or a sidebar, whereas secondary navigation may be hidden behind actions like hover or clicks.<\/li>\n
- Frequency of use<\/strong>: Users typically frequent primary navigation paths more often, while secondary paths are for less common but targeted tasks.<\/li>\n
- Design elements<\/strong>: The design of a primary navigation menu is usually more prominent with bold text and larger buttons; secondary navigation often uses smaller text or icons to take up less visual space.<\/li>\n<\/ul>\n
![\"primary](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/wix-secondary-navigation_51fa19a740cf0cbf3d1fcdbc31bc78a2_800.png\")
<\/picture>Wix\u2019s drop-down menu is their secondary navigation menu.<\/figcaption><\/figure>\nSecondary navigation use cases<\/strong><\/h2>\nIn SaaS, secondary navigation enhances the user interface by providing a clear path to different features or settings.<\/p>\n
However, its implementation is not a one-size-fits-all solution and must be tailored to the specific needs of your application and its users. Its use cases are too many, and they can include:<\/p>\n
\n- Feature accessibility<\/strong>: It grants users easy access to secondary features or settings that are not immediately visible, improving the adoption<\/a> of secondary features.<\/li>\n
- User journey streamlining<\/strong>: It helps you understand and improve the user journey by making it easier to advance through the next stage.<\/li>\n
- Space optimization<\/strong>: Secondary navigation can make effective use of interface space when implemented correctly.<\/li>\n
- Enhance discoverability<\/strong>: Secondary navigation increases the visibility of underused features, encouraging users to explore beyond their usual paths.<\/li>\n<\/ul>\n
Types of secondary menus<\/strong><\/h2>\nThe design and functionality of secondary menus vary depending on the content’s complexity and the website’s or SaaS application’s goals.<\/p>\n
That said, understanding the different types is key to implementing the most user-friendly navigation possible.<\/p>\n
Separate menus<\/strong><\/h3>\nSeparate secondary menus are independent of the primary navigation system, and they\u2019re typically found in a separate section of the user interface.<\/p>\n
They serve as a complementary guide and lead users to additional resources without competing for attention with the main navigational elements.<\/p>\n
In terms of design, it must be differentiated from the primary menus, including colors, fonts, and placements. The idea is to offer users additional navigational paths without disrupting the user experience.<\/p>\n![\"separate](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/youtube-secondary-navigation_e47940b58fe5de35396f2a4fd736cc1a_800.png\")
<\/picture>Youtube\u2019s separate menu on the side panel.<\/figcaption><\/figure>\nWhen to choose separate menus for secondary navigation?<\/strong><\/h4>\nThis type of navigation is especially effective when the user’s primary tasks are well-established and secondary tools or features aren\u2019t too many. That way, you can make the most out of the white space available and keep it balanced.<\/p>\n
Combined menus<\/strong><\/h3>\nCombined secondary menus are typically accessed through interactions with the primary navigation items. You can see related sub-items or drop-down menus when hovering or clicking through primary icons.<\/p>\n
This design requires a hierarchical structure that guides the user’s journey <\/a>through the product. This way, the user experience becomes more intuitive and accessible without increasing cognitive overload.<\/p>\n![\"combined](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/shopify-combined-secondary-navigation_e70e8f9c914c9bcbdf1cacde935fe43f_800.png\")
<\/picture>Shopify\u2019s huge combined menu.<\/figcaption><\/figure>\nWhen to choose combined menus for secondary navigation?<\/strong><\/h4>\nThis navigation style works best when there\u2019s a wide array of content that can be categorized into groups or hierarchies. It\u2019s particularly effective on desktop environments as users can easily navigate through cascading menus by hovering the mouse (while on mobile, you need to rely on touch screens).<\/p>\n
Examples of secondary navigation menus<\/strong><\/h2>\nThe design and utility of secondary navigation menus are best illustrated through real-world scenarios.<\/p>\n
That said, let\u2019s explore 6 secondary navigation examples from other SaaS apps:<\/p>\n
Mixpanel’s separate primary and secondary menus<\/strong><\/h3>\nMixpanel\u2019s UI creates a clear separation between its primary and secondary menus using the navigation bar. Where the primary options are on the left side (accessing main features like reports & dashboards), while secondary options are on the right side (profile settings, apps, etc.).<\/p>\n
This provides users with a full spectrum of navigation options without spending too much space or without making it look cluttered\u2014while also creating a clear differentiation between both types of options.<\/p>\n![\"mixpanel](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/mixpanel-secondary-navigation_6c960a11344a119e8fa79fbc713b55f1_800.png\")
<\/picture>Mixpanel\u2019s separate menu on the top.<\/figcaption><\/figure>\nQualtrics’s combined secondary menu<\/strong><\/h3>\nQualtrics\u2019s website features a large combined menu that\u2019s well structured by categories such as products, resources, and pricing.<\/p>\n
As you interact with a primary navigation element, secondary pages are presented in a wide drop-down menu\u2014acting as an all-in-one hub and reducing the need for multiple clicks and page navigations.<\/p>\n
Plus, it even includes other secondary options to create a free account or view a demo to make it more actionable and keep visitors just one click away from converting.<\/p>\n![\"qualtrics](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/qualtrics-secondary-navigation_ec52dd8a1fb8ec274a3941b5d181a8ef.gif\")
<\/picture>Qualtrics thorough combined menu.<\/figcaption><\/figure>\nZoom’s secondary navigation bar<\/strong><\/h3>\nZoom\u2019s website clearly separates the primary and secondary menus by adding a thin secondary navigation bar at the top of the page.<\/p>\n
This bar runs across the top of the site, working almost as an informational ticker that provides access to secondary options like pricing, resources, and support. It remains constant and accessible regardless of where users find themselves on the site.<\/p>\n
A navigation bar like this works as long as it\u2019s designed to be unobtrusive, taking as little space as possible to not distract from the primary content.<\/p>\n![\"zoom](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/zoom-secondary-navigation_1de5f680c3c2b2a9ef51b443b536dbab_800.png\")
<\/picture>Zoom\u2019s secondary bar menu at the top.<\/figcaption><\/figure>\nHubspot’s combined secondary navigation<\/strong><\/h3>\nHubspot\u2019s website has excellent combined dropdown menus where you can navigate its content by multiple categories.<\/p>\n
Here, users can navigate through major categories, and within each, they’re met with a depth of subcategories and topics that cater to multiple users’ intents, all accessible through the same navigational flow.<\/p>\n
For example, within the Blogs section, users can explore content segmented by categories, like marketing or customer service\u2014while also adding a separate menu to explore by topics.<\/p>\n
This visual hierarchy makes it easy for users to find precisely what they’re looking for or to explore the exact topics they\u2019re looking for.<\/p>\n![\"hubspot](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/hubspot-secondary-navigation_79c77be7d17503d26ca70176ff8084d9_800.png\")
<\/picture>Hubspot\u2019s combined menu with clear organization.<\/figcaption><\/figure>\nAmplitude’s separate secondary navigation<\/strong><\/h3>\nAmplitude\u2019s app has a separate secondary menu on the left panel, where users can access help resources and previous pages.<\/p>\n
It\u2019s specifically designed for historical navigation and allows users to jump to frequently accessed resources such as documentation or support.<\/p>\n
Thus, with the primary navigation menu horizontally and the secondary options on the side, it\u2019s more intuitive for users to understand how the app can be navigated and then use it more effectively.<\/p>\n![\"amplitudes](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/amplitude-secondary-navigation_330e2d59661928ca1434c3ededfe64c6_800.png\")
<\/picture>Amplitude\u2019s separate menu to jump back to previous pages.<\/figcaption><\/figure>\nBest practices when applying a secondary navigation menu<\/strong><\/h2>\nApplying a secondary navigation menu involves more than just adding additional links to your platform. So let\u2019s go over some best practices for implementing secondary navigation interfaces:<\/p>\n
Use path analysis to understand user navigation<\/strong><\/h3>\nPath analysis<\/a> traces the steps users take as they navigate through your platform, providing insights into their behaviors<\/a> and preferences.<\/p>\nThis allows you to identify the most frequented paths and those that may benefit from enhanced visibility. This way, you can integrate secondary navigation based on these insights to ensure that users find what they need without unnecessary clicks or feeling confused\u2014optimizing the user journey so each user can navigate the product intuitively and effectively.<\/p>\n![\"path](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/path-analysis-for-applying-secondary-navigation_c0b5e9bcc2e52196c42baa4ccbee12bf_800.png\")
<\/picture>Performing path analysis<\/figcaption><\/figure>\nUse card sortings to organize pages by primary and secondary levels<\/strong><\/h3>\nCard sorting is a research technique<\/a> where you, your team, or a group of users sort a bunch of labeled cards into groups or categories.<\/p>\nIt helps you organize content into logical structures that reflect the user’s expectations and understanding (even more so when involving actual users). Plus, it can be done online with tools like Optimal Workshop, which allows you to both design and test your UX design with users to understand what type of secondary navigation works better.<\/p>\n
For secondary navigation, card sorting can help determine which items should be readily accessible at the top level and which can be tucked away in secondary menus\u2014resulting in a content hierarchy that is both user-friendly and easy to explore.<\/p>\n![\"card](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/card-sorting_f40d8f56b46462e092dd7eb33863112b_800.png\")
<\/picture>Card sorting.<\/figcaption><\/figure>\nImplement in-app guidance when introducing secondary navigation menus<\/strong><\/h3>\nIn-app guidance<\/a> tools like tooltips, walkthroughs, and highlights can serve as a way to direct users\u2019 attention to secondary navigation elements. They act as on-the-spot training for users and reduce the learning curve of your app.<\/p>\nIt\u2019s particularly important to add in-app guidance when introducing new features or when the secondary navigation is less obvious. The worst it can do is to ensure that users are aware of the navigation options available and use them.<\/p>\n
When done well, in-app guidance increases user satisfaction and retention as users can fully adopt your product and use it to its full potential.<\/p>\n![\"in](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/in-app-guidance-for-navigation_f2b243fa0a0b42475acdd261eecbed66_800.png\")
<\/picture>Customizing in-app tooltips\u00a0<\/figcaption><\/figure>\nUse surveys to collect navigation feedback<\/strong><\/h3>\nFeedback is crucial, and surveys<\/a> are a direct line to understanding user opinions on your navigation structure.<\/p>\nTo improve secondary navigation, triggering Customer Effort Score (CES) surveys<\/a> after interactions with secondary menus can provide a quantitative measure of how users perceive it.<\/p>\n
- \n
- Separate menus are independently placed, offering complementary navigation without distracting from primary tasks.<\/li>\n
- Combined menus that integrate within primary navigation, expanding for detailed access and maintaining user focus.<\/li>\n<\/ol>\n
- \n
- We go over 5 secondary navigation examples from other SaaS businesses:<\/li>\n<\/ul>\n
- \n
- Mixpanel uses separate primary and secondary menus on its navigation bar for clear, organized access to features and settings.<\/li>\n
- Qualtrics broad combined menu under primary navigation elements that offers a comprehensive, all-in-one navigation hub.<\/li>\n
- Zoom places a thin secondary navigation bar atop the page for straightforward, unobtrusive access to secondary options.<\/li>\n
- HubSpot’s combined navigation allows detailed content exploration within major categories through a hierarchical structure.<\/li>\n
- Amplitude provides a side panel for historical navigation and resource discovery.<\/li>\n<\/ol>\n
- \n
- Let\u2019s explore some best practices for implementing secondary navigation menus:<\/li>\n<\/ul>\n
- \n
- Using path analysis<\/a> to tailor secondary navigation based on actual user behavior and preferences.<\/li>\n
- Organizing content with card sorting to reflect user expectations and make navigation<\/a> intuitive.<\/li>\n
- Implementing in-app guidance<\/a> for new or less visible secondary navigation to direct users to secondary features.<\/li>\n
- Collecting navigation feedback with surveys<\/a> to refine and improve secondary navigation based on user insights.<\/li>\n<\/ol>\n
What is secondary navigation?<\/strong><\/h2>\n
Secondary navigation refers to UI elements that guide users to additional information that may not be of primary importance but is still necessary for a comprehensive user experience<\/a>.<\/p>\n
It provides easy access to secondary pages without cluttering the primary menu, enhances usability, and improves the overall site structure.<\/p>\n
For complex websites or apps, a well-designed secondary navigation system leads to a more intuitive and efficient user journey<\/a>.<\/p>\n
<\/picture>NYT\u2019s page navigation.<\/figcaption><\/figure>\n Differences between primary and secondary navigation<\/strong><\/h2>\n
Primary navigation gives users immediate access to the main sections of a website or application. Meanwhile, secondary navigation serves as an auxiliary guide to less prominent but still significant content.<\/p>\n
A clear distinction between the two is crucial for a clean and effective navigational structure. So here are their main differences:<\/p>\n
- \n
- Hierarchy<\/strong>: Primary navigation houses the most important categories or pages, while secondary navigation supports additional, often more specific content.<\/li>\n
- Visibility<\/strong>: Primary navigation is immediately visible, often as a top horizontal bar or a sidebar, whereas secondary navigation may be hidden behind actions like hover or clicks.<\/li>\n
- Frequency of use<\/strong>: Users typically frequent primary navigation paths more often, while secondary paths are for less common but targeted tasks.<\/li>\n
- Design elements<\/strong>: The design of a primary navigation menu is usually more prominent with bold text and larger buttons; secondary navigation often uses smaller text or icons to take up less visual space.<\/li>\n<\/ul>\n
<\/picture>Wix\u2019s drop-down menu is their secondary navigation menu.<\/figcaption><\/figure>\n Secondary navigation use cases<\/strong><\/h2>\n
In SaaS, secondary navigation enhances the user interface by providing a clear path to different features or settings.<\/p>\n
However, its implementation is not a one-size-fits-all solution and must be tailored to the specific needs of your application and its users. Its use cases are too many, and they can include:<\/p>\n
- \n
- Feature accessibility<\/strong>: It grants users easy access to secondary features or settings that are not immediately visible, improving the adoption<\/a> of secondary features.<\/li>\n
- User journey streamlining<\/strong>: It helps you understand and improve the user journey by making it easier to advance through the next stage.<\/li>\n
- Space optimization<\/strong>: Secondary navigation can make effective use of interface space when implemented correctly.<\/li>\n
- Enhance discoverability<\/strong>: Secondary navigation increases the visibility of underused features, encouraging users to explore beyond their usual paths.<\/li>\n<\/ul>\n
Types of secondary menus<\/strong><\/h2>\n
The design and functionality of secondary menus vary depending on the content’s complexity and the website’s or SaaS application’s goals.<\/p>\n
That said, understanding the different types is key to implementing the most user-friendly navigation possible.<\/p>\n
Separate menus<\/strong><\/h3>\n
Separate secondary menus are independent of the primary navigation system, and they\u2019re typically found in a separate section of the user interface.<\/p>\n
They serve as a complementary guide and lead users to additional resources without competing for attention with the main navigational elements.<\/p>\n
In terms of design, it must be differentiated from the primary menus, including colors, fonts, and placements. The idea is to offer users additional navigational paths without disrupting the user experience.<\/p>\n
<\/picture>Youtube\u2019s separate menu on the side panel.<\/figcaption><\/figure>\n When to choose separate menus for secondary navigation?<\/strong><\/h4>\n
This type of navigation is especially effective when the user’s primary tasks are well-established and secondary tools or features aren\u2019t too many. That way, you can make the most out of the white space available and keep it balanced.<\/p>\n
Combined menus<\/strong><\/h3>\n
Combined secondary menus are typically accessed through interactions with the primary navigation items. You can see related sub-items or drop-down menus when hovering or clicking through primary icons.<\/p>\n
This design requires a hierarchical structure that guides the user’s journey <\/a>through the product. This way, the user experience becomes more intuitive and accessible without increasing cognitive overload.<\/p>\n
<\/picture>Shopify\u2019s huge combined menu.<\/figcaption><\/figure>\n When to choose combined menus for secondary navigation?<\/strong><\/h4>\n
This navigation style works best when there\u2019s a wide array of content that can be categorized into groups or hierarchies. It\u2019s particularly effective on desktop environments as users can easily navigate through cascading menus by hovering the mouse (while on mobile, you need to rely on touch screens).<\/p>\n
Examples of secondary navigation menus<\/strong><\/h2>\n
The design and utility of secondary navigation menus are best illustrated through real-world scenarios.<\/p>\n
That said, let\u2019s explore 6 secondary navigation examples from other SaaS apps:<\/p>\n
Mixpanel’s separate primary and secondary menus<\/strong><\/h3>\n
Mixpanel\u2019s UI creates a clear separation between its primary and secondary menus using the navigation bar. Where the primary options are on the left side (accessing main features like reports & dashboards), while secondary options are on the right side (profile settings, apps, etc.).<\/p>\n
This provides users with a full spectrum of navigation options without spending too much space or without making it look cluttered\u2014while also creating a clear differentiation between both types of options.<\/p>\n
<\/picture>Mixpanel\u2019s separate menu on the top.<\/figcaption><\/figure>\n Qualtrics’s combined secondary menu<\/strong><\/h3>\n
Qualtrics\u2019s website features a large combined menu that\u2019s well structured by categories such as products, resources, and pricing.<\/p>\n
As you interact with a primary navigation element, secondary pages are presented in a wide drop-down menu\u2014acting as an all-in-one hub and reducing the need for multiple clicks and page navigations.<\/p>\n
Plus, it even includes other secondary options to create a free account or view a demo to make it more actionable and keep visitors just one click away from converting.<\/p>\n
<\/picture>Qualtrics thorough combined menu.<\/figcaption><\/figure>\n Zoom’s secondary navigation bar<\/strong><\/h3>\n
Zoom\u2019s website clearly separates the primary and secondary menus by adding a thin secondary navigation bar at the top of the page.<\/p>\n
This bar runs across the top of the site, working almost as an informational ticker that provides access to secondary options like pricing, resources, and support. It remains constant and accessible regardless of where users find themselves on the site.<\/p>\n
A navigation bar like this works as long as it\u2019s designed to be unobtrusive, taking as little space as possible to not distract from the primary content.<\/p>\n
<\/picture>Zoom\u2019s secondary bar menu at the top.<\/figcaption><\/figure>\n Hubspot’s combined secondary navigation<\/strong><\/h3>\n
Hubspot\u2019s website has excellent combined dropdown menus where you can navigate its content by multiple categories.<\/p>\n
Here, users can navigate through major categories, and within each, they’re met with a depth of subcategories and topics that cater to multiple users’ intents, all accessible through the same navigational flow.<\/p>\n
For example, within the Blogs section, users can explore content segmented by categories, like marketing or customer service\u2014while also adding a separate menu to explore by topics.<\/p>\n
This visual hierarchy makes it easy for users to find precisely what they’re looking for or to explore the exact topics they\u2019re looking for.<\/p>\n
<\/picture>Hubspot\u2019s combined menu with clear organization.<\/figcaption><\/figure>\n Amplitude’s separate secondary navigation<\/strong><\/h3>\n
Amplitude\u2019s app has a separate secondary menu on the left panel, where users can access help resources and previous pages.<\/p>\n
It\u2019s specifically designed for historical navigation and allows users to jump to frequently accessed resources such as documentation or support.<\/p>\n
Thus, with the primary navigation menu horizontally and the secondary options on the side, it\u2019s more intuitive for users to understand how the app can be navigated and then use it more effectively.<\/p>\n
<\/picture>Amplitude\u2019s separate menu to jump back to previous pages.<\/figcaption><\/figure>\n Best practices when applying a secondary navigation menu<\/strong><\/h2>\n
Applying a secondary navigation menu involves more than just adding additional links to your platform. So let\u2019s go over some best practices for implementing secondary navigation interfaces:<\/p>\n
Use path analysis to understand user navigation<\/strong><\/h3>\n
Path analysis<\/a> traces the steps users take as they navigate through your platform, providing insights into their behaviors<\/a> and preferences.<\/p>\n
This allows you to identify the most frequented paths and those that may benefit from enhanced visibility. This way, you can integrate secondary navigation based on these insights to ensure that users find what they need without unnecessary clicks or feeling confused\u2014optimizing the user journey so each user can navigate the product intuitively and effectively.<\/p>\n
<\/picture>Performing path analysis<\/figcaption><\/figure>\n Use card sortings to organize pages by primary and secondary levels<\/strong><\/h3>\n
Card sorting is a research technique<\/a> where you, your team, or a group of users sort a bunch of labeled cards into groups or categories.<\/p>\n
It helps you organize content into logical structures that reflect the user’s expectations and understanding (even more so when involving actual users). Plus, it can be done online with tools like Optimal Workshop, which allows you to both design and test your UX design with users to understand what type of secondary navigation works better.<\/p>\n
For secondary navigation, card sorting can help determine which items should be readily accessible at the top level and which can be tucked away in secondary menus\u2014resulting in a content hierarchy that is both user-friendly and easy to explore.<\/p>\n
<\/picture>Card sorting.<\/figcaption><\/figure>\n Implement in-app guidance when introducing secondary navigation menus<\/strong><\/h3>\n
In-app guidance<\/a> tools like tooltips, walkthroughs, and highlights can serve as a way to direct users\u2019 attention to secondary navigation elements. They act as on-the-spot training for users and reduce the learning curve of your app.<\/p>\n
It\u2019s particularly important to add in-app guidance when introducing new features or when the secondary navigation is less obvious. The worst it can do is to ensure that users are aware of the navigation options available and use them.<\/p>\n
When done well, in-app guidance increases user satisfaction and retention as users can fully adopt your product and use it to its full potential.<\/p>\n
<\/picture>Customizing in-app tooltips\u00a0<\/figcaption><\/figure>\n Use surveys to collect navigation feedback<\/strong><\/h3>\n
Feedback is crucial, and surveys<\/a> are a direct line to understanding user opinions on your navigation structure.<\/p>\n
To improve secondary navigation, triggering Customer Effort Score (CES) surveys<\/a> after interactions with secondary menus can provide a quantitative measure of how users perceive it.<\/p>\n
- User journey streamlining<\/strong>: It helps you understand and improve the user journey by making it easier to advance through the next stage.<\/li>\n
- Visibility<\/strong>: Primary navigation is immediately visible, often as a top horizontal bar or a sidebar, whereas secondary navigation may be hidden behind actions like hover or clicks.<\/li>\n
- Organizing content with card sorting to reflect user expectations and make navigation<\/a> intuitive.<\/li>\n
- Using path analysis<\/a> to tailor secondary navigation based on actual user behavior and preferences.<\/li>\n
- Let\u2019s explore some best practices for implementing secondary navigation menus:<\/li>\n<\/ul>\n
- We go over 5 secondary navigation examples from other SaaS businesses:<\/li>\n<\/ul>\n
![\"secondary](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/nyt-secondary-navigation_863f15888b0089bd2752af2ca8fc1df9_800.png)
<\/picture>![\"primary](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/wix-secondary-navigation_51fa19a740cf0cbf3d1fcdbc31bc78a2_800.png)
<\/picture>![\"separate](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/youtube-secondary-navigation_e47940b58fe5de35396f2a4fd736cc1a_800.png)
<\/picture>![\"combined](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/shopify-combined-secondary-navigation_e70e8f9c914c9bcbdf1cacde935fe43f_800.png)
<\/picture>![\"mixpanel](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/mixpanel-secondary-navigation_6c960a11344a119e8fa79fbc713b55f1_800.png)
<\/picture>![\"qualtrics](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/qualtrics-secondary-navigation_ec52dd8a1fb8ec274a3941b5d181a8ef.gif)
<\/picture>![\"zoom](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/zoom-secondary-navigation_1de5f680c3c2b2a9ef51b443b536dbab_800.png)
<\/picture>![\"hubspot](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/hubspot-secondary-navigation_79c77be7d17503d26ca70176ff8084d9_800.png)
<\/picture>![\"amplitudes](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/amplitude-secondary-navigation_330e2d59661928ca1434c3ededfe64c6_800.png)
<\/picture>![\"path](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/path-analysis-for-applying-secondary-navigation_c0b5e9bcc2e52196c42baa4ccbee12bf_800.png)
<\/picture>![\"card](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/card-sorting_f40d8f56b46462e092dd7eb33863112b_800.png)
<\/picture>![\"in](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/in-app-guidance-for-navigation_f2b243fa0a0b42475acdd261eecbed66_800.png)
<\/picture>![\"in](\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2026\/02\/ces-survey-for-feature-navigation_ce1113ec489643b21a074b39ca7b14d7_800.png)
<\/picture>