User:SGrabarczuk (WMF)/sandbox/blog post

Our improved desktop Wikipedia experience is almost here. Get the latest updates.

Since 2019, the Web team at the Wikimedia Foundation has been working to create a better desktop experience for Wikipedia readers and community members, regardless of their language or location. Our focus is on creating a more welcoming experience, ensuring that anyone who comes to our sites can easily find the knowledge they need, and for those interested, the tools they need to begin their journey towards contributing.

The process of changing Wikipedia is a complex one. We have worked feature by feature, with the global volunteer community, to optimize every important function or tool to serve the various needs of our diverse contributors and readers. We began by making changes to the navigation, introducing a collapsible sidebar and a limited content width and continued by refining some of our most used tools like search and language switching. Since our last post on Diff, we have made even more significant changes to the experience. These changes, as explained below, are to make sure our interface is welcoming, intuitive, and easy to use.

User Menu

Becoming a Wikipedia editor is exciting and rewarding. Yet, oftentimes, it takes a while to learn the details of the site, its navigation, and to understand the tools necessary and available to edit tasks and participate in conversations successfully.

Unfortunately, our previous navigation system did not provide new editors with much guidance on this journey. The top right corner of the page was full of links, such as: user name, talk, sandbox, preferences, beta, watchlist, contributions, log out. These not only took up important space on the page, making the interface feel cluttered and unfocused. They also did not indicate their purpose and how, or if, they were related to one another.

These links are what we call the user tools — instrumental to helping a user become an efficient editor. They provide entry points to a user’s sandbox — the place where they can begin working on articles, their personal talk page where they can discuss questions and needs with other editors, their preferences where they can set the settings and customizations they need from the interface, and more.

The lack of cohesion between these links often led to confusion. For example, when two links on a page are both named “talk”, how can we set an expectation that they lead to different places?

Our solution was simple: gather all links that pertained to the user and their personal tools under a single menu. This not only reduced visual clutter, but also created a better-organized interface in which it is clear where personal links are located.

Sticky Header

Currently, many of the essential tools that readers or editors use when browsing or contributing to Wikipedia are located at the top of the page. This is where people search for a new article to read, reference the history of edits and versions an article went through, or access the discussion on an existing article to ask important questions before making an edit. These functionalities are vital to the usage of Wikipedia. Yet, previously, they were only available in a single location — at the very top of the page.

Imagine you are an editor reading an article and you notice something off — a sentence that doesn’t make sense or a date that is clearly wrong — a potential case of vandalism. Your next step would be to go to the history page immediately to see when the last change was made, and who made it. Right now, you would have to scroll to the top of the page, every single time. With short articles, this wouldn’t be an issue, with a quick scroll you are there. However, for a longer article, you would find yourself scrolling for a while, and losing valuable time in the process.

We decided to improve this by making certain important functionality accessible throughout the page via a fixed or sticky header.

Our first task here was deciding which functionality to include. To answer this question, we looked at two things: 1) the data we currently had: which links were getting the most clicks, and 2) the needs of users in different areas, especially within emerging markets. We were able to work with the design research team and a number of contractors to survey multiple communities of readers and editors and do in-depth testing and research to define this. Overall, we performed testing in Ghana, Argentina, and Indonesia. This allowed us to select the types of links to be included in the sticky header. We then continued with further testing within our communities, receiving inputs across 30 languages and iterating on the feedback.

Our new persistent or “sticky” header allows direct access to the most important functionality for readers and editors — search, language switching, links to history and talk pages, and more, decreasing the need to scroll to the top of the page in order to use a given link by 16 percent.

Table of Contents

Similar to the header, the table of contents was previously only available at the very top of the page, causing unnecessary scrolling. Unlike the sticky header, which was more closely related to the tools, the table of contents and its location affected the perception of the content itself.

Important context about the page or article — how long it is, how many sections it has, and what their content is, was lost once you scrolled down. Jumping from section to section was impossible, locking the user into reading the article linearly and spending a long time finding the exact piece of information they are looking for.

By making the table of contents persistent as you scroll, we make sure that people have the necessary context they need, as well as the ability to jump from section to section whenever they want.

As with the sticky header, we were able to test different versions of the table of contents with new and existing readers in three of our target markets - Ghana, Argentina, and Indonesia. This testing was crucial. It allowed us to narrow down multiple prototypes to one single design, define the basic requirements for the feature, and identify what readers really needed from a table of contents.

Next, we tested with our editors across 30 languages. They focused on the details, identifying their special needs, and edge cases that only people with a lot of experience on the site would notice.

Currently, our new table of contents is available on our pilot wikis, as well as for all those who have opted into the new experience.

Next Steps

We are excited to share that we are approaching the last stages of the Desktop Improvements Project. We will be putting the final touches on our current work, and we hope to bring the updated desktop to every Wikipedia in the coming months. So far, the latest iteration of the desktop has been deployed on 31 language versions, and will include Arabic and Japanese Wikipedias next.

We welcome feedback on the ideas presented above, as well as any others that might help in creating a more welcoming and intuitive interface for both readers and editors. If you have an account, you can also follow along with our changes as they come to you – just go to your Preferences page and select the Vector (2022) option in the second (Appearance) tab. You can also contact us on MediaWiki. Reach out to us with your thoughts in any language!