Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Navigation #76

Open
govuk-design-system opened this issue Jan 15, 2018 · 11 comments
Open

Navigation #76

govuk-design-system opened this issue Jan 15, 2018 · 11 comments

Comments

@govuk-design-system
Copy link
Collaborator

@govuk-design-system govuk-design-system commented Jan 15, 2018

What

Help users navigate sections in your service.

Why

Services that use this pattern:

Anything else

Related items:

@govuk-design-system govuk-design-system created this issue from a note in GOV.UK Design System Community Backlog (Agreed) Jan 15, 2018
@ignaciaorellana
Copy link
Contributor

@ignaciaorellana ignaciaorellana commented Feb 21, 2018

As discussed with some designers in the past xgov design system workshop, this pattern could just be general 'Navigation' which has different applications (Primary, secondary, account navigation, content list, etc.) @timpaul @joelanman thoughts?

@timpaul
Copy link
Contributor

@timpaul timpaul commented Feb 21, 2018

Yeah, I think we could have a general 'Navigation' pattern, but we might need to also make some more specific navigation components to go with it.

@joelanman joelanman changed the title Primary navigation Navigation Apr 5, 2018
@penx
Copy link

@penx penx commented May 2, 2018

Related to site header (#97), which frequently contains navigation elements

@penx
Copy link

@penx penx commented May 10, 2018

please consider whether there is value in supporting optional icons next to key navigation items for a site, e.g. "Search, Home, Help"

@joelanman
Copy link
Member

@joelanman joelanman commented May 10, 2018

@penx do you know of any government services that have done this?

@penx
Copy link

@penx penx commented May 10, 2018

@joelanman we have an internal system at the Home Office, that was originally not using govuk styles, but now does. We have a bespoke nav that includes icons. This isn't exactly how it looks but I have done a mockup of the kind of thing I mean:

icons-in-nav

@penx
Copy link

@penx penx commented May 10, 2018

the icons above are from the home office design system https://home-office-digital-patterns.herokuapp.com/components/icons

@joelanman
Copy link
Member

@joelanman joelanman commented May 10, 2018

Thanks, good to know!

@peternunn101
Copy link

@peternunn101 peternunn101 commented Aug 13, 2018

We care currently designing an application that provides a number of services/forms/reports. The end user can be required to re-visit and make edit/additions to these services/forms/reports - so all need to be available after sumbission. Additionally there may be a number of different user settings that require administration. Finally we also require a section that provides secure messaging and uploading. We were hoping create a navigation system with both a primary and secondary navigation - similar to that provided here: https://design-system.service.gov.uk/components/ . After some investigation we have been advised that this pattern is not recommended for service. Are there any navigation patterns that can be used that are similar

@awjdigital
Copy link

@awjdigital awjdigital commented Sep 12, 2019

Just wanted to share some feedback for vertical navs and what we learnt on a service we are working on at the moment. We've gone with a vertical as horizontal tabs didn't work well with the content we have and users completely missed them.

We looked at vertical tabs, and tried link lists but they didn't work well with users. So we adapted the vertical nav thats in the design system. This worked really well with our uses and we have created a pattern for it in our design system. It worked well with screen readers and users with assistive tech. We had one user who said they were very surprised it was easy to navigate the pages.

Using tags for the counts, with some hidden descriptive text also helped with screenreaders, similar to the "Change" link in the CYA/Summary pattern.

image

image

@titlescreen
Copy link

@titlescreen titlescreen commented Oct 10, 2019

This is something we have recently been looking at DfE, we have gone through #151 for reference to try and get something consistent with other top navigation bars.

I think the only thing really to highlight is the sign out link on the right.

image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
8 participants