Our development roadmap lists currently released patterns:
https://www.digital.nsw.gov.au/design-system/patterns/development-roadmap
Please use this category to provide feedback on them.
Main Navigation:
Things to consider:
- Label the search icon within the Main navigation similar to mobile.
- Alternatively have the search text field open as default. To minimise user interaction cost. This allows for placeholder text and the use of active language to draw at
- User does not have a search button to initiate search. User needs to click ‘enter/return’ on desktop keyboard. Dependant on mobile iOS keyboard . Android keyboard turns to 'enter symbol ’ -> ’
- Pattern changes on search results the ‘magnifying glass’ is replaced with search button, should the search pattern maintain consistency throughout use.
Few examples to cite:
1 Like
Hi @Nesan - thank you for taking time with your feedback. @mike.hall our UX lead will respond to your suggestions soon.
Thanks Nessan, this is exactly the sort of feedback we’re after.
With the search label, RMS conducted research around way finding and search last week and they’re coming in to present the findings tomorrow. We’re also conducting more testing with DoE and the Website consolidation team over the next few weeks. I’ll be sure to keep an eye out for any confusion over the location and use of search.
We’re avoiding placeholder text and using labels and help text where needed, as placeholder text is either too faint to pass contrast, or looks filled in and is deleted as soon as you interact with the field.
I’ve chatted to @SeanElliott about adding a button to submit the search. Could you confirm what you mean by on the search results page?
Thanks again
Mike
Hi,
In our 1:1 test sessions the users rarely used the search in the top menu. The users used the search box on the home page or the navigation.
The inconsistency with mobile is strange. Our accessibility expert supports the label net to the icon on the desktop version as well.
Hi regarding the search icon on preview.nsw.gov.au in desktop view (the search icon on the top right-hand side in the header): I support Rika’s view of having a text label below or next to magnifying glass icon, similar to the mobile view. Let me refer to this as the header search icon to minimise confusion with the main search bar.
Image below shows the current state:
While the header search icon passes WCAG because it is labelled in the source code, it is an added cognitive burden for users if there is no visual label.
NNG research has shown that:
" The magnifying glass alone makes it much harder to locate the search.
When used without an open-entry text field, the icon takes up less space. Visually, it’s less prominent and, therefore, less noticeable. We don’t recommend the icon-only pattern for desktop websites."
While NNG’s research also reveals that:
“Users understand the icon enough…that “Search” as a label is no longer required.”
it also said that:
" Icon-only search increases the cost of interaction."
Reference: https://www.nngroup.com/articles/magnifying-glass-icon/
2 Likes
I also support the idea of surfacing the search field by default instead of hiding it behind a click of the search icon - on desktop, at least. Nesan and Charissa have already provided a pretty convincing case, though this may have to be supported through testing of course.