What’s the redesigning campaign – in a nutshell?

Question

On my favourite site, a new design was announced. It contained a lot of links to posts which in turn contain a lot of links, answers, timelines, and references to stuff like Teams which is not relevant to me. So, I am pretty overwhelmed and confused. I am therefore asking for a summary of what I need to know for understanding, evaluating, and criticising the design for proposed for my site, specifically:

• What major changes can I expect when switching to the new theme?

• What is the rationale behind the change as a whole as well as the major or controversial changes? What is this responsive design everybody is talking about?

• What are the restrictions of the new unified theme?

• What parts are still customisable for each site?

• What are the most common suggestions and what is their current state (rejected, in progress)? I am asking this, so I can avoid redundant worries and criticism.

This is intended as a FAQ to be posted as a reference in the individual design announcements instead of the convoluted general announcements, requests for comments, and similar. It should be mainly self-contained and only contain links for further reading and reference. Please make answering this a collaborative effort. Also feel free to improve the question.

Answer 1

What major changes can I expect when switching to the new theme?

The main site navigation links move from the top to a sidebar on the left. On narrower monitors, this tends to push the right sidebar off the edge of the viewport, unless the left sidebar is collapsed in preferences.

On sites that previously had extensive theming, the new theme brings them down to the subset of visual features common to all sites.

What is the rationale behind the change as a whole as well as the major or controversial changes? What is this responsive design everybody is talking about?

The basic purpose is threefold: to allow more stuff to be put into navigation, to make pages usable on a wider variety of screens, and to reduce ongoing design costs of individual site themes.

"Responsive" design is an approach that relies on relatively flexible layouts and smoothly resizing/shuffling the major elements in the layout in order to handle a range of different screen widths without needing to be zoomed or scrolled. Ideally, the same website can be used efficiently on a small phone screen and a 4k monitor.

What are the restrictions of the new unified theme?

Site themes can pick which of several font chains to use, but can't pick fonts not on the lists. Voting arrows, blockquotes, and tags are not customizable. MathJax is not responsive. The size and location of the header logo can't be changed.

What parts are still customisable for each site?

Background images, favicons, site header logos, link color, accent color, badge icons.

Answer 2

What is the rationale behind the change as a whole as well as the major or controversial changes? What is this responsive design everybody is talking about?

It is very difficult to put all the information in a nutshell, but I believe this one-page report on the Stack Overflow Blog, written by Donna Choi, is a good beginning. I have, of course, summarised the main points.

Updating Navigation for Stack Overflow, Enterprise, and Stack Exchange Sites

• … “Channels”, a product which is now called “Teams.”

• …this project required a change to Stack Overflow’s information architecture. We created several prototype navigations, narrowed to two, and tested with a group of users. This brought us to the following design direction, with content navigation on the left side:

• 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.

• 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.

• … fragmentation means that shipping basic improvements to Enterprise and network sites becomes increasingly costly as differences accumulate over time…basic improvements like accessibility and responsiveness can benefit our 150+ communities and Enterprise clients as quickly as possible.

Below is a mock-up of a Stack Overflow user's page. This format will be identical for every single user, regardless if they are a member of SO or not, regardless if they are a computer engineer or not. But seeing as 70% users also have a Stack Overflow account, this will have a minimal impact on the majority.

• 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.

For example

1. A new product offering that is a separate entity from Stack Overflow
2. A new feature on Stack Overflow

Further on

• 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.
• 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.

What are the restrictions of the new unified theme?

1. The layout of the theme is unnegotiable. (see mockup)
2. The website's name (site header logo) will always be pushed to the left.
3. The site logo cannot increase in size.
4. The top bar is not considered to be part of the theme and therefor remains ubiquitous

We released the new top bar for all users across all communities. (Oct 9 '17)
Color - The top bar needs to be black on network sites, since that works best with the many themes. The SO top bar color was a branding decision and won't be changed to black.