\u003C/p>\n\n\u003Cspan style=\"font-weight: 400;\">We’re confident that this design will serve Channels users, but what about the greater Stack Overflow, Stack Exchange communities, and Enterprise? Our design explorations were guided by the following questions: \u003C/span>\n\n\u003Cul>\n \u003Cli style=\"font-weight: 400;\">\u003Cspan style=\"font-weight: 400;\">How will the new \u003C/span>\u003Ca href=\"https://en.wikipedia.org/wiki/Information_architecture\">\u003Cspan style=\"font-weight: 400;\">information architecture\u003C/span>\u003C/a>\u003Cspan style=\"font-weight: 400;\"> support \u003C/span>\u003Cb>existing Stack Overflow users\u003C/b>\u003Cspan style=\"font-weight: 400;\">? How will it impact important workflows like reviewing posts or answering questions? \u003C/span>\u003C/li>\n \u003Cli style=\"font-weight: 400;\">\u003Cspan style=\"font-weight: 400;\">How will this scale to \u003C/span>\u003Cb>Stack Overflow Enterprise\u003C/b>\u003Cspan style=\"font-weight: 400;\"> and the \u003C/span>\u003Cb>Stack Exchange network sites\u003C/b>\u003Cspan style=\"font-weight: 400;\">? How can people transition seamlessly between Stack Overflow and other sites without having to learn new patterns?\u003C/span>\u003C/li>\n \u003Cli style=\"font-weight: 400;\">\u003Cspan style=\"font-weight: 400;\">What about people using \u003C/span>\u003Cb>smaller screen sizes\u003C/b>\u003Cspan style=\"font-weight: 400;\">? Adding a vertical left navigation increases the page width, and how will we support people across a range of screen sizes and devices?\u003C/span>\u003C/li>\n \u003Cli style=\"font-weight: 400;\">\u003Cspan style=\"font-weight: 400;\">Is the new information architecture \u003C/span>\u003Cb>inclusive and accessible\u003C/b>\u003Cspan style=\"font-weight: 400;\">? How will this impact people using screen readers or with other accessibility needs? How can we leverage this moment of change to improve the site’s accessibility?\u003C/span>\u003C/li>\n \u003Cli style=\"font-weight: 400;\">\u003Cspan style=\"font-weight: 400;\">How will the new information architecture scale as the site \u003C/span>\u003Cb>grows and changes over time\u003C/b>\u003Cspan style=\"font-weight: 400;\">? \u003C/span>\u003C/li>\n\u003C/ul>\n\n\u003Cspan style=\"font-weight: 400;\">In this post, I’ll talk about our approach to answering these questions. First, though, I want to step back and explain \u003C/span>\u003Ci>\u003Cspan style=\"font-weight: 400;\">why\u003C/span>\u003C/i>\u003Cspan style=\"font-weight: 400;\"> it’s important for us to be thinking about these needs simultaneously.\u003C/span>\n\n\u003Ch2>\u003Cb>Background\u003C/b>\u003C/h2>\n\n\u003Cspan style=\"font-weight: 400;\">You may remember that we \u003C/span>\u003Ca href=\"https://stackoverflow.blog/2017/02/14/why-stack-overflow-redesigned-the-top-navigation/\">\u003Cspan style=\"font-weight: 400;\">updated\u003C/span>\u003C/a>\u003Cspan style=\"font-weight: 400;\"> the navigation design last year. Our approach was to focus on the already complex needs of Stack Overflow, and solve Enterprise and network site solutions soon after. \u003C/span>\n\n\u003Cspan style=\"font-weight: 400;\">Through that project, we learned that - despite many similar or overlapping use cases - there were major differences that were not easy to resolve. As a result, it took us longer than expected to ship navigation to network sites, and we still haven’t updated Enterprise sites.\u003C/span>\n\n\u003Cspan style=\"font-weight: 400;\">This means there’s been extended or unresolved fragmentation between Stack Overflow and our other sites. This is problematic because there’s a lot of overlap between people using Stack Overflow, Enterprise, and network sites. For example, about 70% of users joining network sites already have a Stack Overflow account. \u003C/span>\n\n\u003Cspan style=\"font-weight: 400;\">More generally, fragmentation means that shipping basic improvements to Enterprise and network sites becomes increasingly costly as differences accumulate over time. \u003C/span>\n\n\u003Cspan style=\"font-weight: 400;\">This time, we wanted to make sure that we were considering Enterprise and network site use cases early, as well as ensuring that basic improvements like accessibility and responsiveness can benefit our 150+ communities and Enterprise clients as quickly as possible.\u003C/span>\n\n\u003Ch2>\u003Cb>How We’re Addressing These Needs\u003C/b>\u003C/h2>\n\n\u003Cspan style=\"font-weight: 400;\">We started by broadly considering use cases across our product offerings: Stack Overflow, network sites, Enterprise, and soon - Channels. This approach helps us avoid fragmentation and allows improvements to flow quickly to all of our users. I’ll explore these use cases in further detail below. \u003C/span>\n\n\u003Cspan style=\"font-weight: 400;\">First, here’s a recap of the basic design solution, with content navigation on the left side:\u003C/span>\n\n \n\n\u003Cimg class=\"aligncenter size-large wp-image-8996\" src=\"https://stackoverflow.blog/wp-content/uploads/2018/02/blog-navigating-01-1200x381.png\" alt=\"blog-navigating-01\" width=\"1024\" height=\"325\" />\n\n\u003Cspan style=\"font-weight: 400;\">Next, I’ll layer in the principles and use cases that have guided our designs so far. \u003C/span>\n\n\u003Ch3>\u003Cb>Principle #1: Flexibility\u003C/b>\u003C/h3>\n\n\u003Cspan style=\"font-weight: 400;\">The new information architecture had to be flexible enough to support a broad range of use cases and screen sizes, including:\u003C/span>\n\n\u003Cul>\n \u003Cli style=\"font-weight: 400;\">\u003Cspan style=\"font-weight: 400;\">User has joined Stack Overflow only \u003C/span>\u003C/li>\n \u003Cli style=\"font-weight: 400;\">\u003Cspan style=\"font-weight: 400;\">User has joined Stack Overflow and a private channel\u003C/span>\u003C/li>\n \u003Cli style=\"font-weight: 400;\">\u003Cspan style=\"font-weight: 400;\">User has joined Server Fault only (or a different network site) \u003C/span>\u003C/li>\n \u003Cli style=\"font-weight: 400;\">\u003Cspan style=\"font-weight: 400;\">User is viewing on a tablet or mobile\u003C/span>\u003C/li>\n\u003C/ul>\n\n\u003Cspan style=\"font-weight: 400;\">Let’s see what the navigation looks like for each of these use cases. \u003C/span>\n\n\u003Cspan style=\"font-weight: 400;\">User has joined Stack Overflow only: \u003C/span>\n\n\u003Cp style=\"text-align: center;\">\u003Cimg class=\"aligncenter size-large wp-image-8997\" src=\"https://stackoverflow.blog/wp-content/uploads/2018/02/blog-navigating-02-1200x480.png\" alt=\"blog-navigating-02\" width=\"1024\" height=\"410\" />\u003C/p>\n\n\u003Cspan style=\"font-weight: 400;\">User has joined Stack Overflow and a private channel:\u003C/span>\n\n\u003Cp style=\"text-align: center;\">\u003Cimg class=\"aligncenter size-large wp-image-8998\" src=\"https://stackoverflow.blog/wp-content/uploads/2018/02/blog-navigating-03-1200x496.png\" alt=\"blog-navigating-03\" width=\"1024\" height=\"423\" />\u003C/p>\n\n\u003Cspan style=\"font-weight: 400;\">User has joined Server Fault only (or a different network site) :\u003C/span>\n\n\u003Cp style=\"text-align: center;\">\u003Cimg class=\"aligncenter size-large wp-image-8999\" src=\"https://stackoverflow.blog/wp-content/uploads/2018/02/blog-navigating-04-1200x448.png\" alt=\"blog-navigating-04\" width=\"1024\" height=\"382\" />\u003C/p>\n\n\u003Cspan style=\"font-weight: 400;\">User is viewing on a tablet or mobile:\u003C/span>\n\n\u003Cp style=\"text-align: center;\">\u003Cimg class=\"aligncenter size-large wp-image-9002\" src=\"https://stackoverflow.blog/wp-content/uploads/2018/02/blog-navigating-07-821x675.png\" alt=\"blog-navigating-07\" width=\"821\" height=\"675\" />\u003C/p>\n\n\u003Ch3>\u003Cb>Principle #2: Scalability\u003C/b>\u003C/h3>\n\n\u003Cspan style=\"font-weight: 400;\">The new information architecture also needed to scale reasonably over time. People should be able to expect a coherent experience as the site grows and changes. Here are some hypothetical scenarios that we can use to approximate the use cases that the information architecture needs to consider: \u003C/span>\n\n\u003Cul>\n \u003Cli style=\"font-weight: 400;\">\u003Cspan style=\"font-weight: 400;\">A new product offering that is a separate entity from Stack Overflow\u003C/span>\u003C/li>\n \u003Cli style=\"font-weight: 400;\">\u003Cspan style=\"font-weight: 400;\">A new feature on Stack Overflow \u003C/span>\u003C/li>\n\u003C/ul>\n\n\u003Cspan style=\"font-weight: 400;\">Next, let’s see what the navigation looks like for these hypothetical scenarios. \u003C/span>\n\n\u003Cspan style=\"font-weight: 400;\">A new product offering that is a separate entity from Stack Overflow:\u003C/span>\n\n\u003Cp style=\"text-align: center;\">\u003Cimg class=\"aligncenter size-large wp-image-9001\" src=\"https://stackoverflow.blog/wp-content/uploads/2018/02/blog-navigating-06-1200x413.png\" alt=\"blog-navigating-06\" width=\"1024\" height=\"352\" />\u003C/p>\n\n\u003Cspan style=\"font-weight: 400;\">A new feature on Stack Overflow:\u003C/span>\n\n\u003Cp style=\"text-align: center;\">\u003Cimg class=\"aligncenter size-large wp-image-9000\" src=\"https://stackoverflow.blog/wp-content/uploads/2018/02/blog-navigating-05-1200x568.png\" alt=\"blog-navigating-05\" width=\"1024\" height=\"485\" />\u003C/p>\n\n\u003Ch3>\u003Cb>Principle #3: Accessibility\u003C/b>\u003C/h3>\n\n\u003Cspan style=\"font-weight: 400;\">We know that Stack Overflow and our other sites could better support people with differing abilities. That’s why the new information architecture also needed to support our effort to make Stack Overflow accessible to all. \u003C/span>\n\n\u003Cspan style=\"font-weight: 400;\">We are learning from the \u003C/span>\u003Ca href=\"http://www.microsoft.com/design/inclusive\">\u003Cspan style=\"font-weight: 400;\">Inclusive Design\u003C/span>\u003C/a>\u003Cspan style=\"font-weight: 400;\"> approach, and also piloting a collaboration with the \u003C/span>\u003Ca href=\"https://www.washington.edu/accesscomputing/\">\u003Cspan style=\"font-weight: 400;\">University of Washington AccessComputing initiative\u003C/span>\u003C/a>\u003Cspan style=\"font-weight: 400;\"> to identify improvements that bring our sites closer to conformance with the \u003C/span>\u003Ca href=\"https://www.w3.org/TR/WCAG20/\">\u003Cspan style=\"font-weight: 400;\">W3C Web Content Accessibility Guidelines 2.0 Level AA\u003C/span>\u003C/a>\u003Cspan style=\"font-weight: 400;\">. We are also interested in hearing additional recommendations from you, if you encounter barriers that WCAG AA doesn't address. \u003C/span>\n\n\u003Cspan style=\"font-weight: 400;\">While all of these changes may not be ready on day one, we are taking this opportunity to improve access for all of our users.\u003C/span>\n\n\u003Ch2>\u003Cb>What We’ve Learned So Far\u003C/b>\u003C/h2>\n\n\u003Cspan style=\"font-weight: 400;\">In December, we launched Channels Alpha and kicked off research with Enterprise and high-rep Stack Overflow users. \u003C/span>\n\n\u003Cspan style=\"font-weight: 400;\">We asked questions about their day-to-day workflows on Stack Overflow, showed them mockups of the new information architecture, and discussed potential disruptions to their workflows. Overall, we learned that \u003C/span>\u003Cb>this change caused minimal impact to their workflows\u003C/b>\u003Cspan style=\"font-weight: 400;\">. Any concerns about the extra screen width this would introduce were alleviated with knowing that the site will become responsive. \u003C/span>\n\n\u003Cspan style=\"font-weight: 400;\">We’ll also be testing with network site users in the upcoming months. \u003C/span>\n\n\u003Ch2>\u003Cb>Next Steps\u003C/b>\u003C/h2>\n\n\u003Cspan style=\"font-weight: 400;\">We’ll be rolling out these changes in the near future. In the meantime, please look for future posts sharing our design, research, and product process for Channels. If you have any questions for the team or me, feel free to drop them in the comments below. Note that these designs are \u003C/span>\u003Ci>\u003Cspan style=\"font-weight: 400;\">not\u003C/span>\u003C/i>\u003Cspan style=\"font-weight: 400;\"> final, and we’ll continue to iterate as we receive feedback. Let us know what you think. \u003C/span>","html","2018-02-08T07:00:32.000Z",{"current":561},"information-architecture-navigating-stack-overflow-enterprise-stack-exchange-sites",[563,571,576,581,586,591,596],{"_createdAt":564,"_id":565,"_rev":566,"_type":567,"_updatedAt":564,"slug":568,"title":570},"2023-05-23T16:43:21Z","wp-tagcat-announcements","9HpbCsT2tq0xwozQfkc4ih","blogTag",{"current":569},"announcements","Announcements",{"_createdAt":564,"_id":572,"_rev":566,"_type":567,"_updatedAt":564,"slug":573,"title":575},"wp-tagcat-community",{"current":574},"community","Community",{"_createdAt":564,"_id":577,"_rev":566,"_type":567,"_updatedAt":564,"slug":578,"title":580},"wp-tagcat-company",{"current":579},"company","Company",{"_createdAt":564,"_id":582,"_rev":566,"_type":567,"_updatedAt":564,"slug":583,"title":585},"wp-tagcat-design",{"current":584},"design","Design",{"_createdAt":564,"_id":587,"_rev":566,"_type":567,"_updatedAt":564,"slug":588,"title":590},"wp-tagcat-for-work",{"current":589},"for-work","For Work",{"_createdAt":564,"_id":592,"_rev":566,"_type":567,"_updatedAt":564,"slug":593,"title":595},"wp-tagcat-stackexchange",{"current":594},"stackexchange","Stackexchange",{"_createdAt":564,"_id":597,"_rev":566,"_type":567,"_updatedAt":564,"slug":598,"title":600},"wp-tagcat-stackoverflow",{"current":599},"stackoverflow","Stackoverflow","Updating Navigation for Stack Overflow, Enterprise, and Stack Exchange Sites",[603,609,615,621],{"_id":604,"publishedAt":605,"slug":606,"sponsored":12,"title":608},"370eca08-3da8-4a13-b71e-5ab04e7d1f8b","2025-08-28T16:00:00.000Z",{"_type":10,"current":607},"moving-the-public-stack-overflow-sites-to-the-cloud-part-1","Moving the public Stack Overflow sites to the cloud: Part 1",{"_id":610,"publishedAt":611,"slug":612,"sponsored":551,"title":614},"e10457b6-a9f6-4aa9-90f2-d9e04eb77b7c","2025-08-27T04:40:00.000Z",{"_type":10,"current":613},"from-punch-cards-to-prompts-a-history-of-how-software-got-better","From punch cards to prompts: a history of how software got better",{"_id":616,"publishedAt":617,"slug":618,"sponsored":12,"title":620},"65472515-0b62-40d1-8b79-a62bdd2f508a","2025-08-25T16:00:00.000Z",{"_type":10,"current":619},"making-continuous-learning-work-at-work","Making continuous learning work at work",{"_id":622,"publishedAt":623,"slug":624,"sponsored":12,"title":626},"1b0bdf8c-5558-4631-80ca-40cb8e54b571","2025-08-21T14:00:25.054Z",{"_type":10,"current":625},"research-roadmap-update-august-2025","Research roadmap update, August 2025",{"count":628,"lastTimestamp":629},9,"2023-05-25T09:46:33Z",["Reactive",631],{"$sarticleModal":632},false,["Set"],["ShallowReactive",635],{"sanity-yGHFafAOGhfbzIv3WybgXNriBrJAwSC4MgJCOzVuEJk":-1,"sanity-comment-wp-post-8994-1756387747076":-1},"/2018/02/08/information-architecture-navigating-stack-overflow-enterprise-stack-exchange-sites"]