Search Bar Position is Inconsistent #370
Replies: 3 comments
-
this is intentional and won’t be moved to the header on the search page right now we can reevaluate in the future |
Beta Was this translation helpful? Give feedback.
-
We can certainly have two search bars - one in the navbar and one in the page itself. We just need to use the default text to let users know why they're different. That's an established design pattern: It's confusing for learners to see the search bar there on one page, and have it disappear/move on another. It makes it harder for them to find what they need, and breaks their understanding of where elements live on the site. What if someone is on the React page and decides they want to search for Vue content instead? Also it is incredibly confusing that the minute someone types content into that search box, the whole React page dissappears and is replaced by search content. I start here: Start to type "hooks" into the search bar: Whoa where did the page go and where am I now?? Hit back button -> end up back on the homepage instead of on the React page where I started 😭 Canonical research from Nielson Norman Group: https://www.nngroup.com/articles/search-visible-and-simple/
|
Beta Was this translation helpful? Give feedback.
-
This advanced well beyond the "we need to move the bar into the header" I've converted it to a discussion. I'm all in favor of upgrading the search experience holistically, but it's obviously more nuanced than simple placement and the follow-up comment suggests that we need to be considering site search across the entire site. These seem like great ideas that could be packaged into something that we could implement. |
Beta Was this translation helpful? Give feedback.
-
On the homepage the search bar is in the navigation:
On the React page it has suddenly disappeared and jumped down into the page layout
It needs to be moved back to the navbar. See this: https://roamresearch.com/#/app/egghead/page/_mCVvC40I
Beta Was this translation helpful? Give feedback.
All reactions