#CSS STACK MENU ITEMS UPDATE#
#CSS STACK MENU ITEMS PLUS#

“I logically filter out the stuff that I know I’m not looking for.” “I’m not even sure if the black bar is new.” Here’s a sampling of what we heard about the current version of the top bar: Stack Overflow users compared the new screens against the current navigation in focus groups at three tech companies. Design the navigation as shorthand for the Stack Overflow brand.Use navigation design patterns more commonly found in contemporary web apps.Stick the navigation to the top of the page so that users who are scrolling quickly to answers or arriving from answer or comment links still have access to search or navigate the site.Remove clutter and group similar information in a way that’s more quickly parsable.The main thinking generated from the sprint: The team then combined the best parts of their ideas into one design. Each designer created their own design of the top nav and then converged to critique and identify the strongest ideas.

The product design team then did a design sprint.

Plus the nav and top bar quickly scroll out of view when moving down the page. We also hypothesized that the focal point of the page (the logo) caused many users to skip over the small top bar. Based on research about F-shaped reading patterns and how readers’ eyes commonly move down the page, it made sense that our navigation was sub-optimal for most people.

We hypothesized that a lack of engagement with the nav was due to a combination of browsing habits, visual hierarchy, and the right-hand position of the layout. If they’re not aware, then we’re less effective in helping more developers share their knowledge by finding questions to answer, advance their career search, utilize Documentation, or become contributing members of our community. This workflow makes sense - and we love helping the world’s developers gain programming knowledge quickly - but this also means many visitors don’t benefit from everything that Stack Overflow has to offer. The common use case for millions of daily visitors is “come from Google, scroll to middle of the page to a find an answer (without seeing the nav and sometimes evening ignore the question itself), and leave. Our navigation is not being used by 99% of our users. The data validated our hypothesis - of the average 9.3 million daily visits to Stack Overflow, we get fewer than 88,000 clicks to the navigation or top bar (this includes inbox, rep, profile, and search.) If you divided each individual click per visit, that’s fewer than 1% of visits navigating anywhere (and far fewer if you counted multiple clicks per visit). “From my point of view, nothing above the question title exists.” “You’re only there for 1 reason: to find the answer to your question.” “When I come here I’m on a mission I don’t care about the rest.”

Digging deeper, we discovered that many weren’t really seeing the top bar at all – a “mental block” so effective that most users also couldn’t identify what the icons meant. A Common ThemeĪ pattern surfaced when talking to users: even with the addition of Jobs and Documentation to the navigation, many developers weren’t aware of the change. As both product and process expanded, it quickly became apparent that Stack Overflow had outgrown some of our previous design decisions. There’s a ton you can learn by watching people try to use a feature - things that don’t get uncovered when directly soliciting feedback. And we added Developer Story to help developers ditch the outdated resume format.ĭuring this time, we also evolved our product development process to include more user research, allowing us to validate ideas earlier and surface more users’ voices. We added a whole new content type - Documentation - to help you find even more solutions to your programming questions. In the past year, we fully integrated our by-developers, for-developers Jobs product.

We launched this update today as part of a series of changes supporting our core mission: Make developers’ lives better.

You may have noticed that we’re sporting a new look today.

#CSS STACK MENU ITEMS PLUS#

#CSS STACK MENU ITEMS UPDATE#

Css stack menu items